@fv-ui/ai-chat 0.4.0 → 0.7.0

package/lib/index.js

@@ -3359,7 +3359,7 @@
     key: 1,
     class: "fv-editor-footer"
   };
-  const _hoisted_17 = { class: "fv-editor-select-dialog" };
+  const _hoisted_17$1 = { class: "fv-editor-select-dialog" };
   const _hoisted_18 = { class: "fv-editor-select-title" };
   const _hoisted_19 = { class: "fv-editor-select-grid" };
   const _hoisted_20 = ["onClick"];
@@ -4322,7 +4322,7 @@
               onClose: closeSelectDialog
             }, {
               default: vue.withCtx(() => [
-                vue.createElementVNode("div", _hoisted_17, [
+                vue.createElementVNode("div", _hoisted_17$1, [
                   (vue.openBlock(true), vue.createElementBlock(
                     vue.Fragment,
                     null,
@@ -5631,6 +5631,7 @@
         role: node.role,
         content: node.content,
         reasoning: node.reasoning,
+        toolSteps: node.toolSteps ? node.toolSteps.map((s) => ({ ...s })) : void 0,
         files: node.files ? [...node.files] : void 0,
         modelIdx: node.modelIdx,
         model: node.model,
@@ -5911,6 +5912,17 @@ ${fileParts.join("\n")}` });
           msgs.edit(assistantId, { backendId: id });
         },
         onTool: (ev) => {
+          const steps = [...msgs.messages.value[assistantId]?.toolSteps ?? []];
+          if (ev.status === "start") {
+            steps.push({
+              key: `${ev.toolName}-${steps.length}`,
+              title: options.toolStepLabel ? options.toolStepLabel(ev.toolName) : ev.toolName,
+              status: "loading"
+            });
+          } else if (steps.length) {
+            steps[steps.length - 1] = { ...steps[steps.length - 1], status: "success" };
+          }
+          msgs.edit(assistantId, { toolSteps: steps });
           options.onToolEvent?.(ev);
         },
         onDone: () => {
@@ -6024,50 +6036,51 @@ ${fileParts.join("\n")}` });
     key: 0,
     class: "fv-msg-avatar"
   };
-  const _hoisted_3$3 = { class: "fv-msg-main" };
-  const _hoisted_4$2 = {
+  const _hoisted_3$3 = ["src"];
+  const _hoisted_4$2 = ["src"];
+  const _hoisted_5 = { class: "fv-msg-main" };
+  const _hoisted_6 = {
     key: 0,
     class: "fv-msg-header"
   };
-  const _hoisted_5 = { class: "fv-msg-role" };
-  const _hoisted_6 = {
-    key: 0,
+  const _hoisted_7 = {
+    key: 2,
     class: "fv-msg-model"
   };
-  const _hoisted_7 = {
+  const _hoisted_8 = {
     key: 1,
     class: "fv-msg-files"
   };
-  const _hoisted_8 = ["src", "alt"];
-  const _hoisted_9 = {
+  const _hoisted_9 = ["src", "alt"];
+  const _hoisted_10 = {
     key: 1,
     class: "fv-msg-file-name"
   };
-  const _hoisted_10 = {
-    key: 3,
+  const _hoisted_11 = {
+    key: 4,
     class: "fv-msg-content"
   };
-  const _hoisted_11 = {
+  const _hoisted_12 = {
     key: 0,
     class: "fv-msg-error"
   };
-  const _hoisted_12 = {
+  const _hoisted_13 = {
     key: 2,
     class: "fv-msg-pending"
   };
-  const _hoisted_13 = {
-    key: 4,
-    class: "fv-msg-content fv-msg-content-user"
-  };
   const _hoisted_14 = {
     key: 5,
-    class: "fv-msg-actions"
+    class: "fv-msg-content fv-msg-content-user"
   };
   const _hoisted_15 = {
+    key: 6,
+    class: "fv-msg-actions"
+  };
+  const _hoisted_16 = {
     key: 0,
     class: "fv-msg-branch"
   };
-  const _hoisted_16 = { class: "fv-msg-branch-label" };
+  const _hoisted_17 = { class: "fv-msg-branch-label" };
   var _sfc_main$3 = /* @__PURE__ */ vue.defineComponent({
     ...{ name: "FvAiMessage" },
     __name: "index",
@@ -6078,6 +6091,12 @@ ${fileParts.join("\n")}` });
       showBranchSwitch: { type: Boolean, required: false, default: true },
       showUserAvatar: { type: Boolean, required: false, default: true },
       showUserName: { type: Boolean, required: false, default: true },
+      showAssistantAvatar: { type: Boolean, required: false, default: true },
+      showAssistantName: { type: Boolean, required: false, default: true },
+      userAvatar: { type: String, required: false, default: "" },
+      assistantAvatar: { type: String, required: false, default: "" },
+      userName: { type: String, required: false, default: "" },
+      assistantName: { type: String, required: false, default: "" },
       autoCollapse: { type: Boolean, required: false, default: true }
     },
     emits: ["copy", "regenerate", "branch-change"],
@@ -6092,6 +6111,19 @@ ${fileParts.join("\n")}` });
         return "end";
       });
       const hasReasoning = vue.computed(() => !!props.message.reasoning);
+      const hasToolSteps = vue.computed(() => (props.message.toolSteps?.length ?? 0) > 0);
+      const toolChainItems = vue.computed(() => {
+        const steps = props.message.toolSteps ?? [];
+        const running = props.message.status === "pending" || props.message.status === "streaming";
+        return steps.map((s) => {
+          const loading = running && s.status !== "error" && s.status !== "success";
+          return {
+            ...s,
+            status: loading ? "loading" : s.status ?? "success",
+            title: `${loading ? "\u6B63\u5728\u67E5\u8BE2" : "\u5DF2\u67E5\u8BE2"}${s.title ?? ""}`
+          };
+        });
+      });
       const modelLabel = vue.computed(() => props.message.model ?? "");
       function onCopy() {
         emit("copy", props.message);
@@ -6108,50 +6140,70 @@ ${fileParts.join("\n")}` });
           class: vue.normalizeClass(["fv-msg", [`is-${__props.message.role}`, { "is-error": __props.message.status === "error", "is-user": isUser.value }]]),
           "data-message-id": __props.message.id
         }, [
-          vue.createCommentVNode(" \u5934\u50CF:user \u53F3\u4FA7(\u81EA\u8EAB),assistant \u5DE6\u4FA7;showUserAvatar=false \u65F6\u7528\u6237\u6D88\u606F\u4E0D\u6E32\u67D3 "),
-          !isUser.value || __props.showUserAvatar ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$3, [
+          vue.createCommentVNode(" \u5934\u50CF:user \u53F3\u4FA7(\u81EA\u8EAB),assistant \u5DE6\u4FA7;\u663E\u9690\u5F00\u5173\u5173\u95ED\u65F6\u4E0D\u6E32\u67D3;\r\n         \u4F18\u5148\u7EA7:message-avatar \u6574\u4F53\u63D2\u69FD > user-avatar/assistant-avatar \u7EC6\u5206\u63D2\u69FD > props \u56FE\u7247 > \u5185\u7F6E\u56FE\u6807 "),
+          (isUser.value ? __props.showUserAvatar : __props.showAssistantAvatar) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2$3, [
             vue.renderSlot(_ctx.$slots, "message-avatar", { message: __props.message }, () => [
-              isUser.value ? (vue.openBlock(), vue.createBlock(vue.unref(elementPlus.ElIcon), {
-                key: 0,
-                class: "fv-msg-avatar-user"
-              }, {
-                default: vue.withCtx(() => [
-                  vue.createVNode(vue.unref(ElementPlusIconsVue.User))
-                ]),
-                _: 1
-                /* STABLE */
-              })) : (vue.openBlock(), vue.createBlock(vue.unref(elementPlus.ElIcon), {
-                key: 1,
-                class: "fv-msg-avatar-bot"
-              }, {
-                default: vue.withCtx(() => [
-                  vue.createVNode(vue.unref(ElementPlusIconsVue.ChatDotRound))
-                ]),
-                _: 1
-                /* STABLE */
-              }))
+              isUser.value ? vue.renderSlot(_ctx.$slots, "user-avatar", {}, () => [
+                __props.userAvatar ? (vue.openBlock(), vue.createElementBlock("img", {
+                  key: 0,
+                  class: "fv-msg-avatar-img",
+                  src: __props.userAvatar,
+                  alt: ""
+                }, null, 8, _hoisted_3$3)) : (vue.openBlock(), vue.createBlock(vue.unref(elementPlus.ElIcon), {
+                  key: 1,
+                  class: "fv-msg-avatar-user"
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.createVNode(vue.unref(ElementPlusIconsVue.User))
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }))
+              ], void 0, 0) : vue.renderSlot(_ctx.$slots, "assistant-avatar", {}, () => [
+                __props.assistantAvatar ? (vue.openBlock(), vue.createElementBlock("img", {
+                  key: 0,
+                  class: "fv-msg-avatar-img",
+                  src: __props.assistantAvatar,
+                  alt: ""
+                }, null, 8, _hoisted_4$2)) : (vue.openBlock(), vue.createBlock(vue.unref(elementPlus.ElIcon), {
+                  key: 1,
+                  class: "fv-msg-avatar-bot"
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.createVNode(vue.unref(ElementPlusIconsVue.ChatDotRound))
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }))
+              ], void 0, 1)
             ])
           ])) : vue.createCommentVNode("v-if", true),
-          vue.createElementVNode("div", _hoisted_3$3, [
-            vue.createCommentVNode(" \u5934\u90E8:\u89D2\u8272\u540D + \u6A21\u578B\u6807\u8BB0;showUserName=false \u65F6\u7528\u6237\u6D88\u606F\u4E0D\u6E32\u67D3 "),
-            !isUser.value || __props.showUserName ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_4$2, [
-              vue.createElementVNode(
-                "span",
-                _hoisted_5,
-                vue.toDisplayString(isUser.value ? "\u4F60" : "\u52A9\u624B"),
-                1
-                /* TEXT */
-              ),
+          vue.createElementVNode("div", _hoisted_5, [
+            vue.createCommentVNode(" \u5934\u90E8:\u89D2\u8272\u540D + \u6A21\u578B\u6807\u8BB0;\u663E\u9690\u5F00\u5173\u5173\u95ED\u65F6\u4E0D\u6E32\u67D3;\u7EC6\u5206\u63D2\u69FD > props > \u9ED8\u8BA4\u6587\u6848 "),
+            (isUser.value ? __props.showUserName : __props.showAssistantName) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6, [
+              isUser.value ? vue.renderSlot(_ctx.$slots, "user-name", { message: __props.message }, () => [
+                vue.createTextVNode(
+                  vue.toDisplayString(__props.userName || "\u4F60"),
+                  1
+                  /* TEXT */
+                )
+              ], void 0, 0) : vue.renderSlot(_ctx.$slots, "assistant-name", { message: __props.message }, () => [
+                vue.createTextVNode(
+                  vue.toDisplayString(__props.assistantName || "\u52A9\u624B"),
+                  1
+                  /* TEXT */
+                )
+              ], void 0, 1),
               !isUser.value && modelLabel.value ? (vue.openBlock(), vue.createElementBlock(
                 "span",
-                _hoisted_6,
+                _hoisted_7,
                 vue.toDisplayString(modelLabel.value),
                 1
                 /* TEXT */
               )) : vue.createCommentVNode("v-if", true)
             ])) : vue.createCommentVNode("v-if", true),
             vue.createCommentVNode(" \u9644\u4EF6:user \u6D88\u606F files \u4EE5 FilesCard \u5E73\u94FA "),
-            __props.message.files?.length ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7, [
+            __props.message.files?.length ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_8, [
               vue.renderSlot(_ctx.$slots, "message-files", {
                 message: __props.message,
                 files: __props.message.files
@@ -6172,9 +6224,9 @@ ${fileParts.join("\n")}` });
                           class: "fv-msg-file-img",
                           src: f.url,
                           alt: f.name
-                        }, null, 8, _hoisted_8)) : (vue.openBlock(), vue.createElementBlock(
+                        }, null, 8, _hoisted_9)) : (vue.openBlock(), vue.createElementBlock(
                           "span",
-                          _hoisted_9,
+                          _hoisted_10,
                           vue.toDisplayString(f.name),
                           1
                           /* TEXT */
@@ -6189,9 +6241,15 @@ ${fileParts.join("\n")}` });
                 ))
               ])
             ])) : vue.createCommentVNode("v-if", true),
+            vue.createCommentVNode(" \u5DE5\u5177\u8C03\u7528\u8F68\u8FF9(assistant \u542B toolSteps \u65F6):\u7EB5\u5411\u6B65\u9AA4\u94FE,Thinking \u4E4B\u4E0B\u6B63\u6587\u4E4B\u4E0A "),
+            !isUser.value && hasToolSteps.value ? (vue.openBlock(), vue.createBlock(_sfc_main$9, {
+              key: 2,
+              class: "fv-msg-tools",
+              items: toolChainItems.value
+            }, null, 8, ["items"])) : vue.createCommentVNode("v-if", true),
             vue.createCommentVNode(" \u601D\u8003\u94FE\u6298\u53E0(assistant \u542B reasoning \u65F6) "),
             !isUser.value && hasReasoning.value ? (vue.openBlock(), vue.createBlock(_sfc_main$a, {
-              key: 2,
+              key: 3,
               content: __props.message.reasoning,
               status: thinkingStatus.value,
               "auto-collapse": __props.autoCollapse
@@ -6205,17 +6263,17 @@ ${fileParts.join("\n")}` });
               /* STABLE */
             }, 8, ["content", "status", "auto-collapse"])) : vue.createCommentVNode("v-if", true),
             vue.createCommentVNode(" \u6B63\u6587:user \u7EAF\u6587\u672C\u6C14\u6CE1;assistant Markdown;pending \u7A7A\u5185\u5BB9\u7ED9\u52A0\u8F7D\u5360\u4F4D "),
-            !isUser.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_10, [
+            !isUser.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_11, [
               __props.message.status === "error" ? (vue.openBlock(), vue.createElementBlock(
                 "span",
-                _hoisted_11,
+                _hoisted_12,
                 vue.toDisplayString(__props.message.error || "\u751F\u6210\u5931\u8D25"),
                 1
                 /* TEXT */
               )) : __props.message.content ? (vue.openBlock(), vue.createBlock(_sfc_main$i, {
                 key: 1,
                 content: __props.message.content
-              }, null, 8, ["content"])) : __props.message.status === "pending" || __props.message.status === "streaming" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_12, [
+              }, null, 8, ["content"])) : __props.message.status === "pending" || __props.message.status === "streaming" ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_13, [
                 (vue.openBlock(), vue.createElementBlock(
                   vue.Fragment,
                   null,
@@ -6238,13 +6296,13 @@ ${fileParts.join("\n")}` });
               ])) : vue.createCommentVNode("v-if", true)
             ])) : (vue.openBlock(), vue.createElementBlock(
               "div",
-              _hoisted_13,
+              _hoisted_14,
               vue.toDisplayString(__props.message.content),
               1
               /* TEXT */
             )),
             vue.createCommentVNode(" \u64CD\u4F5C\u533A:assistant \u590D\u5236/\u91CD\u751F\u6210 + \u5206\u652F\u5207\u6362;user \u4EC5\u590D\u5236(hover \u6D88\u606F\u65F6\u6D6E\u73B0,\u89C1 scss) "),
-            __props.showActions || __props.showBranchSwitch && __props.branch && __props.branch.count > 1 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14, [
+            __props.showActions || __props.showBranchSwitch && __props.branch && __props.branch.count > 1 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_15, [
               vue.renderSlot(_ctx.$slots, "message-actions", { message: __props.message }, () => [
                 __props.showActions && isUser.value ? (vue.openBlock(), vue.createBlock(vue.unref(elementPlus.ElTooltip), {
                   key: 0,
@@ -6335,7 +6393,7 @@ ${fileParts.join("\n")}` });
                 })) : vue.createCommentVNode("v-if", true)
               ]),
               vue.createCommentVNode(" \u5206\u652F\u5207\u6362:\u5144\u5F1F\u5206\u652F > 1 \u65F6 "),
