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

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

@@ -3,43 +3,52 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
-var AI = require('../../img/AI.png.js');
+var aiAvatar = require('../../img/aiAvatar.png.js');
 var markdown = require('../../utils/markdown.js');
 var FileView = require('../../component/FileView.vue.js');
 var ImageView = require('../../component/ImageView.vue.js');
 var LinkView = require('../../component/LinkView.vue.js');
 var CardView = require('../../component/CardView.vue.js');
 var MessageActions = require('./MessageActions.vue.js');
+var face = require('../../component/AiRobot/face.vue.js');
+var meterialPrepare = require('../../component/AiRobot/meterialPrepare.vue.js');
+var letter = require('../../component/AiRobot/letter.vue.js');
+var ThoughtChain = require('../../component/ThoughtChain.vue.js');
 
 var _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "AiMessage",
   props: {
     item: {},
-    index: {}
+    index: {},
+    hasRetry: { type: Boolean, default: true }
   },
-  emits: ["copy", "retry", "like", "dislike", "contentRendered"],
+  emits: ["copy", "retry", "like", "dislike", "contentRendered", "completeRendered", "toggle-sidebar"],
   setup(__props, { emit: __emit }) {
     const componentMap = {
       FileView: FileView.default,
       ImageView: ImageView.default,
       LinkView: LinkView.default,
-      CardView: CardView.default
+      CardView: CardView.default,
+      Face: face.default,
+      MeterialPrepare: meterialPrepare.default
     };
     const props = __props;
     const emits = __emit;
-    const htmlContentRef = vue.ref(null);
-    const thinkingContentRef = vue.ref(null);
-    const reasoningContentRef = vue.ref(null);
     const collapse = vue.ref(true);
     const isShowAvatar = vue.ref(true);
-    const aiAvatarPath = vue.ref(AI.default);
-    const rootMap = vue.inject("rootMap", {});
-    const isAvatar = vue.inject("isAvatar", true);
+    const aiAvatarPath = vue.ref(aiAvatar.default);
+    const components = vue.inject("components", {});
+    const avatar = vue.inject("avatar", true);
+    const scripts = vue.inject("scripts", []);
+    const layout = vue.inject("layout", "side, think, upload, chain");
+    const chainAble = layout.includes("chain");
+    const showComponent = vue.ref(false);
+    const showFn = vue.ref(false);
     const init = () => {
-      isShowAvatar.value = isAvatar;
+      isShowAvatar.value = avatar;
     };
     const componentName = vue.computed(() => {
-      const slotMap = rootMap;
+      const slotMap = components;
       const newMap = {
         ...slotMap,
         ...componentMap
@@ -52,291 +61,224 @@ var _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const reasoningContentShow = vue.computed(() => {
       return props.item.reasoningContent;
     });
+    const processedContent = vue.computed(() => {
+      var _a;
+      return props.item.content ? ((_a = markdown.default) == null ? void 0 : _a.render(props.item.content, { isReasoning: false })) || "" : "";
+    });
+    const processedThinkContent = vue.computed(() => {
+      var _a;
+      return props.item.thinkContent ? ((_a = markdown.default) == null ? void 0 : _a.render(props.item.thinkContent, { isReasoning: true })) || "" : "";
+    });
+    const processedReasoningContent = vue.computed(() => {
+      var _a;
+      return props.item.reasoningContent ? ((_a = markdown.default) == null ? void 0 : _a.render(props.item.reasoningContent, { isReasoning: true })) || "" : "";
+    });
     const contentShow = vue.computed(() => {
       return props.item.content;
     });
-    vue.nextTick(() => {
-      renderContent();
+    const toggleSidebarClick = (item, index) => {
+      emits("toggle-sidebar", item, index);
+    };
+    vue.onMounted(() => {
+      init();
     });
-    vue.watch(
-      () => [props.item.content, props.item.thinkContent, props.item.reasoningContent],
-      () => {
-        vue.nextTick(() => renderContent());
-      },
-      { deep: true }
-    );
-    const renderContent = () => {
-      var _a, _b, _c;
-      if (htmlContentRef.value) {
-        htmlContentRef.value.innerHTML = props.item.content ? markdown.default && ((_a = markdown.default) == null ? void 0 : _a.render(props.item.content, { isReasoning: false })) || "" : "";
-        emits("contentRendered", htmlContentRef.value);
-      }
-      if (thinkingContentRef.value) {
-        thinkingContentRef.value.innerHTML = props.item.thinkContent ? markdown.default && ((_b = markdown.default) == null ? void 0 : _b.render(props.item.thinkContent, { isReasoning: true })) || "" : "";
-        emits("contentRendered", thinkingContentRef.value);
-      }
-      if (reasoningContentRef.value) {
-        reasoningContentRef.value.innerHTML = props.item.reasoningContent ? markdown.default && ((_c = markdown.default) == null ? void 0 : _c.render(props.item.reasoningContent, { isReasoning: true })) || "" : "";
-        emits("contentRendered", reasoningContentRef.value);
+    const completeCompentent = () => {
+      var _a;
+      emits("completeRendered", ((_a = props.item) == null ? void 0 : _a.chatId) || "");
+      showFn.value = true;
+    };
+    const completeLetter = () => {
+      var _a;
+      showComponent.value = true;
+      if (!props.item.componentName) {
+        emits("completeRendered", ((_a = props.item) == null ? void 0 : _a.chatId) || "");
+        showFn.value = true;
       }
-      init();
+    };
+    const startCompentent = () => {
+      console.log("startCompentent");
+    };
+    const startLetter = () => {
+      showComponent.value = false;
+      showFn.value = false;
     };
     const onCopy = () => emits("copy", props.index);
     const onRetry = () => emits("retry", props.index);
     const onLike = () => emits("like", props.index);
     const onDislike = () => emits("dislike", props.index);
     return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", { class: "to-chat-item ai-message" }, [
-        vue.createElementVNode("div", { class: "message-content" }, [
-          vue.createElementVNode("div", { class: "avatar-container" }, [
-            vue.renderSlot(_ctx.$slots, "aiAvatar", {}, () => [
-              vue.createCommentVNode(" \u9ED8\u8BA4\u5934\u50CF "),
-              isShowAvatar.value ? (vue.openBlock(), vue.createElementBlock("img", {
+      return vue.openBlock(), vue.createElementBlock("div", {
+        class: "touchchat-ai touchchat-item",
+        "data-chat-id": __props.item.chatId
+      }, [
+        vue.createCommentVNode(" \u5934\u50CF\u533A\u57DF "),
+        vue.createElementVNode("div", { class: "touchchat-ai-avatar" }, [
+          vue.renderSlot(_ctx.$slots, "aiAvatar", {}, () => [
+            isShowAvatar.value ? (vue.openBlock(), vue.createElementBlock("img", {
+              key: 0,
+              src: aiAvatarPath.value,
+              class: "touchchat-ai-avatar-pic"
+            }, null, 8, ["src"])) : vue.createCommentVNode("v-if", true)
+          ])
+        ]),
+        vue.createCommentVNode(" \u5185\u5BB9\u533A\u57DF "),
+        vue.createElementVNode(
+          "div",
+          {
+            class: vue.normalizeClass(["touchchat-ai-content", { "is-full": !__props.item.isChating && __props.item.componentName }])
+          },
+          [
+            vue.createCommentVNode(" \u6C14\u6CE1 "),
+            vue.createElementVNode("div", { class: "touchchat-ai-bubble" }, [
+              vue.createCommentVNode(" \u601D\u8003\u5185\u5BB9 "),
+              thinkContentShow.value ? (vue.openBlock(), vue.createElementBlock("div", {
                 key: 0,
-                src: aiAvatarPath.value,
-                class: "avatar"
-              }, null, 8, ["src"])) : vue.createCommentVNode("v-if", true)
-            ])
-          ]),
-          vue.createElementVNode("div", { style: { "width": "100%" } }, [
-            vue.createElementVNode(
-              "div",
-              {
-                class: vue.normalizeClass(["text-content", { full: !_ctx.item.isChating && _ctx.item.componentName }])
-              },
-              [
-                vue.createElementVNode("div", { class: "ai-message-wrapper" }, [
-                  vue.createCommentVNode(" \u5185\u5BB9\u533A\u57DF "),
-                  vue.createElementVNode("div", { class: "msg-content-container" }, [
-                    vue.createCommentVNode(" <span>{{item.componentName}}</span> "),
-                    vue.createCommentVNode(" \u601D\u8003\u5185\u5BB9 "),
-                    thinkContentShow.value ? (vue.openBlock(), vue.createElementBlock(
-                      "div",
-                      {
-                        key: 0,
-                        ref: (el) => thinkingContentRef.value = el,
-                        class: "think-content"
-                      },
+                class: "touchchat-ai-think",
+                innerHTML: processedThinkContent.value
+              }, null, 8, ["innerHTML"])) : vue.createCommentVNode("v-if", true),
+              vue.createCommentVNode(" \u63A8\u7406\u5185\u5BB9 "),
+              reasoningContentShow.value ? (vue.openBlock(), vue.createElementBlock("div", {
+                key: 1,
+                class: "touchchat-ai-think"
+              }, [
+                vue.createElementVNode("div", { class: "touchchat-ai-think-header" }, [
+                  vue.createElementVNode("div", { class: "touchchat-ai-think-state" }, [
+                    vue.createTextVNode(
+                      vue.toDisplayString(__props.item.thinkStatus === "thinking" ? "\u6DF1\u5EA6\u601D\u8003\u4E2D..." : __props.item.thinkStatus === "completed" ? "\u5DF2\u6DF1\u5EA6\u601D\u8003" : "\u601D\u8003\u5DF2\u505C\u6B62") + " ",
+                      1
+                      /* TEXT */
+                    ),
+                    __props.item.thinkStatus === "completed" ? (vue.openBlock(), vue.createElementBlock(
+                      vue.Fragment,
+                      { key: 0 },
+                      [
+                        vue.createTextVNode(
+                          "\uFF08\u7528\u65F6" + vue.toDisplayString((__props.item.thinkTime || 0) / 1e3) + "\u79D2\uFF09",
+                          1
+                          /* TEXT */
+                        )
+                      ],
+                      64
+                      /* STABLE_FRAGMENT */
+                    )) : vue.createCommentVNode("v-if", true)
+                  ]),
+                  vue.createElementVNode("div", {
+                    class: vue.normalizeClass(["touchchat-ai-think-toggle", collapse.value ? "" : "is-expand"]),
+                    onClick: ($event) => collapse.value = !collapse.value
+                  }, [
+                    vue.createElementVNode("span", { class: "touchchat-ai-think-toggle-icon" })
+                  ], 10, ["onClick"])
+                ]),
+                vue.createVNode(vue.Transition, {
+                  name: "touchchat-ai-think-collpase",
+                  persisted: ""
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.withDirectives(vue.createElementVNode("div", {
+                      class: "touchchat-ai-think-content",
+                      innerHTML: processedReasoningContent.value
+                    }, null, 8, ["innerHTML"]), [
+                      [vue.vShow, collapse.value && !vue.unref(chainAble)]
+                    ])
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }),
+                vue.createVNode(vue.Transition, {
+                  name: "touchchat-ai-think-collpase",
+                  persisted: ""
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.withDirectives(vue.createVNode(
+                      ThoughtChain.default,
                       null,
-                      512
-                      /* NEED_PATCH */
-                    )) : vue.createCommentVNode("v-if", true),
-                    vue.createCommentVNode(" \u63A8\u7406\u5185\u5BB9 "),
-                    reasoningContentShow.value ? (vue.openBlock(), vue.createElementBlock("div", {
-                      key: 1,
-                      class: "reasoning-content"
-                    }, [
-                      vue.createElementVNode("div", { class: "reasoning-header" }, [
-                        vue.createElementVNode("div", { class: "reasoning-status" }, [
-                          (vue.openBlock(), vue.createElementBlock("svg", {
-                            xmlns: "http://www.w3.org/2000/svg",
-                            width: "14",
-                            height: "14",
-                            viewBox: "0 0 14 14",
-                            fill: "none"
-                          }, [
-                            vue.createElementVNode("path", {
-                              d: "M5.74953 8.22414L2.87513 5.34974C2.19171 4.66632 2.19172 3.55828 2.87513 2.87487C3.55855 2.19145 4.66659 2.19145 5.35001 2.87487L5.76366 3.28852",
-                              stroke: "#0077FA",
-                              "stroke-width": "1.16667",
-                              "stroke-linecap": "round",
-                              "stroke-linejoin": "round"
-                            }),
-                            vue.createElementVNode("path", {
-                              d: "M8.23818 5.76292L11.1248 8.64955C11.8082 9.33297 11.8082 10.441 11.1248 11.1244C10.4414 11.8078 9.33335 11.8078 8.64994 11.1244L8.23127 10.7058",
-                              stroke: "#0077FA",
-                              "stroke-width": "1.16667",
-                              "stroke-linecap": "round",
-                              "stroke-linejoin": "round"
-                            }),
-                            vue.createElementVNode("path", {
-                              d: "M8.23736 8.23754L5.34674 11.1282C4.66512 11.8098 3.55855 11.8083 2.87513 11.1249C2.19172 10.4415 2.19025 9.3349 2.87186 8.65328L3.28526 8.23989",
-                              stroke: "#0077FA",
-                              "stroke-width": "1.16667",
-                              "stroke-linecap": "round",
-                              "stroke-linejoin": "round"
-                            }),
-                            vue.createElementVNode("path", {
-                              d: "M5.7627 5.76233L8.64774 2.87729C9.33243 2.19259 10.4415 2.19156 11.1249 2.87498C11.8083 3.55839 11.8073 4.66747 11.1226 5.35216L10.7261 5.74866",
-                              stroke: "#0077FA",
-                              "stroke-width": "1.16667",
-                              "stroke-linecap": "round",
-                              "stroke-linejoin": "round"
-                            })
-                          ])),
-                          vue.createElementVNode(
-                            "span",
-                            { class: "status-text" },
-                            vue.toDisplayString(_ctx.item.thinkStatus === "thinking" ? "\u6DF1\u5EA6\u601D\u8003\u4E2D..." : _ctx.item.thinkStatus === "completed" ? "\u5DF2\u6DF1\u5EA6\u601D\u8003" : "\u601D\u8003\u5DF2\u505C\u6B62"),
-                            1
-                            /* TEXT */
-                          ),
-                          _ctx.item.thinkStatus === "completed" ? (vue.openBlock(), vue.createElementBlock(
-                            "span",
-                            {
-                              key: 0,
-                              class: "think-time"
-                            },
-                            " (\u7528\u65F6" + vue.toDisplayString((_ctx.item.thinkTime || 0) / 1e3) + "\u79D2) ",
-                            1
-                            /* TEXT */
-                          )) : vue.createCommentVNode("v-if", true)
-                        ]),
-                        vue.createCommentVNode(" fold-active "),
-                        (vue.openBlock(), vue.createElementBlock("svg", {
-                          class: "folding",
-                          xmlns: "http://www.w3.org/2000/svg",
-                          width: "9",
-                          height: "5",
-                          viewBox: "0 0 9 5",
-                          fill: "none",
-                          onClick: ($event) => collapse.value = !collapse.value
-                        }, [
-                          vue.withDirectives(vue.createElementVNode(
-                            "path",
-                            {
-                              d: "M8.5 4.5L4.5 0.499999L0.5 4.5",
-                              stroke: "#1D2129",
-                              "stroke-linecap": "round",
-                              "stroke-linejoin": "round"
-                            },
-                            null,
-                            512
-                            /* NEED_PATCH */
-                          ), [
-                            [vue.vShow, collapse.value]
-                          ]),
-                          vue.withDirectives(vue.createElementVNode(
-                            "path",
-                            {
-                              d: "M9 0.5L5 4.5L1 0.500001",
-                              stroke: "#1D2129",
-                              "stroke-linecap": "round",
-                              "stroke-linejoin": "round"
-                            },
-                            null,
-                            512
-                            /* NEED_PATCH */
-                          ), [
-                            [vue.vShow, !collapse.value]
-                          ])
-                        ], 8, ["onClick"])),
-                        vue.createCommentVNode(' <svg v-else class="folding" xmlns="http://www.w3.org/2000/svg" width="10" height="5" viewBox="0 0 10 5" fill="none">\n								<path d="M9 0.5L5 4.5L1 0.500001" stroke="#1D2129" stroke-linecap="round" stroke-linejoin="round"/>\n							</svg> ')
-                      ]),
-                      vue.createVNode(vue.Transition, {
-                        name: "reasoning-collapse",
-                        persisted: ""
-                      }, {
-                        default: vue.withCtx(() => [
-                          vue.withDirectives(vue.createElementVNode(
-                            "div",
-                            {
-                              ref: (el) => reasoningContentRef.value = el
-                            },
-                            null,
-                            512
-                            /* NEED_PATCH */
-                          ), [
-                            [vue.vShow, collapse.value]
-                          ])
-                        ]),
-                        _: 1
-                        /* STABLE */
-                      })
-                    ])) : vue.createCommentVNode("v-if", true),
-                    vue.createCommentVNode(" \u4E3B\u5185\u5BB9 "),
-                    contentShow.value ? (vue.openBlock(), vue.createElementBlock(
-                      "div",
-                      {
-                        key: 2,
-                        ref: (el) => htmlContentRef.value = el,
-                        class: "msg-rich-text markdown"
-                      },
                       null,
                       512
                       /* NEED_PATCH */
-                    )) : vue.createCommentVNode("v-if", true),
-                    !_ctx.item.isChating ? vue.renderSlot(_ctx.$slots, "aiMessageContent", {
-                      key: 3,
-                      item: _ctx.item,
-                      index: _ctx.index
-                    }, () => [
-                      (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(componentName.value), {
-                        index: _ctx.index,
-                        item: _ctx.item
-                      }, null, 8, ["index", "item"]))
-                    ]) : vue.createCommentVNode("v-if", true),
-                    vue.createCommentVNode(" \u65B0\u589E\u52A0\u8F7D\u72B6\u6001\u533A\u57DF "),
-                    _ctx.item.isChating ? (vue.openBlock(), vue.createElementBlock("div", {
-                      key: 4,
-                      class: "loading-indicator"
-                    }, [
-                      (vue.openBlock(), vue.createElementBlock("svg", {
-                        class: "loading-spin",
-                        xmlns: "http://www.w3.org/2000/svg",
-                        width: "23",
-                        height: "23",
-                        viewBox: "0 0 23 23",
-                        fill: "none"
-                      }, [
-                        vue.createElementVNode("g", {
-                          "clip-path": "url(#paint0_angular_2228_1409_clip_path)",
-                          "data-figma-skip-parse": "true"
-                        }, [
-                          vue.createElementVNode("g", { transform: "matrix(0.00917971 0.00166904 -0.00166904 0.00917971 11.4999 11.842)" }, [
-                            (vue.openBlock(), vue.createElementBlock("foreignObject", {
-                              x: "-1356.57",
-                              y: "-1356.57",
-                              width: "2713.14",
-                              height: "2713.14"
-                            }, [
-                              vue.createElementVNode("div", {
-                                xmlns: "http://www.w3.org/1999/xhtml",
-                                style: { "background": "conic-gradient(\n                              from 90deg,\n                              rgba(0, 119, 250, 1) 0deg,\n                              rgba(255, 255, 255, 0) 84.375deg,\n                              rgba(0, 119, 250, 1) 360deg\n                            )", "height": "100%", "width": "100%", "opacity": "1" }
-                              })
-                            ]))
-                          ])
-                        ]),
-                        vue.createElementVNode("path", {
-                          "fill-rule": "evenodd",
-                          "clip-rule": "evenodd",
-                          d: "M11.4999 5.15277C7.80558 5.15277 4.81073 8.14762 4.81073 11.842C4.81073 15.5363 7.80558 18.5311 11.4999 18.5311C12.1841 18.5311 12.7387 19.0858 12.7387 19.7699C12.7387 20.454 12.1841 21.0086 11.4999 21.0086C6.43731 21.0086 2.33325 16.9046 2.33325 11.842C2.33325 6.77935 6.43731 2.67529 11.4999 2.67529C16.5625 2.67529 20.6666 6.77935 20.6666 11.842C20.6666 12.5261 20.112 13.0807 19.4278 13.0807C18.7437 13.0807 18.1891 12.5261 18.1891 11.842C18.1891 8.14762 15.1943 5.15277 11.4999 5.15277Z",
-                          "data-figma-gradient-fill": '{"type":"GRADIENT_ANGULAR","stops":[{"color":{"r":1.0,"g":1.0,"b":1.0,"a":0.0},"position":0.2343750},{"color":{"r":0.0,"g":0.46666666865348816,"b":0.98039215803146362,"a":1.0},"position":1.0}],"stopsVar":[],"transform":{"m00":18.359409332275391,"m01":-3.3380792140960693,"m02":3.9892544746398926,"m10":3.3380761146545410,"m11":18.359424591064453,"m12":0.99320876598358154},"opacity":1.0,"blendMode":"NORMAL","visible":true}'
-                        }),
-                        vue.createElementVNode("defs", null, [
-                          vue.createElementVNode("clipPath", { id: "paint0_angular_2228_1409_clip_path" }, [
-                            vue.createElementVNode("path", {
-                              "fill-rule": "evenodd",
-                              "clip-rule": "evenodd",
-                              d: "M11.4999 5.15277C7.80558 5.15277 4.81073 8.14762 4.81073 11.842C4.81073 15.5363 7.80558 18.5311 11.4999 18.5311C12.1841 18.5311 12.7387 19.0858 12.7387 19.7699C12.7387 20.454 12.1841 21.0086 11.4999 21.0086C6.43731 21.0086 2.33325 16.9046 2.33325 11.842C2.33325 6.77935 6.43731 2.67529 11.4999 2.67529C16.5625 2.67529 20.6666 6.77935 20.6666 11.842C20.6666 12.5261 20.112 13.0807 19.4278 13.0807C18.7437 13.0807 18.1891 12.5261 18.1891 11.842C18.1891 8.14762 15.1943 5.15277 11.4999 5.15277Z"
-                            })
-                          ])
-                        ])
-                      ])),
-                      vue.createElementVNode("span", { class: "loading-text" }, "\u52A0\u8F7D\u4E2D...")
-                    ])) : vue.createCommentVNode("v-if", true)
-                  ])
-                ])
-              ],
-              2
-              /* CLASS */
-            ),
-            vue.withDirectives(vue.createVNode(MessageActions.default, {
-              "message-type": "ai",
-              index: _ctx.index,
-              "is-show-like": _ctx.item.isShowLike,
-              "is-liked": _ctx.item.isLiked,
-              "is-disliked": _ctx.item.isDisliked,
-              onCopy,
-              onRetry,
-              onLike,
-              onDislike
-            }, null, 8, ["index", "is-show-like", "is-liked", "is-disliked"]), [
-              [vue.vShow, !_ctx.item.isChating]
-            ])
-          ])
-        ])
-      ]);
+                    ), [
+                      [vue.vShow, collapse.value && vue.unref(chainAble)]
+                    ])
+                  ]),
+                  _: 1
+                  /* STABLE */
+                })
+              ])) : vue.createCommentVNode("v-if", true),
+              vue.createCommentVNode(" \u4E3B\u5185\u5BB9 "),
+              vue.renderSlot(_ctx.$slots, "aimsg", {
+                item: __props.item,
+                index: __props.index
+              }, () => [
+                contentShow.value && vue.unref(scripts) && vue.unref(scripts).length === 0 ? (vue.openBlock(), vue.createElementBlock("div", {
+                  key: 0,
+                  class: "touchchat-ai-bubble-text touchchat-markdown",
+                  innerHTML: processedContent.value
+                }, null, 8, ["innerHTML"])) : vue.createCommentVNode("v-if", true)
+              ]),
+              vue.createCommentVNode(" && !item.componentName "),
+              vue.createCommentVNode(" <span>letter111{{item}}</span>  "),
+              vue.unref(scripts) && vue.unref(scripts).length > 0 ? (vue.openBlock(), vue.createBlock(letter.default, {
+                key: 2,
+                "auto-start": "",
+                data: __props.item.content,
+                onStart: startLetter,
+                onComplete: completeLetter
+              }, null, 8, ["data"])) : vue.createCommentVNode("v-if", true),
+              vue.createCommentVNode(" <span>letter222</span>  "),
+              vue.unref(scripts).length > 0 && (showComponent.value || !__props.item.content) || !vue.unref(scripts).length && !__props.item.isChating ? vue.renderSlot(_ctx.$slots, "msg", {
+                key: 3,
+                item: __props.item,
+                index: __props.index
+              }, () => [
+                (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(componentName.value), {
+                  index: __props.index,
+                  item: __props.item,
+                  onStart: startCompentent,
+                  onComplete: completeCompentent,
+                  onToggleSidebar: toggleSidebarClick
+                }, null, 40, ["index", "item"]))
+              ]) : vue.createCommentVNode("v-if", true),
+              vue.createCommentVNode(" \u65B0\u589E\u52A0\u8F7D\u72B6\u6001\u533A\u57DF "),
+              __props.item.isChating ? (vue.openBlock(), vue.createElementBlock("div", {
+                key: 4,
+                class: "touchchat-ai-loading"
+              }, [
+                vue.createElementVNode("div", { class: "touchchat-ai-loading-icon" }),
+                vue.createElementVNode("span", { class: "touchchat-ai-loading-text" }, "\u52A0\u8F7D\u4E2D...")
+              ])) : vue.createCommentVNode("v-if", true)
+            ]),
+            vue.renderSlot(_ctx.$slots, "fn", {
+              item: __props.item,
+              index: __props.index
+            }, () => [
+              vue.withDirectives(vue.createVNode(MessageActions.default, {
+                item: __props.item,
+                "message-type": "ai",
+                index: __props.index,
+                "has-retry": __props.hasRetry,
+                "show-copy": true,
+                onCopy,
+                onRetry,
+                onLike,
+                onDislike
+              }, {
+                extendsFn: vue.withCtx(() => [
+                  vue.renderSlot(_ctx.$slots, "extendsFn", {
+                    item: __props.item,
+                    index: __props.index
+                  })
+                ]),
+                _: 3
+                /* FORWARDED */
+              }, 8, ["item", "index", "has-retry"]), [
+                [vue.vShow, showFn.value && vue.unref(scripts).length > 0 || !vue.unref(scripts).length && !__props.item.isChating]
+              ])
+            ]),
+            vue.createCommentVNode(" && !scripts.length ")
+          ],
+          2
+          /* CLASS */
+        )
+      ], 8, ["data-chat-id"]);
     };
   }
 });