@fv-ui/ai-chat 0.3.0 → 0.5.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,
@@ -6024,50 +6024,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 = {
+  const _hoisted_11 = {
     key: 3,
     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 = {
+  const _hoisted_14 = {
     key: 4,
     class: "fv-msg-content fv-msg-content-user"
   };
-  const _hoisted_14 = {
+  const _hoisted_15 = {
     key: 5,
     class: "fv-msg-actions"
   };
-  const _hoisted_15 = {
+  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 +6079,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"],
@@ -6108,50 +6115,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 +6199,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 */
@@ -6205,17 +6232,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,15 +6265,15 @@ ${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:\u590D\u5236/\u91CD\u751F\u6210 + \u5206\u652F\u5207\u6362 "),
-            __props.showActions && !isUser.value || __props.showBranchSwitch && __props.branch && __props.branch.count > 1 ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14, [
+            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_15, [
               vue.renderSlot(_ctx.$slots, "message-actions", { message: __props.message }, () => [
-                __props.showActions && !isUser.value ? (vue.openBlock(), vue.createBlock(vue.unref(elementPlus.ElTooltip), {
+                __props.showActions && isUser.value ? (vue.openBlock(), vue.createBlock(vue.unref(elementPlus.ElTooltip), {
                   key: 0,
                   content: "\u590D\u5236",
                   placement: "top"
@@ -6277,6 +6304,35 @@ ${fileParts.join("\n")}` });
                 })) : vue.createCommentVNode("v-if", true),
                 __props.showActions && !isUser.value ? (vue.openBlock(), vue.createBlock(vue.unref(elementPlus.ElTooltip), {
                   key: 1,
+                  content: "\u590D\u5236",
+                  placement: "top"
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.createVNode(vue.unref(elementPlus.ElButton), {
+                      text: "",
+                      size: "small",
+                      class: "fv-msg-action",
+                      "aria-label": "\u590D\u5236",
+                      onClick: onCopy
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createVNode(vue.unref(elementPlus.ElIcon), null, {
+                          default: vue.withCtx(() => [
+                            vue.createVNode(vue.unref(ElementPlusIconsVue.DocumentCopy))
+                          ]),
+                          _: 1
+                          /* STABLE */
+                        })
+                      ]),
+                      _: 1
+                      /* STABLE */
+                    })
+                  ]),
+                  _: 1
+                  /* STABLE */
+                })) : vue.createCommentVNode("v-if", true),
+                __props.showActions && !isUser.value ? (vue.openBlock(), vue.createBlock(vue.unref(elementPlus.ElTooltip), {
+                  key: 2,
                   content: "\u91CD\u65B0\u751F\u6210",
                   placement: "top"
                 }, {
@@ -6306,7 +6362,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",
@@ -6329,7 +6385,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 */
@@ -6383,7 +6439,13 @@ ${fileParts.join("\n")}` });
       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 }) {
@@ -6414,6 +6476,12 @@ ${fileParts.join("\n")}` });
       vue.watch(() => props.messages.length, (nv, ov) => {
         if (nv > (ov ?? 0)) scrollToBottomIfNear();
       });
+      vue.watch(
+        () => props.messages.filter((m) => m.role === "user").length,
+        (nv, ov) => {
+          if (nv > (ov ?? 0)) vue.nextTick(() => scrollToBottom());
+        }
+      );
       vue.watch(
         () => props.messages.reduce((sum, m) => sum + m.content.length + (m.reasoning?.length ?? 0), 0),
         () => scrollToBottomIfNear()
@@ -6496,6 +6564,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
@@ -6516,8 +6590,36 @@ ${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 */
@@ -6812,6 +6914,12 @@ ${fileParts.join("\n")}` });
       centerWelcome: { 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: "" },
       placeholder: { type: String, required: false, default: "" },
       senderShadow: { type: Boolean, required: false, default: true },
       suggestions: { type: Array, required: false, default: () => [] },
@@ -7077,6 +7185,12 @@ ${fileParts.join("\n")}` });
                 suggestions: __props.suggestions,
                 "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,
@@ -7099,14 +7213,42 @@ ${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
-              ]), 1032, ["messages", "nodes", "name", "suggestions", "show-user-avatar", "show-user-name"]),
+              ]), 1032, ["messages", "nodes", "name", "suggestions", "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.3.0",
+  "version": "0.5.0",
   "description": "基于 Vue3 + Element Plus 的 AI 对话组件库",
   "type": "module",
   "main": "lib/index.js",