-              __props.showBranchSwitch && __props.branch && __props.branch.count > 1 ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_15, [
+              __props.showBranchSwitch && __props.branch && __props.branch.count > 1 ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_16, [
                 vue.createVNode(vue.unref(elementPlus.ElButton), {
                   text: "",
                   size: "small",
@@ -6358,7 +6416,7 @@ ${fileParts.join("\n")}` });
                 }, 8, ["disabled"]),
                 vue.createElementVNode(
                   "span",
-                  _hoisted_16,
+                  _hoisted_17,
                   vue.toDisplayString(__props.branch.index) + " / " + vue.toDisplayString(__props.branch.count),
                   1
                   /* TEXT */
@@ -6409,10 +6467,18 @@ ${fileParts.join("\n")}` });
       suggestions: { type: Array, required: false, default: () => [] },
       suggestionsTitle: { type: String, required: false, default: "" },
       scrollThreshold: { type: Number, required: false, default: 40 },
+      showScrollButton: { type: Boolean, required: false, default: true },
+      scrollButtonThreshold: { type: Number, required: false, default: 100 },
       showActions: { type: Boolean, required: false, default: true },
       showBranchSwitch: { type: Boolean, required: false, default: true },
       showUserAvatar: { type: Boolean, required: false, default: true },
-      showUserName: { type: Boolean, required: false, default: true }
+      showUserName: { type: Boolean, required: false, default: true },
+      showAssistantAvatar: { type: Boolean, required: false, default: true },
+      showAssistantName: { type: Boolean, required: false, default: true },
+      userAvatar: { type: String, required: false, default: "" },
+      assistantAvatar: { type: String, required: false, default: "" },
+      userName: { type: String, required: false, default: "" },
+      assistantName: { type: String, required: false, default: "" }
     },
     emits: ["select", "copy", "regenerate", "branch-change"],
     setup(__props, { expose: __expose, emit: __emit }) {
@@ -6437,8 +6503,14 @@ ${fileParts.join("\n")}` });
       function scrollToBottomIfNear() {
         if (distanceFromBottom() <= props.scrollThreshold) vue.nextTick(() => scrollToBottom());
       }
+      const isAwayFromBottom = vue.ref(false);
+      function onScroll() {
+        isAwayFromBottom.value = distanceFromBottom() > props.scrollButtonThreshold;
+      }
+      vue.watch(() => props.scrollButtonThreshold, onScroll);
       vue.onMounted(() => {
         if (!isEmpty.value) vue.nextTick(() => scrollToBottom(false));
+        onScroll();
       });
       vue.watch(() => props.messages.length, (nv, ov) => {
         if (nv > (ov ?? 0)) scrollToBottomIfNear();
@@ -6515,7 +6587,8 @@ ${fileParts.join("\n")}` });
                 {
                   ref_key: "scrollRef",
                   ref: scrollRef,
-                  class: "fv-messages-scroll"
+                  class: "fv-messages-scroll",
+                  onScrollPassive: onScroll
                 },
                 [
                   vue.createElementVNode("div", _hoisted_3$2, [
@@ -6531,6 +6604,12 @@ ${fileParts.join("\n")}` });
                           "show-branch-switch": __props.showBranchSwitch,
                           "show-user-avatar": __props.showUserAvatar,
                           "show-user-name": __props.showUserName,
+                          "show-assistant-avatar": __props.showAssistantAvatar,
+                          "show-assistant-name": __props.showAssistantName,
+                          "user-avatar": __props.userAvatar,
+                          "assistant-avatar": __props.assistantAvatar,
+                          "user-name": __props.userName,
+                          "assistant-name": __props.assistantName,
                           onCopy,
                           onRegenerate,
                           onBranchChange: onBranch
@@ -6551,16 +6630,77 @@ ${fileParts.join("\n")}` });
                               vue.renderSlot(_ctx.$slots, "message-actions", vue.mergeProps({ ref_for: true }, scope))
                             ]),
                             key: "1"
