@touchvue/chat 1.0.0-beta.3 → 1.0.0-beta.30

package/lib/packages/components/touchchat/src/AiChat/TouchHistory.vue2.js

@@ -4,40 +4,142 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 var TouchChat = require('./TouchChat.vue.js');
+var TouchAgent = require('./TouchAgent.vue.js');
 var HistorySidebar = require('./HistorySidebar.vue.js');
+var SiderBarView = require('./SiderBarView.vue.js');
 
 var _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "TouchHistory",
-  setup(__props) {
+  setup(__props, { expose: __expose }) {
     const state = vue.reactive({
       activeChat: "",
       chatHistory: [],
       isSidebarCollapsed: false,
       actionMenuVisible: {},
-      mockMessages: []
+      mockMessages: [],
+      toggleSidebarFlag: false,
+      agentsType: "",
+      clickCreateNum: 0
     });
+    const historyContainer = vue.ref(null);
+    const watchHistoryData = vue.ref([]);
+    const watchHistoryDetail = vue.ref([]);
     const chatComponent = vue.ref();
-    const isNotHeader = vue.inject("isNotHeader", true);
-    const isDeepSeek = vue.inject("isDeepSeek", true);
-    const historyData = vue.inject("historyData", []);
-    const setHistoryData = vue.ref(
-      Array.isArray(historyData) ? historyData : typeof historyData === "object" && (historyData == null ? void 0 : historyData.value) ? historyData.value : []
+    const layout = vue.inject("layout", "side, think, upload, chain");
+    const isNotHeader = !layout.includes("side");
+    const scripts = vue.inject("scripts", []);
+    const agents = vue.inject("agents", []);
+    const agentsInfo = vue.ref();
+    const isAgentRef = vue.inject("isAgent", vue.ref(false));
+    const iIsAgent = vue.ref(isAgentRef.value);
+    vue.watch(
+      isAgentRef,
+      (newVal) => {
+        iIsAgent.value = newVal;
+      },
+      { immediate: true }
     );
-    const messageDetail = vue.inject("messageDetail", []);
-    const setMessageDetail = vue.ref(
-      Array.isArray(messageDetail) ? messageDetail : typeof messageDetail === "object" && (messageDetail == null ? void 0 : messageDetail.value) ? messageDetail.value : []
+    const updateSharedData = (item) => {
+      var _a, _b;
+      agentsInfo.value = item;
+      if (chatComponent.value) {
+        (_b = (_a = chatComponent.value) == null ? void 0 : _a.handleAgentSelect) == null ? void 0 : _b.call(_a, item);
+      }
+    };
+    vue.provide("updateSharedData", updateSharedData);
+    const STORAGE_KEYS = {
+      CHAT_HISTORY: scripts.length === 0 ? "chatHistory" : "robotHistory",
+      SIDEBAR_STATE: "sidebarCollapsed"
+    };
+    const loadFromLocalStorage = () => {
+      const savedCollapseState = localStorage.getItem(STORAGE_KEYS.SIDEBAR_STATE);
+      if (savedCollapseState) {
+        state.isSidebarCollapsed = JSON.parse(savedCollapseState);
+      }
+      if (scripts.length > 0) {
+        localStorage.setItem(STORAGE_KEYS.CHAT_HISTORY, "[]");
+        localStorage.setItem("activeAgentsName", "");
+      }
+      const savedHistory = localStorage.getItem(STORAGE_KEYS.CHAT_HISTORY);
+      const historyData = JSON.parse(savedHistory || "[]");
+      if (agents.length > 0 && !historyData.length) {
+        agents.forEach((item) => {
+          const agentsList = [
+            {
+              chatId: item.id,
+              user: "ai",
+              type: "text",
+              isShowLike: true,
+              content: (item == null ? void 0 : item.intro) || "\u6211\u662FAI\u52A9\u624B\uFF0C\u6211\u53EF\u4EE5\u56DE\u7B54\u4F60\u7684\u95EE\u9898\uFF0C\u4F60\u53EF\u4EE5\u548C\u6211\u804A\u5929\uFF0C\u4E5F\u53EF\u4EE5\u95EE\u6211\u95EE\u9898\u3002"
+            }
+          ];
+          createNewChat(item.name, agentsList, item.name);
+        });
+      }
+      if (watchHistoryData.value.length > 0) {
+        state.chatHistory = watchHistoryData.value;
+      } else if (historyData.length > 0) {
+        state.chatHistory = historyData;
+      }
+    };
+    const historyList = vue.inject("historyList", []);
+    const setHistoryData = vue.ref(Array.isArray(historyList) ? historyList : typeof historyList === "object" && historyList ? historyList : []);
+    const computedHistoryData = vue.computed(() => {
+      if (setHistoryData.value.length) {
+        return setHistoryData.value;
+      }
+      return [];
+    });
+    vue.watch(
+      computedHistoryData,
+      (newVal) => {
+        watchHistoryData.value = newVal;
+        state.chatHistory = newVal;
+        loadFromLocalStorage();
+      },
+      { immediate: true }
     );
+    const historyDetail = vue.inject("historyDetail", []);
+    const setMessageDetail = vue.ref(Array.isArray(historyDetail) ? historyDetail : typeof historyDetail === "object" && historyDetail ? historyDetail : []);
+    const computedHistoryDetail = vue.computed(() => {
+      if (setMessageDetail.value.length) {
+        return setMessageDetail.value;
+      }
+      return [];
+    });
+    vue.watch(
+      computedHistoryDetail,
+      (newVal) => {
+        watchHistoryDetail.value = newVal;
+      },
+      { immediate: true }
+    );
+    const messageItem = vue.ref({ user: "", type: "", content: "" });
+    const messageIndex = vue.ref(0);
+    const currentChatMessages = vue.computed(() => {
+      if (watchHistoryDetail.value.length) {
+        return watchHistoryDetail.value;
+      }
+      if (!state.activeChat)
+        return [];
+      if (!watchHistoryDetail.value.length && !watchHistoryData.value.length || watchHistoryData.value.length) {
+        const currentChat = state.chatHistory.find((item) => item.id === state.activeChat);
+        return (currentChat == null ? void 0 : currentChat.messages) || [];
+      } else {
+        return watchHistoryDetail.value;
+      }
+    });
     vue.watch(
       () => {
-        if (typeof historyData === "object" && (historyData == null ? void 0 : historyData.value) !== void 0) {
-          return historyData.value;
+        if (typeof historyList === "object" && historyList !== void 0) {
+          return historyList;
         }
-        return historyData;
+        return historyList;
       },
       (newVal) => {
-        if (newVal && Array.isArray(newVal)) {
-          setHistoryData.value = newVal;
-          if (!isDeepSeek) {
+        if (newVal && Array.isArray(newVal) && newVal.length) {
+          watchHistoryData.value = newVal;
+          if (!scripts.length) {
             state.chatHistory = newVal;
             if (state.chatHistory.length > 0 && !state.activeChat) {
               state.activeChat = state.chatHistory[0].id;
@@ -49,14 +151,14 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
     );
     vue.watch(
       () => {
-        if (typeof messageDetail === "object" && (messageDetail == null ? void 0 : messageDetail.value) !== void 0) {
-          return messageDetail.value;
+        if (typeof historyDetail === "object" && historyDetail !== void 0) {
+          return historyDetail;
         }
-        return messageDetail;
+        return historyDetail;
       },
       (newVal) => {
         if (newVal && Array.isArray(newVal)) {
-          setMessageDetail.value = JSON.parse(JSON.stringify(newVal));
+          watchHistoryDetail.value = JSON.parse(JSON.stringify(newVal));
           if (chatComponent.value) {
             setTimeout(() => {
               var _a, _b;
@@ -66,91 +168,96 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
         }
       },
       { deep: true, immediate: true }
-      // 添加immediate: true，确保在watch创建时立即执行一次
     );
-    const currentChatMessages = vue.computed(() => {
-      if (!state.activeChat && isDeepSeek)
-        return [];
-      if (!setMessageDetail.value.length && !setHistoryData.value.length && isDeepSeek) {
-        const currentChat = state.chatHistory.find((item) => item.id === state.activeChat);
-        return (currentChat == null ? void 0 : currentChat.messages) || [];
-      } else {
-        return setMessageDetail.value;
-      }
-    });
     vue.onMounted(() => {
       loadFromLocalStorage();
-      initEventListeners();
     });
-    const STORAGE_KEYS = {
-      CHAT_HISTORY: "chatHistory",
-      SIDEBAR_STATE: "sidebarCollapsed"
-    };
-    function loadFromLocalStorage() {
-      const savedCollapseState = localStorage.getItem(STORAGE_KEYS.SIDEBAR_STATE);
-      if (savedCollapseState) {
-        state.isSidebarCollapsed = JSON.parse(savedCollapseState);
-      }
-      const savedHistory = localStorage.getItem(STORAGE_KEYS.CHAT_HISTORY);
-      if (!isDeepSeek) {
-        state.chatHistory = setHistoryData.value;
-        if (state.chatHistory.length > 0) {
-          state.activeChat = state.chatHistory[0].id;
-        }
-      } else if (savedHistory && isDeepSeek) {
-        state.chatHistory = JSON.parse(savedHistory);
-        if (state.chatHistory.length > 0) {
-          state.activeChat = state.chatHistory[0].id;
-        }
-      } else {
-        createNewChat("AI\u57FA\u7840\u95EE\u7B54");
-      }
-    }
     function saveToLocalStorage() {
       localStorage.setItem(STORAGE_KEYS.CHAT_HISTORY, JSON.stringify(state.chatHistory));
       localStorage.setItem(STORAGE_KEYS.SIDEBAR_STATE, JSON.stringify(state.isSidebarCollapsed));
     }
-    function initEventListeners() {
-      document.addEventListener("click", () => {
-        Object.keys(state.actionMenuVisible).forEach((key) => {
-          state.actionMenuVisible[key] = false;
-        });
-      });
-    }
+    const toggleSidebarOut = (item, index) => {
+      messageItem.value = item;
+      messageIndex.value = index;
+      if (state.toggleSidebarFlag) {
+        return;
+      }
+      state.toggleSidebarFlag = true;
+      state.isSidebarCollapsed = false;
+      toggleSidebar();
+    };
     function toggleSidebar() {
       state.isSidebarCollapsed = !state.isSidebarCollapsed;
       saveToLocalStorage();
     }
-    function createNewChat(title = "\u65B0\u5BF9\u8BDD") {
+    function createNewChat(title = "\u65B0\u5BF9\u8BDD", messageList = [], type) {
+      var _a;
+      let agentsId = "";
+      if (agents.length > 0) {
+        agentsId = ((_a = agents.find((item) => item.name === title)) == null ? void 0 : _a.id) || "";
+      }
       const newChat = {
-        id: Date.now().toString(),
+        // id: Date.now().toString(),
+        id: agentsId ? agentsId : (Math.floor(Math.random() * 89999999) + 1e7).toString(),
         title,
         time: /* @__PURE__ */ new Date(),
-        messages: []
+        messages: messageList,
+        type: type ? type : ""
       };
       state.chatHistory.unshift(newChat);
-      state.activeChat = newChat.id;
       saveToLocalStorage();
       return newChat;
     }
     function startNewChat() {
-      var _a, _b, _c;
+      var _a, _b, _c, _d, _e, _f, _g;
+      localStorage.setItem("activeAgentsName", "");
+      const robotHistory = localStorage.getItem(STORAGE_KEYS.CHAT_HISTORY) || "[]";
+      const robotHistoryData = JSON.parse(robotHistory);
+      let messageList = [];
+      let messageItem2 = {};
+      let firstMessageList = [];
+      if (robotHistoryData.length) {
+        messageItem2 = robotHistoryData.find((item) => item.id === state.activeChat) || {};
+        messageList = (messageItem2 == null ? void 0 : messageItem2.messages) || [];
+        firstMessageList = ((_a = robotHistoryData == null ? void 0 : robotHistoryData[0]) == null ? void 0 : _a.messages) || [];
+      }
+      state.toggleSidebarFlag = false;
+      if (watchHistoryData.value.length > 0 && firstMessageList.length > 0 && (watchHistoryDetail.value.length > 0 || currentChatMessages.value.length > 0 || messageList.length > 0) || !(messageItem2 == null ? void 0 : messageItem2.messages) && firstMessageList.length > 0 || !state.clickCreateNum) {
+        const newChat2 = createNewChat("\u65B0\u5BF9\u8BDD" + (state.chatHistory.length + 1));
+        state.activeChat = newChat2.id;
+        change("");
+        state.clickCreateNum++;
+        return;
+      }
+      if (state.chatHistory.length > 0 && !((_d = (_c = (_b = state.chatHistory) == null ? void 0 : _b[0]) == null ? void 0 : _c.messages) == null ? void 0 : _d.length)) {
+        state.activeChat = state.chatHistory[0].id;
+        change("");
+        return;
+      }
       if (!currentChatMessages.value.length && state.chatHistory.length > 0) {
-        state.activeChat = (_c = (_b = (_a = state.chatHistory) == null ? void 0 : _a[0]) == null ? void 0 : _b.id) != null ? _c : "";
+        state.activeChat = (_g = (_f = (_e = state.chatHistory) == null ? void 0 : _e[0]) == null ? void 0 : _f.id) != null ? _g : "";
+        change("");
         return;
       }
-      createNewChat("\u65B0\u5BF9\u8BDD" + (state.chatHistory.length + 1));
+      const newChat = createNewChat("\u65B0\u5BF9\u8BDD" + (state.chatHistory.length + 1));
+      state.activeChat = newChat.id;
+      change("");
     }
-    const handleActiveChat = vue.inject("handleActiveChat", () => {
-      console.warn("\u672A\u63D0\u4F9BhandleActiveChat\u51FD\u6570");
+    const change = vue.inject("change", () => {
+      console.warn("\u672A\u63D0\u4F9Bchange\u51FD\u6570");
     });
-    function selectChat(id) {
+    function selectChat(id, type) {
       state.activeChat = id;
-      handleActiveChat(id);
+      state.toggleSidebarFlag = false;
+      state.agentsType = type;
+      if (!type) {
+        localStorage.setItem("activeAgentsName", "");
+      }
+      change(id);
       resetAllMenus();
     }
-    const handleDeleteChat = vue.inject("handleDeleteChat", () => {
-      console.warn("\u672A\u63D0\u4F9BhandleDeleteChat\u51FD\u6570");
+    const historyRemove = vue.inject("historyRemove", () => {
+      console.warn("\u672A\u63D0\u4F9Bremove\u51FD\u6570");
     });
     function deleteChat(id) {
       const index = state.chatHistory.findIndex((item) => item.id === id);
@@ -163,22 +270,29 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
         state.activeChat = "";
         state.mockMessages = [];
       }
-      handleDeleteChat(id);
+      historyRemove(id);
       saveToLocalStorage();
     }
-    function sendMessage(messageList) {
+    const beforeSendMessage = () => {
+      state.toggleSidebarFlag = false;
+    };
+    function sendMessage(messageList, type) {
       state.mockMessages = messageList;
+      if (type) {
+        return;
+      }
       if (!state.activeChat) {
-        const newChat = createNewChat("AI\u57FA\u7840\u95EE\u7B54");
+        const newChat = createNewChat("AI\u57FA\u7840\u95EE\u7B54", messageList);
         newChat.messages = messageList;
+        state.activeChat = newChat.id;
       } else {
         const currentChat = state.chatHistory.find((item) => item.id === state.activeChat);
         if (currentChat) {
           currentChat.messages = messageList;
           currentChat.time = /* @__PURE__ */ new Date();
         }
+        saveToLocalStorage();
       }
-      saveToLocalStorage();
     }
     function resetAllMenus() {
       Object.keys(state.actionMenuVisible).forEach((key) => {
@@ -195,69 +309,87 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
     };
     vue.watch(
       () => state.chatHistory,
-      () => saveToLocalStorage(),
+      () => {
+        saveToLocalStorage();
+      },
       { deep: true }
     );
+    __expose({
+      send: (value, fileList, auto, type) => {
+        var _a;
+        (_a = chatComponent.value) == null ? void 0 : _a.send(value, fileList, auto, type);
+      },
+      closeExtend: () => {
+        state.toggleSidebarFlag = false;
+      },
+      create: () => {
+        startNewChat();
+      },
+      retry: (index) => {
+        var _a;
+        (_a = chatComponent.value) == null ? void 0 : _a.retry(index);
+      },
+      update: (index, message) => {
+        var _a;
+        (_a = chatComponent.value) == null ? void 0 : _a.update(index, message);
+      }
+    });
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", { class: "history-container" }, [
-        vue.createElementVNode("div", { class: "main-content" }, [
-          vue.unref(isNotHeader) ? (vue.openBlock(), vue.createBlock(HistorySidebar.default, {
+      return vue.openBlock(), vue.createElementBlock(
+        "div",
+        {
+          ref_key: "historyContainer",
+          ref: historyContainer,
+          class: "touchchat"
+        },
+        [
+          state.isSidebarCollapsed && !isNotHeader ? (vue.openBlock(), vue.createElementBlock("div", {
             key: 0,
-            "is-sidebar-collapsed": state.isSidebarCollapsed,
-            "active-chat": state.activeChat,
-            "chat-history": state.chatHistory,
-            onToggleSidebar: toggleSidebar,
-            onStartNewChat: startNewChat,
-            onSelectChat: selectChat,
-            onRenameChat: handleRenameChat,
-            onDeleteChat: deleteChat
-          }, null, 8, ["is-sidebar-collapsed", "active-chat", "chat-history"])) : vue.createCommentVNode("v-if", true),
-          state.isSidebarCollapsed && vue.unref(isNotHeader) ? (vue.openBlock(), vue.createElementBlock("button", {
-            key: 1,
-            class: "floating",
-            onClick: vue.withModifiers(startNewChat, ["stop"])
+            class: "touchchat-header"
           }, [
-            (vue.openBlock(), vue.createElementBlock("svg", {
-              xmlns: "http://www.w3.org/2000/svg",
-              width: "20",
-              height: "17",
-              viewBox: "0 0 20 17",
-              fill: "none",
+            vue.createElementVNode("div", {
+              class: "touchchat-showmenu",
               onClick: vue.withModifiers(toggleSidebar, ["stop"])
             }, [
-              vue.createElementVNode("path", {
-                d: "M13.2144 3.26685L13.2144 15.0526",
-                stroke: "#1D2129",
-                "stroke-width": "1.5",
-                "stroke-linejoin": "round"
-              }),
-              vue.createElementVNode("rect", {
-                x: "0.75",
-                y: "-0.75",
-                width: "16.5",
-                height: "12.2143",
-                transform: "matrix(-1 0 0 1 19 3.49622)",
-                stroke: "#1D2129",
-                "stroke-width": "1.5",
-                "stroke-linecap": "round",
-                "stroke-linejoin": "round"
-              })
-            ])),
-            vue.createElementVNode("span", null, "+")
+              vue.createElementVNode("div", { class: "touchchat-showmenu-icon" })
+            ]),
+            vue.createElementVNode("div", {
+              class: "touchchat-add-lite",
+              onClick: vue.withModifiers(startNewChat, ["stop"])
+            }, [
+              vue.createElementVNode("div", { class: "touchchat-add-lite-icon" }),
+              vue.createElementVNode("span", null, "\u65B0\u5BF9\u8BDD")
+            ])
           ])) : vue.createCommentVNode("v-if", true),
-          vue.createElementVNode("main", { class: "chat-area" }, [
-            vue.createCommentVNode(` :connection-type="'SSE'"
-           `),
-            vue.createCommentVNode(" <span>mockMessages == {{ state.mockMessages }}</span>  \n	    <p>currentChatMessages == {{ currentChatMessages }}</p> "),
-            (vue.openBlock(), vue.createBlock(TouchChat.default, {
+          vue.createElementVNode("div", { class: "touchchat-content" }, [
+            !isNotHeader && !state.isSidebarCollapsed ? (vue.openBlock(), vue.createBlock(HistorySidebar.default, {
+              key: 0,
+              "is-sidebar-collapsed": state.isSidebarCollapsed,
+              "active-chat": state.activeChat,
+              "chat-history": state.chatHistory,
+              onToggleSidebar: toggleSidebar,
+              onStartNewChat: startNewChat,
+              onSelectChat: selectChat,
+              onRenameChat: handleRenameChat,
+              onDeleteChat: deleteChat
+            }, null, 8, ["is-sidebar-collapsed", "active-chat", "chat-history"])) : vue.createCommentVNode("v-if", true),
+            !iIsAgent.value ? (vue.openBlock(), vue.createBlock(TouchChat.default, {
               ref_key: "chatComponent",
               ref: chatComponent,
               key: state.activeChat,
               value: currentChatMessages.value,
-              onSendMessage: sendMessage
+              onSendMessage: sendMessage,
+              onToggleSidebar: toggleSidebarOut,
+              onBeforeSendMessage: beforeSendMessage
             }, {
-              aiMessageContent: vue.withCtx(({ item, index }) => [
-                vue.renderSlot(_ctx.$slots, "aiMessageContent", {
+              aimsg: vue.withCtx(({ item, index }) => [
+                vue.renderSlot(_ctx.$slots, "aimsg", {
+                  item,
+                  index
+                })
+              ]),
+              msg: vue.withCtx(({ item, index }) => [
+                vue.renderSlot(_ctx.$slots, "msg", {
                   item,
                   index
                 })
@@ -271,15 +403,112 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
               welcome: vue.withCtx(() => [
                 vue.renderSlot(_ctx.$slots, "welcome")
               ]),
-              input: vue.withCtx(({ disabled }) => [
-                vue.renderSlot(_ctx.$slots, "input", { disabled })
+              edit: vue.withCtx(() => [
+                vue.renderSlot(_ctx.$slots, "edit")
+              ]),
+              shortcut: vue.withCtx(() => [
+                vue.renderSlot(_ctx.$slots, "shortcut")
+              ]),
+              top: vue.withCtx(() => [
+                vue.renderSlot(_ctx.$slots, "top")
+              ]),
+              fn: vue.withCtx(({ item, index }) => [
+                vue.renderSlot(_ctx.$slots, "fn", {
+                  item,
+                  index
+                })
+              ]),
+              extendsFn: vue.withCtx(({ item, index }) => [
+                vue.renderSlot(_ctx.$slots, "extendsFn", {
+                  item,
+                  index
+                })
+              ]),
+              _: 3
+              /* FORWARDED */
+            }, 8, ["value"])) : (vue.openBlock(), vue.createElementBlock(
+              vue.Fragment,
+              { key: 2 },
+              [
+                vue.createCommentVNode(' :key="state.activeChat"  '),
+                vue.createVNode(TouchAgent.default, {
+                  ref_key: "chatComponent",
+                  ref: chatComponent,
+                  value: currentChatMessages.value,
+                  onSendMessage: sendMessage,
+                  onToggleSidebar: toggleSidebarOut,
+                  onBeforeSendMessage: beforeSendMessage
+                }, {
+                  aimsg: vue.withCtx(({ item, index }) => [
+                    vue.renderSlot(_ctx.$slots, "aimsg", {
+                      item,
+                      index
+                    })
+                  ]),
+                  msg: vue.withCtx(({ item, index }) => [
+                    vue.renderSlot(_ctx.$slots, "msg", {
+                      item,
+                      index
+                    })
+                  ]),
+                  aiAvatar: vue.withCtx(() => [
+                    vue.renderSlot(_ctx.$slots, "aiAvatar")
+                  ]),
+                  userAvatar: vue.withCtx(() => [
+                    vue.renderSlot(_ctx.$slots, "userAvatar")
+                  ]),
+                  welcome: vue.withCtx(() => [
+                    vue.renderSlot(_ctx.$slots, "welcome")
+                  ]),
+                  edit: vue.withCtx(() => [
+                    vue.renderSlot(_ctx.$slots, "edit")
+                  ]),
+                  shortcut: vue.withCtx(() => [
+                    vue.renderSlot(_ctx.$slots, "shortcut")
+                  ]),
+                  top: vue.withCtx(() => [
+                    vue.renderSlot(_ctx.$slots, "top")
+                  ]),
+                  fn: vue.withCtx(({ item, index }) => [
+                    vue.renderSlot(_ctx.$slots, "fn", {
+                      item,
+                      index
+                    })
+                  ]),
+                  extendsFn: vue.withCtx(({ item, index }) => [
+                    vue.renderSlot(_ctx.$slots, "extendsFn", {
+                      item,
+                      index
+                    })
+                  ]),
+                  _: 3
+                  /* FORWARDED */
+                }, 8, ["value"])
+              ],
+              2112
+              /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+            )),
+            vue.withDirectives(vue.createVNode(SiderBarView.default, {
+              flag: state.isSidebarCollapsed,
+              item: messageItem.value,
+              index: messageIndex.value
+            }, {
+              extend: vue.withCtx(({ item: slotMessageItem, index: slotMessageIndex }) => [
+                vue.renderSlot(_ctx.$slots, "extend", {
+                  item: slotMessageItem,
+                  index: slotMessageIndex
+                })
               ]),
               _: 3
               /* FORWARDED */
-            }, 8, ["value"]))
+            }, 8, ["flag", "item", "index"]), [
+              [vue.vShow, state.toggleSidebarFlag]
+            ])
           ])
-        ])
-      ]);
+        ],
+        512
+        /* NEED_PATCH */
+      );
     };
   }
 });