function _array_like_to_array(arr, len) {
    if (len == null || len > arr.length) len = arr.length;
    for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
    return arr2;
}
function _array_with_holes(arr) {
    if (Array.isArray(arr)) return arr;
}
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
    try {
        var info = gen[key](arg);
        var value = info.value;
    } catch (error) {
        reject(error);
        return;
    }
    if (info.done) {
        resolve(value);
    } else {
        Promise.resolve(value).then(_next, _throw);
    }
}
function _async_to_generator(fn) {
    return function() {
        var self = this, args = arguments;
        return new Promise(function(resolve, reject) {
            var gen = fn.apply(self, args);
            function _next(value) {
                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
            }
            function _throw(err) {
                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
            }
            _next(undefined);
        });
    };
}
function _iterable_to_array_limit(arr, i) {
    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
    if (_i == null) return;
    var _arr = [];
    var _n = true;
    var _d = false;
    var _s, _e;
    try {
        for(_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true){
            _arr.push(_s.value);
            if (i && _arr.length === i) break;
        }
    } catch (err) {
        _d = true;
        _e = err;
    } finally{
        try {
            if (!_n && _i["return"] != null) _i["return"]();
        } finally{
            if (_d) throw _e;
        }
    }
    return _arr;
}
function _non_iterable_rest() {
    throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
function _sliced_to_array(arr, i) {
    return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
}
function _unsupported_iterable_to_array(o, minLen) {
    if (!o) return;
    if (typeof o === "string") return _array_like_to_array(o, minLen);
    var n = Object.prototype.toString.call(o).slice(8, -1);
    if (n === "Object" && o.constructor) n = o.constructor.name;
    if (n === "Map" || n === "Set") return Array.from(n);
    if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
}
function _ts_generator(thisArg, body) {
    var f, y, t, g, _ = {
        label: 0,
        sent: function() {
            if (t[0] & 1) throw t[1];
            return t[1];
        },
        trys: [],
        ops: []
    };
    return g = {
        next: verb(0),
        "throw": verb(1),
        "return": verb(2)
    }, typeof Symbol === "function" && (g[Symbol.iterator] = function() {
        return this;
    }), g;
    function verb(n) {
        return function(v) {
            return step([
                n,
                v
            ]);
        };
    }
    function step(op) {
        if (f) throw new TypeError("Generator is already executing.");
        while(_)try {
            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
            if (y = 0, t) op = [
                op[0] & 2,
                t.value
            ];
            switch(op[0]){
                case 0:
                case 1:
                    t = op;
                    break;
                case 4:
                    _.label++;
                    return {
                        value: op[1],
                        done: false
                    };
                case 5:
                    _.label++;
                    y = op[1];
                    op = [
                        0
                    ];
                    continue;
                case 7:
                    op = _.ops.pop();
                    _.trys.pop();
                    continue;
                default:
                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
                        _ = 0;
                        continue;
                    }
                    if (op[0] === 3 && (!t || op[1] > t[0] && op[1] < t[3])) {
                        _.label = op[1];
                        break;
                    }
                    if (op[0] === 6 && _.label < t[1]) {
                        _.label = t[1];
                        t = op;
                        break;
                    }
                    if (t && _.label < t[2]) {
                        _.label = t[2];
                        _.ops.push(op);
                        break;
                    }
                    if (t[2]) _.ops.pop();
                    _.trys.pop();
                    continue;
            }
            op = body.call(thisArg, _);
        } catch (e) {
            op = [
                6,
                e
            ];
            y = 0;
        } finally{
            f = t = 0;
        }
        if (op[0] & 5) throw op[1];
        return {
            value: op[0] ? op[1] : void 0,
            done: true
        };
    }
}
import React, { lazy, Suspense, useEffect, useMemo, useRef } from "react";
import { useGetSetState } from "react-use";
import { useIntersectionOnce } from "../../Hooks/useIntersectionOnce";
import { isCodeBlockLikelyComplete } from "../../MarkdownEditor/editor/utils/findMatchingClose";
var mermaidLoader = null;
/**
 * 加载 Mermaid 库
 * 使用单例模式确保只加载一次，并初始化配置
 */ export var loadMermaid = /*#__PURE__*/ function() {
    var _ref = _async_to_generator(function() {
        return _ts_generator(this, function(_state) {
            if (typeof window === 'undefined') {
                throw new Error('Mermaid 仅在浏览器环境中可用');
            }
            if (!mermaidLoader) {
                // 使用 webpack 魔法注释确保正确代码分割和解析
                // webpackChunkName 指定 chunk 名称，webpackMode 指定加载模式
                mermaidLoader = import(/* webpackChunkName: "mermaid" */ /* webpackMode: "lazy" */ "mermaid").then(function(module) {
                    var api = module.default;
                    if (api === null || api === void 0 ? void 0 : api.initialize) {
                        api.initialize({
                            startOnLoad: false
                        });
                    }
                    return api;
                }).catch(function(error) {
                    mermaidLoader = null;
                    throw error;
                });
            }
            return [
                2,
                mermaidLoader
            ];
        });
    });
    return function loadMermaid() {
        return _ref.apply(this, arguments);
    };
}();
/**
 * Mermaid 渲染器组件实现
 * 负责实际的图表渲染逻辑
 */ /**
 * 检查 Mermaid 代码是否可能完整
 * 用于流式输入时判断是否应该尝试渲染
 */ var isCodeLikelyComplete = function(code) {
    return isCodeBlockLikelyComplete(code, 'mermaid');
};
var MermaidRendererImpl = function(props) {
    var _props_element;
    var _useGetSetState = _sliced_to_array(useGetSetState({
        code: '',
        error: '',
        isTyping: false
    }), 2), state = _useGetSetState[0], setState = _useGetSetState[1];
    var containerRef = useRef(null);
    var divRef = useRef(null);
    var timer = useRef(null);
    var renderTimer = useRef(null); // 实际渲染的定时器
    var mermaidRef = useRef(null);
    var lastCodeRef = useRef(''); // 记录上一次的代码
    var changeCountRef = useRef(0); // 记录变化次数
    var id = useMemo(function() {
        return 'm' + (Date.now() + Math.ceil(Math.random() * 1000));
    }, []);
    var isVisible = useIntersectionOnce(containerRef);
    useEffect(function() {
        var nextCode = props.element.value || '';
        var currentState = state();
        if (!isVisible) {
            return undefined;
        }
        // 如果代码没有变化且没有错误，不需要重新渲染
        if (currentState.code === nextCode && currentState.error === '') {
            return undefined;
        }
        // 清理所有定时器
        if (timer.current !== null) {
            window.clearTimeout(timer.current);
            timer.current = null;
        }
        if (renderTimer.current !== null) {
            window.clearTimeout(renderTimer.current);
            renderTimer.current = null;
        }
        if (!nextCode) {
            timer.current = window.setTimeout(function() {
                setState({
                    code: '',
                    error: '',
                    isTyping: false
                });
                if (divRef.current) {
                    divRef.current.innerHTML = '';
                }
                lastCodeRef.current = '';
                changeCountRef.current = 0;
                timer.current = null;
            }, 0);
            return function() {
                if (timer.current !== null) {
                    window.clearTimeout(timer.current);
                    timer.current = null;
                }
            };
        }
        // 检测代码是否在快速变化（流式输入）
        var isCodeChanging = nextCode !== lastCodeRef.current;
        if (isCodeChanging) {
            changeCountRef.current += 1;
            lastCodeRef.current = nextCode;
            // 如果代码在快速变化，标记为正在输入
            setState({
                isTyping: true
            });
        }
        // 检查代码是否可能完整
        var likelyComplete = isCodeLikelyComplete(nextCode);
        // 防抖延迟：根据代码变化频率动态调整
        // 如果代码变化频繁（流式输入），使用更长的延迟以减少抖动
        var baseDelay = 500; // 增加基础延迟
        var typingDelay = changeCountRef.current > 3 ? 1500 : 1200; // 频繁变化时延长到 1.5 秒
        var delay = currentState.code ? likelyComplete ? baseDelay : typingDelay : 0;
        // 第一层防抖：检测代码变化
        timer.current = window.setTimeout(function() {
            // 再次检查代码是否还在变化
            var finalCode = props.element.value || '';
            if (finalCode !== nextCode) {
                // 代码还在变化，重新调度
                timer.current = null;
                return;
            }
            // 第二层防抖：实际渲染
            // 如果代码可能不完整，再等待一段时间，增加延迟以减少抖动
            var finalDelay = likelyComplete ? 200 : 800; // 增加延迟时间
            renderTimer.current = window.setTimeout(/*#__PURE__*/ _async_to_generator(function() {
                var _mermaidRef_current, api, _tmp, trimmedCode, svg, container, error, api1, finalCode, parseError, tempElement;
                return _ts_generator(this, function(_state) {
                    switch(_state.label){
                        case 0:
                            _state.trys.push([
                                0,
                                5,
                                10,
                                11
                            ]);
                            if (!((_mermaidRef_current = mermaidRef.current) !== null && _mermaidRef_current !== void 0)) return [
                                3,
                                1
                            ];
                            _tmp = _mermaidRef_current;
                            return [
                                3,
                                3
                            ];
                        case 1:
                            return [
                                4,
                                loadMermaid()
                            ];
                        case 2:
                            _tmp = _state.sent();
                            _state.label = 3;
                        case 3:
                            api = _tmp;
                            mermaidRef.current = api;
                            // 验证代码是否完整（基本检查）
                            trimmedCode = nextCode.trim();
                            if (!trimmedCode) {
                                setState({
                                    code: '',
                                    error: ''
                                });
                                if (divRef.current) {
                                    divRef.current.innerHTML = '';
                                }
                                timer.current = null;
                                return [
                                    2
                                ];
                            }
                            return [
                                4,
                                api.render(id, trimmedCode)
                            ];
                        case 4:
                            svg = _state.sent().svg;
                            if (divRef.current) {
                                // 使用更平滑的更新方式，避免抖动
                                // 先设置透明度，然后更新内容，最后恢复透明度
                                container = divRef.current;
                                // 如果已有内容，先淡出
                                if (container.children.length > 0) {
                                    container.style.opacity = '0';
                                    container.style.transition = 'opacity 0.2s ease-in-out';
                                }
                                // 使用 requestAnimationFrame 确保平滑更新
                                requestAnimationFrame(function() {
                                    // 清理旧内容
                                    container.innerHTML = '';
                                    // 创建隔离的容器包装 SVG
                                    var wrapper = document.createElement('div');
                                    wrapper.style.cssText = "\n                position: relative;\n                width: 100%;\n                max-width: 100%;\n                overflow: hidden;\n                isolation: isolate;\n                contain: layout style paint;\n                display: flex;\n                justify-content: center;\n                align-items: center;\n                min-height: 200px; /* 保持最小高度，避免尺寸抖动 */\n              ";
                                    // 解析 SVG 并添加隔离属性
                                    var parser = new DOMParser();
                                    var svgDoc = parser.parseFromString(svg, 'image/svg+xml');
                                    var svgElement = svgDoc.querySelector('svg');
                                    if (svgElement) {
                                        // 确保 SVG 不会溢出
                                        var existingStyle = svgElement.getAttribute('style') || '';
                                        var newStyle = "".concat(existingStyle, "; max-width: 100%; height: auto; overflow: hidden;").trim();
                                        svgElement.setAttribute('style', newStyle);
                                        // 添加隔离属性和类名
                                        svgElement.setAttribute('data-mermaid-svg', 'true');
                                        svgElement.setAttribute('class', (svgElement.getAttribute('class') || '') + ' mermaid-isolated');
                                        // 限制 SVG 内部元素的样式影响范围
                                        var allElements = svgElement.querySelectorAll('*');
                                        allElements.forEach(function(el) {
                                            // 确保内部元素不会影响外部
                                            if (el instanceof SVGElement) {
                                                el.setAttribute('data-mermaid-internal', 'true');
                                            }
                                        });
                                        wrapper.appendChild(svgElement);
                                    } else {
                                        // 如果解析失败，直接使用原始 SVG，但添加包装
                                        var tempDiv = document.createElement('div');
                                        tempDiv.innerHTML = svg;
                                        var extractedSvg = tempDiv.querySelector('svg');
                                        if (extractedSvg) {
                                            extractedSvg.setAttribute('style', 'max-width: 100%; height: auto; overflow: hidden;');
                                            extractedSvg.setAttribute('data-mermaid-svg', 'true');
                                            wrapper.appendChild(extractedSvg);
                                        } else {
                                            wrapper.innerHTML = svg;
                                        }
                                    }
                                    container.appendChild(wrapper);
                                    // 恢复透明度，实现淡入效果
                                    requestAnimationFrame(function() {
                                        container.style.opacity = '1';
                                        container.style.transition = 'opacity 0.3s ease-in-out';
                                    });
                                });
                            }
                            // 渲染成功，重置状态
                            setState({
                                code: nextCode,
                                error: '',
                                isTyping: false
                            });
                            changeCountRef.current = 0; // 重置变化计数
                            return [
                                3,
                                11
                            ];
                        case 5:
                            error = _state.sent();
                            api1 = mermaidRef.current;
                            finalCode = props.element.value || '';
                            // 如果代码还在变化中，不显示错误（可能是中间状态）
                            if (finalCode !== nextCode || state().isTyping) {
                                // 代码还在变化，可能是流式输入，不显示错误
                                renderTimer.current = null;
                                return [
                                    2
                                ];
                            }
                            if (!api1) return [
                                3,
                                9
                            ];
                            _state.label = 6;
                        case 6:
                            _state.trys.push([
                                6,
                                8,
                                ,
                                9
                            ]);
                            return [
                                4,
                                api1.parse(finalCode)
                            ];
                        case 7:
                            _state.sent();
                            // 如果能解析，说明可能是渲染问题，不显示错误
                            renderTimer.current = null;
                            return [
                                2
                            ];
                        case 8:
                            parseError = _state.sent();
                            // 确实是语法错误，但只在代码稳定后显示
                            if (finalCode === nextCode && !state().isTyping) {
                                setState({
                                    error: String(parseError),
                                    code: '',
                                    isTyping: false
                                });
                                // 确保清理渲染内容
                                if (divRef.current) {
                                    divRef.current.innerHTML = '';
                                }
                            }
                            renderTimer.current = null;
                            return [
                                2
                            ];
                        case 9:
                            // 其他错误，只在代码稳定后显示
                            if (finalCode === nextCode && !state().isTyping) {
                                setState({
                                    error: String(error),
                                    code: '',
                                    isTyping: false
                                });
                                // 确保清理渲染内容
                                if (divRef.current) {
                                    divRef.current.innerHTML = '';
                                }
                            }
                            return [
                                3,
                                11
                            ];
                        case 10:
                            // 清理 Mermaid 生成的临时元素
                            tempElement = document.querySelector('#d' + id);
                            if (tempElement) {
                                tempElement.classList.add('hidden');
                                // 尝试移除临时元素，避免 DOM 污染
                                try {
                                    if (tempElement.parentNode) {
                                        tempElement.parentNode.removeChild(tempElement);
                                    }
                                } catch (e) {
                                // 忽略移除失败
                                }
                            }
                            renderTimer.current = null;
                            return [
                                7
                            ];
                        case 11:
                            timer.current = null;
                            return [
                                2
                            ];
                    }
                });
            }), finalDelay);
        }, delay);
        return function() {
            if (timer.current !== null) {
                window.clearTimeout(timer.current);
                timer.current = null;
            }
            if (renderTimer.current !== null) {
                window.clearTimeout(renderTimer.current);
                renderTimer.current = null;
            }
        };
    }, [
        props === null || props === void 0 ? void 0 : (_props_element = props.element) === null || _props_element === void 0 ? void 0 : _props_element.value,
        id,
        isVisible,
        setState,
        state
    ]);
    var snapshot = state();
    return /*#__PURE__*/ React.createElement("div", {
        ref: containerRef,
        style: {
            marginBottom: '0.75em',
            cursor: 'default',
            userSelect: 'none',
            padding: '0.75rem 0',
            borderRadius: '1em',
            display: 'flex',
            justifyContent: 'center',
            // 增加隔离：防止内容溢出影响其他元素
            position: 'relative',
            isolation: 'isolate',
            contain: 'layout style paint',
            overflow: 'hidden'
        },
        contentEditable: false
    }, /*#__PURE__*/ React.createElement("div", {
        contentEditable: false,
        ref: divRef,
        style: {
            width: '100%',
            maxWidth: '100%',
            minHeight: '200px',
            display: 'flex',
            justifyContent: 'center',
            visibility: snapshot.code && !snapshot.error ? 'visible' : 'hidden',
            // 增加隔离样式
            position: 'relative',
            isolation: 'isolate',
            contain: 'layout style paint',
            overflow: 'hidden',
            // 防止 SVG 样式影响外部
            pointerEvents: snapshot.code && !snapshot.error ? 'auto' : 'none',
            // 添加过渡效果，使更新更平滑
            transition: 'opacity 0.3s ease-in-out, min-height 0.2s ease-in-out'
        },
        // 使用 data 属性标记，方便样式隔离
        "data-mermaid-container": "true"
    }), snapshot.isTyping && !snapshot.code && /*#__PURE__*/ React.createElement("div", {
        style: {
            textAlign: 'center',
            color: '#6B7280',
            padding: '0.5rem',
            position: 'relative',
            zIndex: 1,
            fontStyle: 'italic'
        }
    }, "正在加载..."), snapshot.error && !snapshot.isTyping && /*#__PURE__*/ React.createElement("div", {
        style: {
            textAlign: 'center',
            color: 'rgba(239, 68, 68, 0.8)',
            padding: '0.5rem',
            // 错误信息也增加隔离
            position: 'relative',
            zIndex: 1,
            wordBreak: 'break-word',
            maxWidth: '100%'
        }
    }, snapshot.error), !snapshot.code && !snapshot.error && !snapshot.isTyping && /*#__PURE__*/ React.createElement("div", {
        style: {
            textAlign: 'center',
            color: '#6B7280',
            padding: '0.5rem',
            position: 'relative',
            zIndex: 1
        }
    }, "Empty"));
};
/**
 * Mermaid 渲染器组件
 * 使用 React.lazy 延迟加载，仅在需要时加载 mermaid 库
 */ var MermaidRenderer = /*#__PURE__*/ lazy(/*#__PURE__*/ _async_to_generator(function() {
    return _ts_generator(this, function(_state) {
        switch(_state.label){
            case 0:
                return [
                    4,
                    loadMermaid()
                ];
            case 1:
                _state.sent();
                return [
                    2,
                    {
                        default: MermaidRendererImpl
                    }
                ];
        }
    });
}));
/**
 * 加载中的占位组件
 */ var MermaidFallback = function() {
    return /*#__PURE__*/ React.createElement("div", {
        style: {
            marginBottom: '0.75em',
            padding: '0.75rem 0',
            display: 'flex',
            justifyContent: 'center',
            alignItems: 'center',
            color: '#6B7280'
        }
    }, "加载中...");
};
/**
 * Mermaid 组件 - Mermaid图表渲染组件
 *
 * 该组件使用Mermaid库渲染图表，支持流程图、时序图、甘特图等。
 * 使用 React.lazy 和 Suspense 实现代码分割和延迟加载，优化性能。
 *
 * @component
 * @description Mermaid图表渲染组件，支持各种Mermaid图表类型
 * @param {Object} props - 组件属性
 * @param {CodeNode} props.element - 代码节点，包含Mermaid图表代码
 * @param {string} [props.element.value] - Mermaid图表代码字符串
 *
 * @example
 * ```tsx
 * <Mermaid
 *   element={{
 *     type: 'code',
 *     value: 'graph TD\nA[开始] --> B[处理] --> C[结束]'
 *   }}
 * />
 * ```
 *
 * @returns {React.ReactElement} 渲染的Mermaid图表组件
 *
 * @remarks
 * - 基于Mermaid库实现图表渲染
 * - 支持多种图表类型（流程图、时序图、甘特图等）
 * - 使用 React.lazy 和 Suspense 实现代码分割
 * - 提供延迟渲染优化性能
 * - 包含错误处理机制
 * - 支持空状态显示
 * - 提供美观的样式设计
 * - 禁用文本选择
 * - 居中显示图表
 * - 自动生成唯一ID
 */ export var Mermaid = function(props) {
    var isBrowser = typeof window !== 'undefined';
    if (!isBrowser) {
        return null;
    }
    return /*#__PURE__*/ React.createElement(Suspense, {
        fallback: /*#__PURE__*/ React.createElement(MermaidFallback, null)
    }, /*#__PURE__*/ React.createElement(MermaidRenderer, {
        element: props.element
    }));
};
