bhd-components 0.10.12 → 0.10.13

package/esm/AIMessageList/components/virtuosoList/index.js

@@ -0,0 +1,673 @@
+import { _ as _instanceof } from "@swc/helpers/_/_instanceof";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
+import { _ as _to_consumable_array } from "@swc/helpers/_/_to_consumable_array";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@ice/jsx-runtime/jsx-runtime";
+import React, { useRef, useState, useCallback, useEffect, forwardRef, useImperativeHandle } from "react";
+import styles from "./index.module.less";
+import { copyText, findParent, delegate } from "../../../utils/dom";
+import { Virtuoso } from "react-virtuoso";
+import loading2Gif from "../../../images/loading2";
+import { parseDate } from "../../../utils/Date";
+import { Remarkable } from "remarkable";
+import hljs from "highlight.js";
+import "highlight.js/styles/github.css";
+import CopyIcon from "../copyIcon";
+import ReferencesIcon from "../referencesIcon";
+import { UpVoteBtn, DownVoteBtn } from "../remarkBtn";
+import RefreshBtn from "../refreshBtn";
+import { fileIconRender } from "../fileList/fileIcon";
+var Header = function(param) {
+    var context = param.context;
+    var prefix = context.prefix, loading = context.loading;
+    if (!loading) return null;
+    var getCls = function(clsName) {
+        return styles[clsName] + " " + prefix + "-" + clsName;
+    };
+    return /*#__PURE__*/ _jsx("div", {
+        className: "".concat(getCls("loadingIcon")),
+        children: /*#__PURE__*/ _jsx("img", {
+            src: loading2Gif,
+            alt: ""
+        })
+    });
+};
+var remarkable = new Remarkable({
+    highlight: function highlight(str, lang) {
+        if (lang && hljs.getLanguage(lang)) {
+            try {
+                return hljs.highlight(lang, str).value;
+            } catch (err) {}
+        }
+        try {
+            return hljs.highlightAuto(str).value;
+        } catch (err) {}
+        return ""; // use external default escaping
+    }
+});
+var VirtuosoList = /*#__PURE__*/ forwardRef(function(props, ref) {
+    var prefix = props.prefix, contentConfig = props.contentConfig, apiRef = props.apiRef;
+    var getList = contentConfig.getList, coverRenderText = contentConfig.coverRenderText, _contentConfig_msgAction = contentConfig.msgAction, msgAction = _contentConfig_msgAction === void 0 ? [
+        "copy",
+        "reference"
+    ] : _contentConfig_msgAction, coverRenderReferences = contentConfig.coverRenderReferences, _contentConfig_onRecordMessage = contentConfig.onRecordMessage, onRecordMessage = _contentConfig_onRecordMessage === void 0 ? function() {} : _contentConfig_onRecordMessage, _contentConfig_onVoteChange = contentConfig.onVoteChange, onVoteChange = _contentConfig_onVoteChange === void 0 ? function() {} : _contentConfig_onVoteChange, _contentConfig_onRefresh = contentConfig.onRefresh, onRefresh = _contentConfig_onRefresh === void 0 ? function() {} : _contentConfig_onRefresh, helloMsg = contentConfig.helloMsg, _contentConfig_fileCustomRender = contentConfig.fileCustomRender, fileCustomRender = _contentConfig_fileCustomRender === void 0 ? {} : _contentConfig_fileCustomRender;
+    var loadMoreProps = contentConfig.loadMore || true;
+    var virtuosoRef = useRef(null);
+    var _useState = _sliced_to_array(useState(false), 2), loading = _useState[0], setLoading = _useState[1]; // 是否加载中
+    var _useState1 = _sliced_to_array(useState([]), 2), dataSource = _useState1[0], setDataSource = _useState1[1];
+    var _useState2 = _sliced_to_array(useState(0), 2), firstItemIndex = _useState2[0], setFirstItemIndex = _useState2[1];
+    var _useState3 = _sliced_to_array(useState(1), 2), page = _useState3[0], setPage = _useState3[1];
+    var _useState4 = _sliced_to_array(useState(""), 2), sendingId = _useState4[0], setSendingId = _useState4[1];
+    var _useState5 = _sliced_to_array(useState(contentConfig.pageSize || 30), 2), pageSize = _useState5[0], setPageSize = _useState5[1];
+    var _useState6 = _sliced_to_array(useState(0), 2), total = _useState6[0], setTotal = _useState6[1];
+    var timerRef = useRef({
+        loadMore: null,
+        scrollTimer: null
+    });
+    var wrapperRef = useRef(null);
+    var recordRef = useRef({
+        page: page,
+        pageSize: pageSize,
+        total: total,
+        dataSource: dataSource,
+        maxPage: Math.ceil(total / pageSize),
+        sendingId: ""
+    });
+    var timeRenderCache = useRef(new Map()).current;
+    var autoScrollBottom = useRef(true);
+    var htmlRenderCache = useRef(new Map()).current;
+    useImperativeHandle(ref, function() {
+        return {
+            addMsg: addMsg,
+            updateMsg: function(id, obj) {
+                setDataSource(function(data) {
+                    return data.map(function(item) {
+                        if (item.id === id) {
+                            return _object_spread({}, item, obj);
+                        }
+                        return item;
+                    });
+                });
+            },
+            clearInputing: function clearInputing() {
+                setDataSource(function(data) {
+                    return data.filter(function(item) {
+                        return item.id !== "inputing";
+                    });
+                });
+            },
+            recordMsg: function(msg) {
+                onRecordMessage(msg);
+            },
+            getDataSource: function() {
+                return recordRef.current.dataSource;
+            },
+            upateDataSource: function(id, obj) {
+                setDataSource(function(list) {
+                    return list.map(function(item) {
+                        if (item.id === id) {
+                            return _object_spread({}, item, obj);
+                        }
+                        return item;
+                    });
+                });
+            },
+            changeDataSource: function(data) {
+                setDataSource(data);
+            },
+            scrollToBottom: scrollToBottom,
+            setSendingId: function(id) {
+                setSendingId(id);
+            }
+        };
+    });
+    useEffect(function() {
+        getData(page, pageSize).then(function() {
+            if (helloMsg) {
+                addMsg({
+                    id: "helloMsg",
+                    createTime: new Date().getTime(),
+                    content: helloMsg,
+                    location: "left",
+                    reference: null,
+                    source: null,
+                    fileList: []
+                });
+            }
+        });
+        var removeFn = delegate(wrapperRef.current, "click", ".".concat(styles.copyCode), function(event, target) {
+            findCopyContent(event);
+        });
+        return function() {
+            removeFn();
+            clearTimeout(timerRef.current.loadMore);
+            clearTimeout(timerRef.current.scrollTimer);
+        };
+    }, []);
+    useEffect(function() {
+        if (!virtuosoRef.current) return;
+    // virtuosoRef.current.scrollToIndex({
+    //   index: "LAST", // 或者使用 dataSource.length - 1
+    //   behavior: "auto", // 可以是 "smooth" 实现平滑滚动
+    // });
+    // clearTimeout(timerRef.current.scrollTimer);
+    // timerRef.current.scrollTimer = setTimeout(() => {
+    //   virtuosoRef.current.scrollToIndex({
+    //     index: "LAST", // 或者使用 dataSource.length - 1
+    //     behavior: "auto", // 可以是 "smooth" 实现平滑滚动
+    //     align: "end",
+    //   });
+    // }, 500);
+    }, [
+        dataSource
+    ]);
+    useEffect(function() {
+        recordRef.current.page = page;
+        recordRef.current.pageSize = pageSize;
+        recordRef.current.total = total;
+        recordRef.current.dataSource = dataSource;
+        recordRef.current.maxPage = Math.ceil(total / pageSize);
+        recordRef.current.sendingId = sendingId;
+        if (!sendingId) {
+            autoScrollBottom.current = true;
+        }
+    }, [
+        page,
+        pageSize,
+        total,
+        dataSource,
+        sendingId
+    ]);
+    var addMsg = function(msg) {
+        if (msg.id !== "inputing" && msg.id !== "helloMsg") {
+            // 不记录"正在输入..."的消息
+            onRecordMessage(msg);
+        }
+        var list = [];
+        if (msg.location === "right" && msg.fileList && msg.fileList.length > 0) {
+            console.log("fileList", msg, msg.fileList);
+            msg.fileList.map(function(item) {
+                list.push({
+                    type: "file",
+                    id: item.fileId,
+                    createTime: msg.createTime,
+                    content: "",
+                    location: "right",
+                    reference: null,
+                    source: null,
+                    suffix: item.suffix,
+                    fileTitle: item.name
+                });
+            });
+        }
+        list.push(msg);
+        setDataSource(function(data) {
+            return _to_consumable_array(data).concat(_to_consumable_array(list));
+        });
+        // timerRef.current.scrollTimer = setTimeout(() => {
+        scrollToBottom();
+    // }, 100);
+    };
+    var scrollToBottom = function() {
+        if (!virtuosoRef.current || !autoScrollBottom.current) return;
+        virtuosoRef.current.scrollToIndex({
+            index: "LAST",
+            align: "end",
+            behavior: "auto"
+        });
+    };
+    var getData = function(page, pageSize) {
+        setLoading(true);
+        return getList(page, pageSize).then(function(listObj) {
+            setLoading(false);
+            console.log("listObjlistObj", listObj);
+            setDataSource(function(data) {
+                return _to_consumable_array(data).concat(_to_consumable_array(listObj.dataSource));
+            });
+            setTotal(listObj.total);
+            setPage(page);
+            setPageSize(pageSize);
+            setFirstItemIndex(listObj.total - pageSize * (page - 1));
+        });
+    };
+    var getCls = function(clsName) {
+        return styles[clsName] + " " + prefix + "-" + clsName;
+    };
+    var loadMore = useCallback(function() {
+        if (!loadMoreProps) return;
+        if (recordRef.current.page >= recordRef.current.maxPage) return;
+        getData(page + 1, pageSize);
+    }, [
+        page,
+        pageSize
+    ]);
+    var itemContent = function(index, item) {
+        var timeNode = renderTime(item);
+        var contentNode = null;
+        var html = markToHtml(item.content, item.id);
+        contentNode = /*#__PURE__*/ _jsx("div", {
+            dangerouslySetInnerHTML: {
+                __html: html
+            }
+        });
+        if (coverRenderText) {
+            contentNode = coverRenderText(item, html);
+        }
+        if (item.type === "file") {
+            var renderFileObj = _object_spread({
+                fileTitleRender: function(item) {
+                    return /*#__PURE__*/ _jsx(_Fragment, {
+                        children: item.fileTitle
+                    });
+                }
+            }, fileCustomRender);
+            if (renderFileObj.fileRender) {
+                contentNode = renderFileObj.fileRender(item);
+            } else {
+                contentNode = /*#__PURE__*/ _jsxs("div", {
+                    className: "".concat(getCls("msgItem-file")),
+                    children: [
+                        /*#__PURE__*/ _jsx("div", {
+                            className: "".concat(getCls("msgItem-file-left")),
+                            children: fileIconRender(item.suffix, renderFileObj.iconFileRender)
+                        }),
+                        /*#__PURE__*/ _jsx("div", {
+                            className: "".concat(getCls("msgItem-file-right")),
+                            children: /*#__PURE__*/ _jsx("p", {
+                                children: renderFileObj.fileTitleRender(item)
+                            })
+                        })
+                    ]
+                });
+            }
+        }
+        // 是否显示时间
+        var itemNode = /*#__PURE__*/ _jsx("div", {
+            className: "".concat(getCls("msgItem"), " ").concat(item.location === "left" ? getCls("msgItem-left") : getCls("msgItem-right")),
+            children: /*#__PURE__*/ _jsxs("div", {
+                className: "".concat(getCls("msgItem-box")),
+                "data-id": item.id,
+                onMouseEnter: function() {
+                    return onMouseEnter(item);
+                },
+                onMouseLeave: function() {
+                    return onMouseLeave(item);
+                },
+                children: [
+                    renderAction("floatTop", item),
+                    /*#__PURE__*/ _jsxs("div", {
+                        className: "".concat(getCls("msgItem-content")),
+                        children: [
+                            /*#__PURE__*/ _jsx("div", {
+                                className: "".concat(getCls("msgItem-text")),
+                                children: contentNode
+                            }),
+                            renderAction("bottom", item)
+                        ]
+                    }),
+                    item.location === "left" && renderAction("floatBottom", item),
+                    renderReference(item)
+                ]
+            })
+        });
+        return /*#__PURE__*/ _jsxs(_Fragment, {
+            children: [
+                timeNode,
+                itemNode
+            ]
+        });
+    };
+    var renderReference = function(item) {
+        var reference = item.reference;
+        if (!item.reference) return null;
+        var referenceNode = null;
+        if (reference.type === "text") {
+            referenceNode = /*#__PURE__*/ _jsx("div", {
+                className: "".concat(getCls("msgItem-reference-text")),
+                children: /*#__PURE__*/ _jsx("div", {
+                    children: reference.value
+                })
+            });
+        }
+        if (reference.type === "file") {
+            referenceNode = /*#__PURE__*/ _jsx("div", {
+                className: "".concat(getCls("msgItem-reference-file")),
+                children: /*#__PURE__*/ _jsxs("div", {
+                    className: "".concat(getCls("msgItem-reference-file-box")),
+                    children: [
+                        /*#__PURE__*/ _jsx("div", {
+                            className: "".concat(getCls("msgItem-reference-file-left")),
+                            children: fileIconRender(reference.value.suffix, fileCustomRender.iconFileRender)
+                        }),
+                        /*#__PURE__*/ _jsx("div", {
+                            className: "".concat(getCls("msgItem-reference-file-right")),
+                            children: reference.value.name
+                        })
+                    ]
+                })
+            });
+        }
+        if (coverRenderReferences) {
+            return coverRenderReferences(item, referenceNode);
+        } else {
+            return referenceNode;
+        }
+    };
+    var onMouseEnter = function(item) {
+        var dom = document.querySelector('[data-id="'.concat(item.id, '"]'));
+        var container = wrapperRef.current;
+        if (!dom) return;
+        var topDom = dom.querySelector("." + styles["msgItem-action-popover-floatTop"]);
+        var bottomDom = dom.querySelector("." + styles["msgItem-action-popover-floatBottom"]);
+        if (!topDom || !bottomDom) return;
+        console.log("itemitem", dom, container);
+        var con_obj = container.getBoundingClientRect(); // 外层盒子
+        var dom_obj = dom.getBoundingClientRect(); // 鼠标滑过元素
+        var y = dom_obj.y - con_obj.y;
+        if (y > 0) {
+            // 元素tou在可视区域内
+            // 判断底部是否在可视区域内
+            if (y + dom_obj.height < con_obj.height) {
+                // 底部在可视区域内
+                // 显示在下边
+                bottomDom.style.cssText = "display:flex";
+            } else {
+                // 显示在上
+                topDom.style.cssText = "display:flex";
+            }
+        } else {
+            console.log("yyyy", y, dom_obj, con_obj, y + dom_obj.height < con_obj.height);
+            // 元素top不在可视区域内
+            if (y + dom_obj.height < con_obj.height) {
+                // 底部在可视区域内
+                // 显示在下边
+                bottomDom.style.cssText = "display:flex";
+            } else {
+                // 头部和底部都不在可视区域内 移动 topDom到可视区域
+                topDom.style.cssText = "display:flex;top:".concat(-1 * y + 24, "px;bottom:auto;");
+            }
+        }
+    };
+    var onMouseLeave = function(item) {
+        var dom = document.querySelector('[data-id="'.concat(item.id, '"]'));
+        if (!dom) return;
+        var topDom = dom.querySelector("." + styles["msgItem-action-popover-floatTop"]);
+        var bottomDom = dom.querySelector("." + styles["msgItem-action-popover-floatBottom"]);
+        if (!topDom || !bottomDom) return;
+        bottomDom.style.cssText = "";
+        topDom.style.cssText = "";
+    };
+    var renderAction = function(location, item) {
+        if (item.id === "inputing" || item.id === "helloMsg" || item.id === recordRef.current.sendingId) return null;
+        var copyNode = /*#__PURE__*/ _jsx(CopyIcon, {
+            prefix: prefix,
+            content: item.content
+        });
+        var referencesNode = /*#__PURE__*/ _jsx(ReferencesIcon, {
+            prefix: prefix,
+            apiRef: apiRef,
+            item: item
+        });
+        var UpVoteNode = /*#__PURE__*/ _jsx(UpVoteBtn, {
+            prefix: prefix,
+            isActive: item.vote === "up",
+            clickFn: function() {
+                onVoteChange(item.vote === "up" ? "" : "up", item);
+                setDataSource(function(data) {
+                    return data.map(function(ite) {
+                        if (item.id === ite.id) {
+                            ite.vote = item.vote === "up" ? "" : "up";
+                        }
+                        return ite;
+                    });
+                });
+            }
+        });
+        var DownVoteNode = /*#__PURE__*/ _jsx(DownVoteBtn, {
+            prefix: prefix,
+            isActive: item.vote === "down",
+            clickFn: function() {
+                onVoteChange(item.vote === "down" ? "" : "down", item);
+                setDataSource(function(data) {
+                    return data.map(function(ite) {
+                        if (item.id === ite.id) {
+                            ite.vote = ite.vote === "down" ? "" : "down";
+                        }
+                        return ite;
+                    });
+                });
+            }
+        });
+        var RefreshNode = /*#__PURE__*/ _jsx(RefreshBtn, {
+            prefix: prefix,
+            clickFn: function() {
+                return onRefresh(item);
+            }
+        });
+        if (item.location === "right") {
+            UpVoteNode = null;
+            DownVoteNode = null;
+        }
+        if (item.type === "file") {
+            copyNode = null;
+            UpVoteNode = null;
+            DownVoteNode = null;
+            RefreshNode = null;
+        }
+        var leftNodes = null;
+        var rightNodes = /*#__PURE__*/ _jsxs(_Fragment, {
+            children: [
+                copyNode,
+                referencesNode,
+                UpVoteNode,
+                DownVoteNode
+            ]
+        });
+        if (_instanceof(msgAction, Array)) {
+            if (msgAction.length == 0) return null;
+            // 数组
+            if (!msgAction.includes("copy")) {
+                copyNode = null;
+            }
+            if (!msgAction.includes("reference")) {
+                referencesNode = null;
+            }
+            if (!msgAction.includes("upVite")) {
+                UpVoteNode = null;
+            }
+            if (!msgAction.includes("downVote")) {
+                DownVoteNode = null;
+            }
+            if (!msgAction.includes("refresh")) {
+                RefreshNode = null;
+            }
+        } else if (typeof msgAction === "object") {
+            if (msgAction.renderLeft) {
+                leftNodes = msgAction.renderLeft(copyNode, referencesNode, UpVoteNode, DownVoteNode, RefreshNode);
+            }
+            if (msgAction.renderRight) {
+                rightNodes = msgAction.renderRight(copyNode, referencesNode, UpVoteNode, DownVoteNode, RefreshNode);
+            }
+        }
+        var index = recordRef.current.dataSource.findIndex(function(ite) {
+            return ite.id == item.id;
+        });
+        if (location === "bottom") {
+            if (item.location === "left" && item.id !== "helloMsg" && item.id !== "inputing") {
+                if (index === recordRef.current.dataSource.length - 1) {
+                    return /*#__PURE__*/ _jsxs("div", {
+                        className: "".concat(getCls("msgItem-action")),
+                        children: [
+                            /*#__PURE__*/ _jsx("div", {
+                                className: "".concat(getCls("msgItem-action-left")),
+                                children: leftNodes
+                            }),
+                            /*#__PURE__*/ _jsxs("div", {
+                                className: "".concat(getCls("msgItem-action-right")),
+                                children: [
+                                    RefreshNode,
+                                    rightNodes
+                                ]
+                            })
+                        ]
+                    });
+                }
+            }
+        // 只有最后一条才显示底部操作啦 且是左侧消息 且不是招呼语
+        }
+        if (location === "floatTop" || location === "floatBottom") {
+            if (item.location === "left" && item.id !== "helloMsg" && item.id !== "inputing" && index === recordRef.current.dataSource.length - 1) return null;
+            // 浮框
+            return /*#__PURE__*/ _jsx("div", {
+                className: "".concat(getCls("msgItem-action-operate")),
+                children: /*#__PURE__*/ _jsxs("div", {
+                    className: "".concat(getCls("msgItem-action"), " ").concat(getCls("msgItem-action-popover"), " ").concat(getCls("msgItem-action-popover-" + location)),
+                    children: [
+                        /*#__PURE__*/ _jsx("div", {
+                            className: "".concat(getCls("msgItem-action-left")),
+                            children: leftNodes
+                        }),
+                        /*#__PURE__*/ _jsx("div", {
+                            className: "".concat(getCls("msgItem-action-right")),
+                            children: rightNodes
+                        })
+                    ]
+                })
+            });
+        }
+        return null;
+    };
+    var markToHtml = function(markStr, id) {
+        var html = remarkable.render(markStr);
+        var position = 0;
+        html = html.replace(new RegExp("<pre", "ig"), function() {
+            position++;
+            return "<p class='".concat(getCls("copyCode"), " ").concat(styles.copyCodeFun, "' data-id=").concat(id, " data-position=").concat(position, ">\n                <span class='").concat(getCls("icon"), " ").concat(getCls("copy"), '\'>\n                  <svg\n                    width="1em"\n                    height="1em"\n                    viewBox="0 0 14 14"\n                    shape-rendering="geometricPrecision"\n                    fill="currentColor"\n                    xmlns="http://www.w3.org/2000/svg"\n                  >\n                    <g clip-path="url(#clip0_518_8403)">\n                      <path\n                        d="M6.16666 1.66666H13.1667C13.4761 1.66666 13.7728 1.78957 13.9916 2.00837C14.2104 2.22716 14.3333 2.5239 14.3333 2.83332V9.83332C14.3333 10.1427 14.2104 10.4395 13.9916 10.6583C13.7728 10.8771 13.4761 11 13.1667 11H6.16666C5.85724 11 5.5605 10.8771 5.34171 10.6583C5.12291 10.4395 5 10.1427 5 9.83332V2.83332C5 2.5239 5.12291 2.22716 5.34171 2.00837C5.5605 1.78957 5.85724 1.66666 6.16666 1.66666ZM6.16666 2.66666C6.12246 2.66666 6.08007 2.68422 6.04881 2.71547C6.01756 2.74673 6 2.78912 6 2.83332V9.83332C6 9.85521 6.00431 9.87688 6.01268 9.8971C6.02106 9.91732 6.03334 9.9357 6.04881 9.95117C6.06429 9.96665 6.08266 9.97893 6.10288 9.9873C6.1231 9.99568 6.14478 9.99999 6.16666 9.99999H13.1667C13.2109 9.99999 13.2533 9.98243 13.2845 9.95117C13.3158 9.91992 13.3333 9.87753 13.3333 9.83332V2.83332C13.3333 2.78912 13.3158 2.74673 13.2845 2.71547C13.2533 2.68422 13.2109 2.66666 13.1667 2.66666H6.16666ZM10 12C10 11.8674 10.0527 11.7402 10.1464 11.6464C10.2402 11.5527 10.3674 11.5 10.5 11.5C10.6326 11.5 10.7598 11.5527 10.8536 11.6464C10.9473 11.7402 11 11.8674 11 12V13.1667C11 13.4761 10.8771 13.7728 10.6583 13.9916C10.4395 14.2104 10.1427 14.3333 9.83333 14.3333H2.83333C2.52391 14.3333 2.22717 14.2104 2.00837 13.9916C1.78958 13.7728 1.66666 13.4761 1.66666 13.1667V6.16666C1.66666 5.85724 1.78958 5.56049 2.00837 5.3417C2.22717 5.12291 2.52391 4.99999 2.83333 4.99999H4C4.13261 4.99999 4.25978 5.05267 4.35355 5.14644C4.44732 5.2402 4.5 5.36738 4.5 5.49999C4.5 5.6326 4.44732 5.75978 4.35355 5.85354C4.25978 5.94731 4.13261 5.99999 4 5.99999H2.83333C2.78913 5.99999 2.74674 6.01755 2.71548 6.04881C2.68422 6.08006 2.66666 6.12245 2.66666 6.16666V13.1667C2.66666 13.2109 2.68422 13.2533 2.71548 13.2845C2.74674 13.3158 2.78913 13.3333 2.83333 13.3333H9.83333C9.87753 13.3333 9.91993 13.3158 9.95118 13.2845C9.98244 13.2533 10 13.2109 10 13.1667V12Z"\n                      />\n                    </g>\n                    <defs>\n                      <clipPath id="clip0_518_8403">\n                        <rect width="16" height="16" />\n                      </clipPath>\n                    </defs>\n                  </svg>\n                </span>\n                <span class=\'').concat(getCls("icon"), " ").concat(getCls("copy_success_flag"), '\'>\n                  <svg\n                    width="1em"\n                    height="1em"\n                    shape-rendering="geometricPrecision"\n                    fill="currentColor"\n                    viewBox="0 0 12 7"\n                    xmlns="http://www.w3.org/2000/svg"\n                  >\n                    <path d="M11.2242 0.375687C11.4586 0.610002 11.4586 0.989901 11.2242 1.22422L4.82424 7.62422C4.58992 7.85853 4.21003 7.85853 3.97571 7.62422L0.775712 4.42422C0.541397 4.1899 0.541397 3.81 0.775712 3.57569C1.01003 3.34137 1.38993 3.34137 1.62424 3.57569L4.39998 6.35142L10.3757 0.375687C10.61 0.141373 10.9899 0.141373 11.2242 0.375687Z" />\n                  </svg>\n                </span><span class="').concat(getCls("copyCodeText"), '">复制代码</span></p><pre');
+        });
+        return html;
+    };
+    var renderTime = function(item) {
+        // 生成缓存键
+        var cacheKey = "".concat(item.id);
+        // 检查缓存中是否已有结果
+        if (timeRenderCache.has(cacheKey)) {
+            return timeRenderCache.get(cacheKey);
+        }
+        var index = recordRef.current.dataSource.findIndex(function(i) {
+            return i.id === item.id;
+        });
+        var timeObj = parseDate(item.createTime);
+        var time = null;
+        if (index === 0) {
+            // 第一项 显示年月日 时分
+            time = "".concat(timeObj.year, "-").concat(timeObj.month, "-").concat(timeObj.day, " ").concat(timeObj.hours, ":").concat(timeObj.minutes);
+        } else {
+            // 非第一项 与上一项进行对比
+            var prevItem = recordRef.current.dataSource[index - 1];
+            if (prevItem) {
+                var beforeTime = prevItem.createTime;
+                var beforeTimeObj = parseDate(beforeTime);
+                // 判断与上一条数据 是否跨天
+                if (timeObj.year !== beforeTimeObj.year || timeObj.month !== beforeTimeObj.month || timeObj.day !== beforeTimeObj.day) {
+                    // 显示 年月日 时分
+                    time = "".concat(timeObj.year, "-").concat(timeObj.month, "-").concat(timeObj.day, " ").concat(timeObj.hours, ":").concat(timeObj.minutes);
+                } else {
+                    // 没有跨天 判断是否相隔超过10分钟
+                    if (timeObj.timestamp - beforeTimeObj.timestamp > 10 * 60 * 1000) {
+                        // 超过10分钟 显示 时分
+                        time = "".concat(timeObj.hours, ":").concat(timeObj.minutes);
+                    }
+                }
+            }
+        }
+        var result = time ? /*#__PURE__*/ _jsx("div", {
+            className: "".concat(getCls("msg-date")),
+            children: time
+        }) : null;
+        // 将结果存入缓存
+        timeRenderCache.set(cacheKey, result);
+        return result;
+    };
+    var findCopyContent = function(e) {
+        var source = findParent(e.target, styles.copyCode);
+        if (!source) return;
+        var id = source.getAttribute("data-id");
+        var position = source.getAttribute("data-position");
+        if (!id && !position) return;
+        var message = "";
+        recordRef.current.dataSource.forEach(function(item) {
+            if (item.id === id) {
+                message = item.content;
+            }
+        });
+        if (!message) return;
+        var codeConment = "";
+        var i = 0;
+        message.replaceAll(new RegExp(/```(?:.|\n)*?```/, "ig"), function(con) {
+            i++;
+            if (i == position) {
+                // 异常标记
+                con = con.replace(/^```[\s\S]*?\n/, "").replace(/\n```$/, "");
+                codeConment = con;
+                return con;
+            } else {
+                return null;
+            }
+        });
+        resetStyles();
+        source.classList.add(styles.copy_success);
+        source.children[2].innerText = "复制成功";
+        copyText(codeConment);
+        setTimeout(function() {
+            try {
+                resetStyles();
+            } catch (error) {}
+        }, 3000);
+    };
+    //初始化样式
+    var resetStyles = function() {
+        var dom_list = document.getElementsByClassName(styles.copy_success);
+        for(var i = 0; i < dom_list.length; i++){
+            dom_list[i].classList.remove(styles.copy_success);
+        }
+        var dom_list2 = document.getElementsByClassName(styles.copyCodeFun);
+        for(var i = 0; i < dom_list2.length; i++){
+            var p = dom_list2[i].getElementsByClassName(styles.copyCodeText);
+            p[0].innerText = "复制代码";
+        }
+    };
+    var onWheel = function() {
+        if (recordRef.current.sendingId && recordRef.current.sendingId !== "inputing") {
+            autoScrollBottom.current = false;
+        }
+    };
+    return /*#__PURE__*/ _jsx("div", {
+        className: "".concat(getCls("virtuosoList-wrapper")),
+        ref: wrapperRef,
+        children: /*#__PURE__*/ _jsx(Virtuoso, {
+            ref: virtuosoRef,
+            style: {
+                height: "100%"
+            },
+            data: dataSource,
+            initialTopMostItemIndex: {
+                index: "LAST",
+                align: "end"
+            },
+            startReached: loadMore,
+            firstItemIndex: firstItemIndex,
+            context: {
+                loading: loading,
+                prefix: prefix
+            },
+            itemContent: itemContent,
+            components: {
+                Header: Header
+            },
+            increaseViewportBy: 200,
+            overscan: 10,
+            onWheel: onWheel
+        })
+    });
+});
+export default VirtuosoList;