+                          } : void 0,
+                          _ctx.$slots["user-avatar"] ? {
+                            name: "user-avatar",
+                            fn: vue.withCtx(() => [
+                              vue.renderSlot(_ctx.$slots, "user-avatar")
+                            ]),
+                            key: "2"
+                          } : void 0,
+                          _ctx.$slots["assistant-avatar"] ? {
+                            name: "assistant-avatar",
+                            fn: vue.withCtx(() => [
+                              vue.renderSlot(_ctx.$slots, "assistant-avatar")
+                            ]),
+                            key: "3"
+                          } : void 0,
+                          _ctx.$slots["user-name"] ? {
+                            name: "user-name",
+                            fn: vue.withCtx((scope) => [
+                              vue.renderSlot(_ctx.$slots, "user-name", vue.mergeProps({ ref_for: true }, scope))
+                            ]),
+                            key: "4"
+                          } : void 0,
+                          _ctx.$slots["assistant-name"] ? {
+                            name: "assistant-name",
+                            fn: vue.withCtx((scope) => [
+                              vue.renderSlot(_ctx.$slots, "assistant-name", vue.mergeProps({ ref_for: true }, scope))
+                            ]),
+                            key: "5"
                           } : void 0
-                        ]), 1032, ["message", "branch", "show-actions", "show-branch-switch", "show-user-avatar", "show-user-name"]);
+                        ]), 1032, ["message", "branch", "show-actions", "show-branch-switch", "show-user-avatar", "show-user-name", "show-assistant-avatar", "show-assistant-name", "user-avatar", "assistant-avatar", "user-name", "assistant-name"]);
                       }),
                       128
                       /* KEYED_FRAGMENT */
