@zero-library/chat-agent 2.3.6 → 2.3.7

package/dist/index.cjs.js

@@ -1308,9 +1308,7 @@ var MessageRender_default = ({ message: message2, placement, onFilePreview, cust
       onFilePreview?.(file);
     }
   };
-  const mergedCustomComponents = react.useMemo(() => {
-    return { ...customComponents, ...propsCustomComponents };
-  }, [propsCustomComponents]);
+  const mergedCustomComponents = { ...customComponents, ...propsCustomComponents };
   return /* @__PURE__ */ jsxRuntime.jsx(antd.Flex, { vertical: true, children: !(msgContent || message2.msgFiles.length) ? /* @__PURE__ */ jsxRuntime.jsx(antd.Typography, { children: /* @__PURE__ */ jsxRuntime.jsx(antd.Spin, { size: "small" }) }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     msgContent && /* @__PURE__ */ jsxRuntime.jsx(
       x.Bubble,
@@ -1777,6 +1775,7 @@ var ConversationFavoritesList_default = () => {
                   e.stopPropagation();
                   chatStore.collectConversation(item.id, false);
                 },
+                onCancel: (e) => e.stopPropagation(),
                 children: /* @__PURE__ */ jsxRuntime.jsx(
                   antd.Button,
                   {
@@ -2174,7 +2173,7 @@ init_Context();
 // src/ui/common/FeaturesRenderer.tsx
 init_Context();
 
-// src/ui/common/QuickAsk/QuickAskPanel.tsx
+// src/ui/common/QuickAsk/QuickAskPanelDrawer.tsx
 init_Context();
 
 // src/ui/common/QuickAsk/QuickAskEditModal.tsx
@@ -2277,7 +2276,8 @@ var styles_module_default4 = {
   quickAskItemHeaderActions: "styles_module_quickAskItemHeaderActions",
   quickAskItemBody: "styles_module_quickAskItemBody"
 };
-var QuickAskPanel_default = () => {
+var ALL = "all";
+var QuickAskPanelDrawer_default = ({ open, onClose }) => {
   const { message: message2 } = antd.App.useApp();
   const chatStore = useChatStore();
   const configState = valtio.useSnapshot(chatStore.config);
@@ -2298,6 +2298,19 @@ var QuickAskPanel_default = () => {
     } catch (err) {
     }
   };
+  const tabsItems = react.useMemo(
+    () => [
+      {
+        key: ALL,
+        label: "\u5168\u90E8"
+      },
+      ...categories.map((item) => ({
+        key: item.id,
+        label: item.labelName
+      }))
+    ],
+    [categories]
+  );
   const [loading, setLoading] = react.useState(false);
   const fetchItems = common.useDebounce(async () => {
     try {
@@ -2353,153 +2366,158 @@ var QuickAskPanel_default = () => {
     } catch (err) {
     }
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs(antd.Flex, { vertical: true, className: styles_module_default4.quickAskPanel, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(antd.Flex, { justify: "space-between", align: "center", children: /* @__PURE__ */ jsxRuntime.jsx(antd.Typography.Title, { level: 5, children: "\u5FEB\u901F\u63D0\u95EE" }) }),
-    /* @__PURE__ */ jsxRuntime.jsxs(antd.Flex, { gap: 8, className: "m-b-16 m-t-16", children: [
-      !searchExpanded && /* @__PURE__ */ jsxRuntime.jsx(
-        antd.Button,
-        {
-          type: "dashed",
-          block: true,
-          icon: /* @__PURE__ */ jsxRuntime.jsx(icons.PlusOutlined, {}),
-          className: "flex-1",
-          onClick: () => {
-            setEditingItem(null);
-            setEditModalOpen(true);
-          },
-          children: "\u65B0\u589E\u5FEB\u901F\u63D0\u95EE"
-        }
-      ),
-      searchExpanded ? /* @__PURE__ */ jsxRuntime.jsx(
-        antd.Input,
-        {
-          autoFocus: true,
-          placeholder: "\u8F93\u5165\u95EE\u9898\u540D\u79F0\u6216\u5185\u5BB9\u68C0\u7D22",
-          prefix: /* @__PURE__ */ jsxRuntime.jsx(icons.SearchOutlined, {}),
-          value: searchText,
-          onChange: (e) => {
-            setSearchText(e.target.value);
-            fetchItems();
-          },
-          className: "flex-1",
-          allowClear: true,
-          onBlur: () => setSearchExpanded(false)
-        }
-      ) : /* @__PURE__ */ jsxRuntime.jsx(antd.Button, { icon: /* @__PURE__ */ jsxRuntime.jsx(icons.SearchOutlined, {}), onClick: () => setSearchExpanded(true) })
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs(antd.Flex, { align: "center", className: classNames11__default.default("scroll-fade-in", "m-b-16", styles_module_default4.tagContainer), children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        antd.Tag,
-        {
-          color: !activeTab.id ? "processing" : "default",
-          className: "cursor-pointer",
-          bordered: false,
-          onClick: () => {
-            setActiveTab({});
-            fetchItems();
-          },
-          children: "\u5168\u90E8"
-        }
-      ),
-      categories.map((c) => /* @__PURE__ */ jsxRuntime.jsx(
-        antd.Tag,
-        {
-          color: activeTab.id === c.id ? "processing" : "default",
-          className: "cursor-pointer",
-          bordered: false,
-          onClick: () => {
-            setActiveTab(c);
-            fetchItems();
-          },
-          children: c.labelName
-        },
-        c.id
-      ))
-    ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(antd.Flex, { vertical: true, className: "flex-1", children: /* @__PURE__ */ jsxRuntime.jsx(antd.Spin, { spinning: loading, wrapperClassName: "full-spin", tip: "\u52A0\u8F7D\u4E2D...", children: /* @__PURE__ */ jsxRuntime.jsx(antd.Flex, { vertical: true, gap: 8, className: "height-full scroll-fade-in", children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      antd.Drawer,
       {
-        className: styles_module_default4.quickAskItem,
-        onClick: () => {
-          chatStore.setContent(item.content);
-          chatStore.setContentParams({
-            use_template: 1
-          });
-        },
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(antd.Flex, { gap: 8, justify: "space-between", align: "center", className: styles_module_default4.quickAskItemHeader, children: [
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: classNames11__default.default("flex-1 text-ellipsis", styles_module_default4.quickAskItemTitle), children: item.title }),
-            /* @__PURE__ */ jsxRuntime.jsxs(antd.Space, { size: 4, className: styles_module_default4.quickAskItemHeaderActions, children: [
-              /* @__PURE__ */ jsxRuntime.jsx(
-                antd.Button,
-                {
-                  type: "primary",
-                  size: "small",
-                  icon: /* @__PURE__ */ jsxRuntime.jsx(icons.PushpinOutlined, { rotate: item.isTop ? -45 : 0 }),
-                  title: item.isTop ? "\u53D6\u6D88\u7F6E\u9876" : "\u7F6E\u9876",
-                  onClick: (e) => {
-                    e.stopPropagation();
-                    handleTop(item);
-                  }
-                },
-                "top"
-              ),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                antd.Button,
-                {
-                  type: "primary",
-                  size: "small",
-                  icon: /* @__PURE__ */ jsxRuntime.jsx(icons.CopyOutlined, {}),
-                  title: "\u590D\u5236",
-                  onClick: (e) => {
-                    e.stopPropagation();
-                    setEditingItem({
-                      title: item.title,
-                      labelName: item.labelName,
-                      content: item.content
-                    });
-                    setEditModalOpen(true);
-                  }
-                },
-                "copy"
-              ),
-              /* @__PURE__ */ jsxRuntime.jsx(
+        className: classNames11__default.default("no-padding-drawer"),
+        width: 360,
+        open,
+        title: "\u5FEB\u901F\u63D0\u95EE",
+        closable: { placement: "end" },
+        onClose,
+        placement: "right",
+        mask: false,
+        children: /* @__PURE__ */ jsxRuntime.jsxs(antd.Flex, { vertical: true, className: styles_module_default4.quickAskPanel, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(antd.Flex, { gap: 12, className: "p-16", vertical: true, children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(antd.Flex, { gap: 8, children: [
+              !searchExpanded && /* @__PURE__ */ jsxRuntime.jsx(
                 antd.Button,
                 {
-                  type: "primary",
-                  size: "small",
-                  icon: /* @__PURE__ */ jsxRuntime.jsx(icons.EditOutlined, {}),
-                  title: "\u7F16\u8F91",
-                  onClick: (e) => {
-                    e.stopPropagation();
-                    setEditingItem(item);
+                  type: "dashed",
+                  block: true,
+                  icon: /* @__PURE__ */ jsxRuntime.jsx(icons.PlusOutlined, {}),
+                  className: "flex-1",
+                  onClick: () => {
+                    setEditingItem(null);
                     setEditModalOpen(true);
-                  }
-                },
-                "edit"
+                  },
+                  children: "\u65B0\u589E\u5FEB\u901F\u63D0\u95EE"
+                }
               ),
-              item.canDelete && /* @__PURE__ */ jsxRuntime.jsx(
-                antd.Popconfirm,
+              searchExpanded ? /* @__PURE__ */ jsxRuntime.jsx(
+                antd.Input,
                 {
-                  title: "\u63D0\u793A",
-                  okText: "\u786E\u5B9A",
-                  cancelText: "\u53D6\u6D88",
-                  description: "\u786E\u8BA4\u5220\u9664\u95EE\u9898\u5417?",
-                  onConfirm: (e) => {
-                    e.stopPropagation();
-                    handleDelete(item.id);
+                  autoFocus: true,
+                  placeholder: "\u8F93\u5165\u95EE\u9898\u540D\u79F0\u6216\u5185\u5BB9\u68C0\u7D22",
+                  prefix: /* @__PURE__ */ jsxRuntime.jsx(icons.SearchOutlined, {}),
+                  value: searchText,
+                  onChange: (e) => {
+                    setSearchText(e.target.value);
+                    fetchItems();
                   },
-                  children: /* @__PURE__ */ jsxRuntime.jsx(antd.Button, { type: "primary", size: "small", icon: /* @__PURE__ */ jsxRuntime.jsx(icons.DeleteOutlined, {}), title: "\u5220\u9664", onClick: (e) => e.stopPropagation() })
+                  className: "flex-1",
+                  allowClear: true,
+                  onBlur: () => setSearchExpanded(false)
+                }
+              ) : /* @__PURE__ */ jsxRuntime.jsx(antd.Button, { icon: /* @__PURE__ */ jsxRuntime.jsx(icons.SearchOutlined, {}), onClick: () => setSearchExpanded(true) })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              antd.Tabs,
+              {
+                className: styles_module_default4.tagContainer,
+                activeKey: activeTab.id ? activeTab.id : ALL,
+                onChange: (key) => {
+                  setActiveTab(key === ALL ? {} : categories.find((c) => c.id === key));
+                  fetchItems();
                 },
-                "delete"
-              )
-            ] })
+                tabPosition: "top",
+                items: tabsItems,
+                size: "small"
+              }
+            )
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: classNames11__default.default(styles_module_default4.quickAskItemBody), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-ellipsis-3", children: item.content }) })
-        ]
-      },
-      item.id
-    )) }) }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(antd.Flex, { vertical: true, className: "flex-1", children: /* @__PURE__ */ jsxRuntime.jsx(antd.Spin, { spinning: loading, wrapperClassName: "full-spin", tip: "\u52A0\u8F7D\u4E2D...", children: /* @__PURE__ */ jsxRuntime.jsx(antd.Flex, { vertical: true, gap: 8, className: "height-full scroll-fade-in p-16 p-t-8", children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              className: styles_module_default4.quickAskItem,
+              onClick: () => {
+                chatStore.setContent(item.content);
+                chatStore.setContentParams({
+                  use_template: 1
+                });
+                onClose();
+              },
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsxs(antd.Flex, { gap: 8, justify: "space-between", align: "center", className: styles_module_default4.quickAskItemHeader, children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: classNames11__default.default("flex-1 text-ellipsis", styles_module_default4.quickAskItemTitle), children: item.title }),
+                  /* @__PURE__ */ jsxRuntime.jsxs(antd.Space, { size: 4, className: styles_module_default4.quickAskItemHeaderActions, children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      antd.Button,
+                      {
+                        type: "primary",
+                        size: "small",
+                        icon: /* @__PURE__ */ jsxRuntime.jsx(icons.PushpinOutlined, { rotate: item.isTop ? -45 : 0 }),
+                        title: item.isTop ? "\u53D6\u6D88\u7F6E\u9876" : "\u7F6E\u9876",
+                        onClick: (e) => {
+                          e.stopPropagation();
+                          handleTop(item);
+                        }
+                      },
+                      "top"
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      antd.Button,
+                      {
+                        type: "primary",
+                        size: "small",
+                        icon: /* @__PURE__ */ jsxRuntime.jsx(icons.CopyOutlined, {}),
+                        title: "\u590D\u5236",
+                        onClick: (e) => {
+                          e.stopPropagation();
+                          setEditingItem({
+                            title: item.title,
+                            labelName: item.labelName,
+                            content: item.content
+                          });
+                          setEditModalOpen(true);
+                        }
+                      },
+                      "copy"
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      antd.Button,
+                      {
+                        type: "primary",
+                        size: "small",
+                        icon: /* @__PURE__ */ jsxRuntime.jsx(icons.EditOutlined, {}),
+                        title: "\u7F16\u8F91",
+                        onClick: (e) => {
+                          e.stopPropagation();
+                          setEditingItem(item);
+                          setEditModalOpen(true);
+                        }
+                      },
+                      "edit"
+                    ),
+                    item.canDelete && /* @__PURE__ */ jsxRuntime.jsx(
+                      antd.Popconfirm,
+                      {
+                        title: "\u63D0\u793A",
+                        okText: "\u786E\u5B9A",
+                        cancelText: "\u53D6\u6D88",
+                        description: "\u786E\u8BA4\u5220\u9664\u95EE\u9898\u5417?",
+                        onConfirm: (e) => {
+                          e.stopPropagation();
+                          handleDelete(item.id);
+                        },
+                        onCancel: (e) => {
+                          e.stopPropagation();
+                        },
+                        children: /* @__PURE__ */ jsxRuntime.jsx(antd.Button, { type: "primary", size: "small", icon: /* @__PURE__ */ jsxRuntime.jsx(icons.DeleteOutlined, {}), title: "\u5220\u9664", onClick: (e) => e.stopPropagation() })
+                      },
+                      "delete"
+                    )
+                  ] })
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: classNames11__default.default(styles_module_default4.quickAskItemBody), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-ellipsis-3", children: item.content }) })
+              ]
+            },
+            item.id
+          )) }) }) })
+        ] })
+      }
+    ),
     editModalOpen && /* @__PURE__ */ jsxRuntime.jsx(
       QuickAskEditModal_default,
       {
@@ -2517,6 +2535,7 @@ var FeaturesRenderer_default = () => {
   const chatStore = useChatStore();
   const receiverState = valtio.useSnapshot(chatStore.receiver);
   const conversationState = valtio.useSnapshot(chatStore.conversation);
+  const [quickAskOpen, setQuickAskOpen] = react.useState(false);
   const chatMessage = react.useMemo(
     () => conversationState.messages[conversationState.active.id] || {},
     [conversationState.messages[conversationState.active.id]]
@@ -2547,23 +2566,10 @@ var FeaturesRenderer_default = () => {
         children: "\u5411\u4E13\u5BB6\u54A8\u8BE2"
       }
     ),
-    receiverState.active.feature?.quickAsk && /* @__PURE__ */ jsxRuntime.jsx(
-      antd.Popover,
-      {
-        trigger: "click",
-        placement: "topLeft",
-        content: /* @__PURE__ */ jsxRuntime.jsx(QuickAskPanel_default, {}),
-        children: /* @__PURE__ */ jsxRuntime.jsx(
-          antd.Button,
-          {
-            size: "small",
-            color: "primary",
-            variant: "filled",
-            children: "\u5FEB\u901F\u63D0\u95EE"
-          }
-        )
-      }
-    )
+    receiverState.active.feature?.quickAsk && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(antd.Button, { size: "small", color: "primary", variant: "filled", onClick: () => setQuickAskOpen(true), children: "\u5FEB\u901F\u63D0\u95EE" }),
+      quickAskOpen && /* @__PURE__ */ jsxRuntime.jsx(QuickAskPanelDrawer_default, { open: quickAskOpen, onClose: () => setQuickAskOpen(false) })
+    ] })
   ] });
 };
 var ChatSender_default2 = react.forwardRef(