import { h } from "@stencil/core";
import { marked } from "marked";
export class InternalMarkdownRenderer {
    content = '';
    enableTables = true;
    enableTaskLists = true;
    enableFootnotes = true;
    highlightCode = true;
    renderedHtml = '';
    async componentWillLoad() {
        await this.renderMarkdown();
    }
    async contentChanged() {
        await this.renderMarkdown();
    }
    async renderMarkdown() {
        if (!this.content) {
            this.renderedHtml = '';
            return;
        }
        try {
            // 配置 marked
            marked.setOptions({
                breaks: true,
                gfm: true,
            });
            // 自定义渲染器
            const renderer = new marked.Renderer();
            // 链接渲染
            renderer.link = (token) => {
                const href = token.href;
                const title = token.title ? ` title="${token.title}"` : '';
                return `<a href="${href}" target="_blank" rel="noopener noreferrer"${title}>${token.text}</a>`;
            };
            // 图片渲染
            renderer.image = (token) => {
                const src = token.href;
                const alt = token.text;
                const title = token.title ? ` title="${token.title}"` : '';
                return `<img src="${src}" alt="${alt}"${title} class="markdown-image" />`;
            };
            // 代码渲染
            renderer.code = (token) => {
                const code = token.text;
                const lang = token.lang || '';
                const className = lang ? `language-${lang}` : '';
                return `<pre><code class="${className}">${code}</code></pre>`;
            };
            // 表格渲染
            if (this.enableTables) {
                renderer.table = (token) => {
                    let html = '<table class="markdown-table">';
                    // 表头
                    if (token.header) {
                        html += '<thead><tr>';
                        token.header.forEach(cell => {
                            html += `<th>${cell}</th>`;
                        });
                        html += '</tr></thead>';
                    }
                    // 表体
                    if (token.rows) {
                        html += '<tbody>';
                        token.rows.forEach(row => {
                            html += '<tr>';
                            row.forEach(cell => {
                                html += `<td>${cell}</td>`;
                            });
                            html += '</tr>';
                        });
                        html += '</tbody>';
                    }
                    html += '</table>';
                    return html;
                };
            }
            marked.use({ renderer });
            const html = await marked(this.content);
            this.renderedHtml = html;
        }
        catch (error) {
            console.error('Markdown rendering error:', error);
            this.renderedHtml = this.content;
        }
    }
    render() {
        return (h("div", { key: '02f734ceb575c142011d761b1e948f3e28222a8b', class: "markdown-renderer", innerHTML: this.renderedHtml }));
    }
    static get is() { return "internal-markdown-renderer"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["markdown-renderer.css"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["markdown-renderer.css"]
        };
    }
    static get properties() {
        return {
            "content": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "content",
                "defaultValue": "''"
            },
            "enableTables": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "enable-tables",
                "defaultValue": "true"
            },
            "enableTaskLists": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "enable-task-lists",
                "defaultValue": "true"
            },
            "enableFootnotes": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "enable-footnotes",
                "defaultValue": "true"
            },
            "highlightCode": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "highlight-code",
                "defaultValue": "true"
            }
        };
    }
    static get states() {
        return {
            "renderedHtml": {}
        };
    }
    static get watchers() {
        return [{
                "propName": "content",
                "methodName": "contentChanged"
            }];
    }
}
//# sourceMappingURL=markdown-renderer.js.map