-                    ))
+                    )),
+                    vue.createCommentVNode(" \u6EDA\u5230\u5E95\u90E8\u60AC\u6D6E\u6309\u94AE:\u5728 fv-messages-inner \u5185,\u968F\u5185\u5BB9\u5BBD\u5EA6\u7EA6\u675F\u5C42\u5B9A\u4F4D(\u5BBD\u5C4F\u65F6\u4E0D\u8D34\u89C6\u53E3\u53F3\u7F18);\r\n             \u8DDD\u5E95\u8D85\u8FC7 scrollButtonThreshold \u663E\u793A(\u7A7A\u6001\u4E0D\u6E32\u67D3);\r\n             scroll-button \u63D2\u69FD\u6574\u4F53\u8986\u76D6\u6309\u94AE,scroll-button-icon \u63D2\u69FD\u4EC5\u8986\u76D6\u56FE\u6807\u5185\u5BB9 "),
+                    vue.createVNode(vue.Transition, { name: "fv-messages-back-fade" }, {
+                      default: vue.withCtx(() => [
+                        vue.renderSlot(_ctx.$slots, "scroll-button", {
+                          scrollToBottom,
+                          awayFromBottom: isAwayFromBottom.value
+                        }, () => [
+                          __props.showScrollButton && !isEmpty.value && isAwayFromBottom.value ? (vue.openBlock(), vue.createBlock(vue.unref(elementPlus.ElButton), {
+                            key: 0,
+                            class: "fv-messages-back",
+                            circle: "",
+                            "aria-label": "\u6EDA\u52A8\u5230\u5E95\u90E8",
+                            onClick: _cache[0] || (_cache[0] = ($event) => scrollToBottom())
+                          }, {
+                            default: vue.withCtx(() => [
+                              vue.createVNode(vue.unref(elementPlus.ElIcon), { class: "fv-messages-back-icon" }, {
+                                default: vue.withCtx(() => [
+                                  vue.renderSlot(_ctx.$slots, "scroll-button-icon", {}, () => [
+                                    vue.createVNode(vue.unref(ElementPlusIconsVue.Bottom))
+                                  ])
+                                ]),
+                                _: 3
+                                /* FORWARDED */
+                              })
+                            ]),
+                            _: 3
+                            /* FORWARDED */
+                          })) : vue.createCommentVNode("v-if", true)
+                        ])
+                      ]),
+                      _: 3
+                      /* FORWARDED */
+                    })
                   ])
                 ],
-                512
-                /* NEED_PATCH */
+                544
+                /* NEED_HYDRATION, NEED_PATCH */
               )
             ],
             2112
@@ -6845,9 +6985,18 @@ ${fileParts.join("\n")}` });
       title: { type: String, required: false, default: "" },
       showHeader: { type: Boolean, required: false, default: false },
       centerWelcome: { type: Boolean, required: false, default: true },
+      showScrollButton: { type: Boolean, required: false, default: true },
+      scrollButtonThreshold: { type: Number, required: false, default: 100 },
       showUserAvatar: { type: Boolean, required: false, default: true },
       showUserName: { type: Boolean, required: false, default: true },
+      showAssistantAvatar: { type: Boolean, required: false, default: true },
+      showAssistantName: { type: Boolean, required: false, default: true },
+      userAvatar: { type: String, required: false, default: "" },
+      assistantAvatar: { type: String, required: false, default: "" },
+      userName: { type: String, required: false, default: "" },
+      assistantName: { type: String, required: false, default: "" },
       placeholder: { type: String, required: false, default: "" },
+      toolStepLabel: { type: Function, required: false, default: void 0 },
       senderShadow: { type: Boolean, required: false, default: true },
       suggestions: { type: Array, required: false, default: () => [] },
       features: { type: Object, required: false, default: () => ({}) },
@@ -6891,6 +7040,7 @@ ${fileParts.join("\n")}` });
         adapter: resolveAdapter,
         models: () => isMultiple.value && selectedModels.value.length ? selectedModels.value : [""],
         initial: { messages: initialTable, currentId: initialId },
+        toolStepLabel: props.toolStepLabel,
         onToolEvent: (ev) => emit("tool-event", ev)
       });
       const { send, stop: stopChat, regenerate: regenerateChat, msgs, isLoading } = chat;
@@ -7110,8 +7260,16 @@ ${fileParts.join("\n")}` });
                 nodes: vue.unref(nodeTable),
                 name: __props.title,
                 suggestions: __props.suggestions,
+                "show-scroll-button": __props.showScrollButton,
+                "scroll-button-threshold": __props.scrollButtonThreshold,
                 "show-user-avatar": __props.showUserAvatar,
                 "show-user-name": __props.showUserName,
+                "show-assistant-avatar": __props.showAssistantAvatar,
+                "show-assistant-name": __props.showAssistantName,
+                "user-avatar": __props.userAvatar,
+                "assistant-avatar": __props.assistantAvatar,
+                "user-name": __props.userName,
+                "assistant-name": __props.assistantName,
                 onSelect: onSelectSuggestion,
                 onCopy,
                 onRegenerate,
@@ -7134,14 +7292,56 @@ ${fileParts.join("\n")}` });
                   ]),
                   key: "1"
                 } : void 0,
+                _ctx.$slots["user-avatar"] ? {
+                  name: "user-avatar",
+                  fn: vue.withCtx(() => [
+                    vue.renderSlot(_ctx.$slots, "user-avatar")
+                  ]),
+                  key: "2"
+                } : void 0,
+                _ctx.$slots["assistant-avatar"] ? {
+                  name: "assistant-avatar",
+                  fn: vue.withCtx(() => [
+                    vue.renderSlot(_ctx.$slots, "assistant-avatar")
+                  ]),
+                  key: "3"
+                } : void 0,
+                _ctx.$slots["user-name"] ? {
+                  name: "user-name",
+                  fn: vue.withCtx((scope) => [
+                    vue.renderSlot(_ctx.$slots, "user-name", vue.normalizeProps(vue.guardReactiveProps(scope)))
+                  ]),
+                  key: "4"
+                } : void 0,
+                _ctx.$slots["assistant-name"] ? {
+                  name: "assistant-name",
+                  fn: vue.withCtx((scope) => [
+                    vue.renderSlot(_ctx.$slots, "assistant-name", vue.normalizeProps(vue.guardReactiveProps(scope)))
+                  ]),
+                  key: "5"
+                } : void 0,
                 _ctx.$slots.empty ? {
                   name: "empty",
                   fn: vue.withCtx(() => [
                     vue.renderSlot(_ctx.$slots, "empty")
                   ]),
-                  key: "2"
+                  key: "6"
+                } : void 0,
+                _ctx.$slots["scroll-button"] ? {
+                  name: "scroll-button",
+                  fn: vue.withCtx((scope) => [
+                    vue.renderSlot(_ctx.$slots, "scroll-button", vue.normalizeProps(vue.guardReactiveProps(scope)))
+                  ]),
+                  key: "7"
+                } : void 0,
+                _ctx.$slots["scroll-button-icon"] ? {
+                  name: "scroll-button-icon",
+                  fn: vue.withCtx(() => [
+                    vue.renderSlot(_ctx.$slots, "scroll-button-icon")
+                  ]),
+                  key: "8"
                 } : void 0
-              ]), 1032, ["messages", "nodes", "name", "suggestions", "show-user-avatar", "show-user-name"]),
+              ]), 1032, ["messages", "nodes", "name", "suggestions", "show-scroll-button", "scroll-button-threshold", "show-user-avatar", "show-user-name", "show-assistant-avatar", "show-assistant-name", "user-avatar", "assistant-avatar", "user-name", "assistant-name"]),
               __props.features?.artifacts && artifacts.value.length ? (vue.openBlock(), vue.createBlock(_sfc_main$1, {
                 key: 0,
                 artifacts: artifacts.value,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fv-ui/ai-chat",
-  "version": "0.4.0",
+  "version": "0.7.0",
   "description": "基于 Vue3 + Element Plus 的 AI 对话组件库",
   "type": "module",
   "main": "lib/index.js",