@zero-library/chat-copilot 3.1.4 → 3.1.6

package/dist/index.cjs.js

@@ -158,7 +158,10 @@ var Attachments_default = React10.forwardRef(({ fileUpload, fileUploadConfig, fi
       const uploadedFile = data[0];
       let previewUrl = uploadedFile.id;
       if (uploadedFile.conversationId && uploadedFile.path) {
-        previewUrl = chatStore.config.services.request.getPreviewUrl(uploadedFile.conversationId, uploadedFile.path);
+        previewUrl = chatStore.config.services.request.getPreviewUrl({
+          path: uploadedFile.path,
+          workspaceId: uploadedFile.conversationId
+        });
       }
       setAttachedFiles(
         getAttachedFiles().map((f) => {
@@ -246,20 +249,34 @@ var Attachments_default = React10.forwardRef(({ fileUpload, fileUploadConfig, fi
 
 // src/components/ChatInput/index.module.less
 var index_module_default = {
+  promptEditorInputContainer: "index_module_promptEditorInputContainer",
+  promptEditorContent: "index_module_promptEditorContent",
+  promptEditorPlaceholder: "index_module_promptEditorPlaceholder",
+  resourceSelect: "index_module_resourceSelect",
   fileMenu: "index_module_fileMenu",
+  fileMenuGroup: "index_module_fileMenuGroup",
+  fileMenuGroupTitle: "index_module_fileMenuGroupTitle",
+  fileMenuEmpty: "index_module_fileMenuEmpty",
   fileMenuItem: "index_module_fileMenuItem",
   fileMenuItemActive: "index_module_fileMenuItemActive",
+  fileIcon: "index_module_fileIcon",
   fileName: "index_module_fileName",
-  resourceSelect: "index_module_resourceSelect",
-  promptEditorInputContainer: "index_module_promptEditorInputContainer",
-  promptEditorContent: "index_module_promptEditorContent",
-  promptEditorPlaceholder: "index_module_promptEditorPlaceholder",
   resourceTag: "index_module_resourceTag"
 };
 
 // src/core/constants.ts
 var CONV_MODE = {
   PROD: 1};
+var TOKEN_KEY = "NS-TOKEN";
+var tokenManager = common.createTokenManager({
+  key: TOKEN_KEY
+});
+var redirectUrl = () => {
+  const path = localStorage.getItem("SIGNPATH");
+  common.emit("jumpLink", { url: `/uc${path || "/sign-in"}` });
+};
+
+// src/core/utils.ts
 var classifyTime = (timestamp) => {
   const now = dayjs__default.default();
   const target = dayjs__default.default(timestamp);
@@ -306,27 +323,52 @@ var getFileIcon = (extension, fontSize = 24) => {
   }
   return createIcon(icons.FileUnknownOutlined, "#94a3b8");
 };
-function FilePickerMenu({
-  options,
+var getFileUrl = (params, baseUrl, url) => {
+  const data = {
+    [TOKEN_KEY]: tokenManager.get(),
+    workspaceType: "conversation" /* CONVERSATION */,
+    ...params
+  };
+  return common.buildUrlParams(data, url || `${baseUrl}/files/access`);
+};
+function GroupPicker({
+  groups,
   selectedIndex,
   onSelect,
   onHover
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: index_module_default.fileMenu, role: "listbox", children: options.map((option, index) => /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      role: "option",
-      "aria-selected": index === selectedIndex,
-      className: `${index_module_default.fileMenuItem} ${index === selectedIndex ? index_module_default.fileMenuItemActive : ""}`,
-      onMouseEnter: () => onHover(index),
-      onClick: () => onSelect(option),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", { children: getFileIcon(option.ext || common.getFileSuffixName(option.label), 14) }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: index_module_default.fileName, children: option.label })
-      ]
-    },
-    option.value
-  )) });
+  const itemRefs = React10.useRef([]);
+  let currentIndex = -1;
+  React10.useEffect(() => {
+    itemRefs.current[selectedIndex]?.scrollIntoView({
+      block: "nearest"
+    });
+  }, [groups, selectedIndex]);
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: index_module_default.fileMenu, role: "listbox", children: groups.map(({ group, options }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: index_module_default.fileMenuGroup, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: index_module_default.fileMenuGroupTitle, children: group.label }),
+    options.length ? options.map((option) => {
+      currentIndex += 1;
+      const optionIndex = currentIndex;
+      return /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          ref: (element) => {
+            itemRefs.current[optionIndex] = element;
+          },
+          role: "option",
+          "aria-selected": optionIndex === selectedIndex,
+          className: `${index_module_default.fileMenuItem} ${optionIndex === selectedIndex ? index_module_default.fileMenuItemActive : ""}`,
+          onMouseEnter: () => onHover(optionIndex),
+          onClick: () => onSelect(group, option),
+          children: [
+            option.ext && /* @__PURE__ */ jsxRuntime.jsx("span", { className: index_module_default.fileIcon, children: getFileIcon(option.ext, 14) }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: index_module_default.fileName, children: option.label })
+          ]
+        },
+        `${group.value}-${option.value}`
+      );
+    }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: index_module_default.fileMenuEmpty, children: "\u6682\u65E0\u6570\u636E" })
+  ] }, group.value)) });
 }
 function ResourcePickerMenu({
   anchorElementRef,
@@ -375,7 +417,6 @@ function ResourceTag({ resource }) {
     formatResourceName(resource.resourceName)
   ] }) });
 }
-var EMPTY_CASCADE_OPTION_VALUE = "__empty__";
 var VariableNode = class _VariableNode extends lexical.DecoratorNode {
   __resourceLabel;
   __resourceType;
@@ -466,34 +507,25 @@ var VariableNode = class _VariableNode extends lexical.DecoratorNode {
 function $createVariableNode(resourceLabel, resourceName, resourceType, resourceId) {
   return new VariableNode(resourceLabel, resourceName, resourceType, resourceId);
 }
-var CascadeOption = class extends LexicalTypeaheadMenuPlugin.MenuOption {
-  category;
+var ResourceOption = class extends LexicalTypeaheadMenuPlugin.MenuOption {
+  group;
   item;
   /**
-   * 将级联菜单中的父子节点包装成 Lexical 菜单选项对象。
+   * 将分组列表中的资源节点包装成 Lexical 菜单选项对象。
    */
-  constructor(category, item) {
-    super(`${category.value}:${item.value}`);
-    this.category = category;
+  constructor(group, item) {
+    super(`${group.value}:${item.value}`);
+    this.group = group;
     this.item = item;
   }
 };
-var FileOption = class extends LexicalTypeaheadMenuPlugin.MenuOption {
-  file;
-  /**
-   * 将文件列表项包装成 Lexical 菜单选项对象。
-   */
-  constructor(file) {
-    super(file.value);
-    this.file = file;
-  }
-};
 function VariablePickerPlugin({ commandConfig = {} }) {
   const [editor] = LexicalComposerContext.useLexicalComposerContext();
   const chatStore = useChatStore();
   const [commandDataSource, setCommandDataSource] = React10.useState(commandConfig);
   const [queryString, setQueryString] = React10.useState(null);
   const [isEditorFocused, setIsEditorFocused] = React10.useState(false);
+  const [menuResetKey, setMenuResetKey] = React10.useState(0);
   const blurTimerRef = React10.useRef(null);
   React10.useEffect(() => {
     const unregister = utils.mergeRegister(
@@ -510,6 +542,7 @@ function VariablePickerPlugin({ commandConfig = {} }) {
         lexical.BLUR_COMMAND,
         () => {
           setIsEditorFocused(false);
+          setMenuResetKey((current) => current + 1);
           return false;
         },
         lexical.COMMAND_PRIORITY_LOW
@@ -524,6 +557,7 @@ function VariablePickerPlugin({ commandConfig = {} }) {
     setCommandDataSource(commandConfig);
   }, [commandConfig]);
   const commandKey = queryString?.[0] || "";
+  const searchKeyword = queryString?.slice(commandKey.length).trim().toLocaleLowerCase() || "";
   const categoryConfig = React10.useMemo(
     () => ({
       skill: {
@@ -541,58 +575,82 @@ function VariablePickerPlugin({ commandConfig = {} }) {
     }),
     [chatStore]
   );
-  const commandOptions = React10.useMemo(() => {
-    if (!isEditorFocused) return [];
-    return (commandDataSource[commandKey]?.dataSource || []).flatMap(
-      (category) => category.children?.filter((item) => !item.disabled).map((item) => new CascadeOption(category, item)) || []
-    );
-  }, [commandDataSource, commandKey, isEditorFocused]);
   const formatDataSource = React10.useCallback(
     (items, category) => {
       const currentCategoryConfig = categoryConfig[category.value];
-      if (!items.length) {
-        return [
-          {
-            value: EMPTY_CASCADE_OPTION_VALUE,
-            label: "\u6682\u65E0\u6570\u636E",
-            isLeaf: true,
-            disabled: true
-          }
-        ];
-      }
+      if (!items.length) return [];
       return items.map((item) => ({
         value: item.id,
-        label: currentCategoryConfig?.getLabel(item) || item.name
+        label: currentCategoryConfig?.getLabel(item) || item.name,
+        children: []
       }));
     },
     [categoryConfig]
   );
-  const loadData = React10.useCallback(
-    (selectedOptions) => {
-      const category = selectedOptions[selectedOptions.length - 1];
-      if (!category || category.children?.length || category.isLeaf) return;
-      const currentCategoryConfig = categoryConfig[category.value];
-      if (!currentCategoryConfig) return;
-      currentCategoryConfig.load().then((response) => {
-        const items = response.data || [];
-        setCommandDataSource((current) => ({
-          ...current,
-          [commandKey]: {
-            ...current[commandKey],
-            dataSource: current[commandKey]?.dataSource?.map(
-              (item) => item.value === category.value ? { ...item, children: formatDataSource(items, category) } : item
-            ) || []
-          }
-        }));
-      });
-    },
-    [categoryConfig, commandKey, formatDataSource]
+  React10.useEffect(() => {
+    let isUnmounted = false;
+    const initializeCommandDataSource = async () => {
+      const nextEntries = await Promise.all(
+        Object.entries(commandConfig).map(async ([trigger, currentCommandConfig]) => {
+          const nextDataSource = await Promise.all(
+            (currentCommandConfig.dataSource || []).map(async (category) => {
+              const normalizedChildren = category.children || [];
+              const nextCategory = {
+                ...category,
+                children: normalizedChildren
+              };
+              const currentCategoryConfig = categoryConfig[category.value];
+              if (!currentCategoryConfig) {
+                return nextCategory;
+              }
+              if (normalizedChildren.length) {
+                return nextCategory;
+              }
+              const response = await currentCategoryConfig.load();
+              const items = response.data || [];
+              return {
+                ...nextCategory,
+                children: formatDataSource(items, category)
+              };
+            })
+          );
+          return [
+            trigger,
+            {
+              ...currentCommandConfig,
+              dataSource: nextDataSource
+            }
+          ];
+        })
+      );
+      if (isUnmounted) return;
+      setCommandDataSource(Object.fromEntries(nextEntries));
+    };
+    initializeCommandDataSource();
+    return () => {
+      isUnmounted = true;
+    };
+  }, [categoryConfig, commandConfig, formatDataSource]);
+  const commandGroups = React10.useMemo(() => {
+    if (!isEditorFocused) return [];
+    return (commandDataSource[commandKey]?.dataSource || []).map((group) => {
+      const options = group.children || [];
+      if (!searchKeyword) return { group, options };
+      return {
+        group,
+        options: options.filter((option) => option.label.toLocaleLowerCase().includes(searchKeyword))
+      };
+    }).filter(({ options }) => !searchKeyword || options.length);
+  }, [commandDataSource, commandKey, isEditorFocused, searchKeyword]);
+  const commandOptions = React10.useMemo(
+    () => commandGroups.flatMap(({ group, options }) => options.map((item) => new ResourceOption(group, item))),
+    [commandGroups]
   );
   const onSelectOption = React10.useCallback(
     (selectedOption, nodeToReplace, closeMenu, matchingString) => {
-      const resource = selectedOption instanceof FileOption ? selectedOption.file : selectedOption.item;
-      const resourceLabel = selectedOption instanceof FileOption ? "\u6587\u4EF6" : selectedOption.category.label;
-      const resourceType = selectedOption instanceof FileOption ? "file" : selectedOption.category.value;
+      const resource = selectedOption.item;
+      const resourceLabel = selectedOption.group.label;
+      const resourceType = selectedOption.group.value;
       editor.update(() => {
         const variableNode = $createVariableNode(resourceLabel, resource.label, resourceType, resource.value);
         if (nodeToReplace) {
@@ -602,7 +660,7 @@ function VariablePickerPlugin({ commandConfig = {} }) {
       });
       closeMenu();
     },
-    [commandDataSource, editor]
+    [editor]
   );
   return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(
     LexicalTypeaheadMenuPlugin.LexicalTypeaheadMenuPlugin,
@@ -616,40 +674,24 @@ function VariablePickerPlugin({ commandConfig = {} }) {
         if (!match) return null;
         return { leadOffset: match.index, matchingString: match[0], replaceableString: match[0] };
       },
-      options: commandOptions.map((option) => new CascadeOption(option.category, option.item)),
-      menuRenderFn: (anchorElementRef, { selectedIndex, setHighlightedIndex, selectOptionAndCleanUp }, matchingString) => {
-        if (!isEditorFocused || !anchorElementRef.current) return null;
+      options: commandOptions,
+      menuRenderFn: (anchorElementRef, { selectedIndex, setHighlightedIndex, selectOptionAndCleanUp }) => {
+        if (!isEditorFocused || !anchorElementRef.current || searchKeyword && !commandGroups.length) return null;
         return ReactDOM__namespace.createPortal(
-          /* @__PURE__ */ jsxRuntime.jsxs(ResourcePickerMenu, { anchorElementRef, children: [
-            commandDataSource[matchingString]?.component === "cascade" && /* @__PURE__ */ jsxRuntime.jsx(
-              antd.Cascader.Panel,
-              {
-                options: commandDataSource[matchingString]?.dataSource,
-                expandTrigger: "hover",
-                loadData,
-                onChange: (value) => {
-                  const [categoryValue, itemValue] = value;
-                  const option = commandOptions.find(
-                    (currentOption) => currentOption.category.value === categoryValue && currentOption.item.value === itemValue
-                  );
-                  if (option) selectOptionAndCleanUp(option);
-                }
-              }
-            ),
-            commandDataSource[matchingString]?.component === "list" && /* @__PURE__ */ jsxRuntime.jsx(
-              FilePickerMenu,
-              {
-                options: commandDataSource[matchingString]?.dataSource || [],
-                selectedIndex: selectedIndex ?? 0,
-                onHover: setHighlightedIndex,
-                onSelect: (option) => selectOptionAndCleanUp(new FileOption(option))
-              }
-            )
-          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(ResourcePickerMenu, { anchorElementRef, children: /* @__PURE__ */ jsxRuntime.jsx(
+            GroupPicker,
+            {
+              groups: commandGroups,
+              selectedIndex: selectedIndex ?? 0,
+              onHover: setHighlightedIndex,
+              onSelect: (group, option) => selectOptionAndCleanUp(new ResourceOption(group, option))
+            }
+          ) }),
           anchorElementRef.current
         );
       }
-    }
+    },
+    menuResetKey
   ) });
 }
 function InitialStatePlugin({ value }) {
@@ -872,14 +914,6 @@ var ChatSender_default = React10.forwardRef(
     );
   }
 );
-var TOKEN_KEY = "NS-TOKEN";
-var tokenManager = common.createTokenManager({
-  key: TOKEN_KEY
-});
-var redirectUrl = () => {
-  const path = localStorage.getItem("SIGNPATH");
-  common.emit("jumpLink", { url: `/uc${path || "/sign-in"}` });
-};
 var createChatService = (request, config) => {
   const fetchModelList = () => {
     return request.get(`/providers/models/type/llm`);
@@ -920,14 +954,8 @@ var createChatService = (request, config) => {
       signal
     });
   };
-  const getPreviewUrl = (conversationId, path) => {
-    const params = {
-      path,
-      [TOKEN_KEY]: tokenManager.get(),
-      workspaceId: conversationId,
-      workspaceType: "conversation" /* CONVERSATION */
-    };
-    return common.buildUrlParams(params, `${config?.baseURL}/files/access`);
+  const getPreviewUrl = (params) => {
+    return getFileUrl(params, config?.baseURL);
   };
   const docQuery = (params) => {
     return request.get(`/library/cloud/document?${params}`);
@@ -2736,7 +2764,10 @@ var PreviewLink_default = ({ data, loading, message: message2, ...rest }) => {
     const fileName = getLinkFileName(href);
     const suffix = common.getFileSuffixName(fileName);
     chatStore.setPreview({
-      fileUrl: chatStore.config.services.request.getPreviewUrl(message2.conversationId, href),
+      fileUrl: chatStore.config.services.request.getPreviewUrl({
+        path: href,
+        workspaceId: message2.conversationId
+      }),
       fileName,
       suffix
     });
@@ -4299,11 +4330,13 @@ function A2uiRenderer(props) {
 var FilesNode = React10__namespace.default.memo(({ item }) => {
   const chatStore = useChatStore();
   const configState = valtio.useSnapshot(chatStore.config);
-  valtio.useSnapshot(chatStore.agent);
   const conversationState = valtio.useSnapshot(chatStore.conversation);
   const fileItems = React10.useMemo(() => {
     return (item.files || []).map((file) => {
-      const previewUrl = configState.services.request.getPreviewUrl(conversationState.active.id, file.path);
+      const previewUrl = configState.services.request.getPreviewUrl({
+        path: file.path,
+        workspaceId: conversationState.active.id
+      });
       let fileType = "file";
       const ext = file.ext?.toLowerCase() || "";
       if (["jpg", "jpeg", "png", "gif", "bmp", "webp", "svg", "webp"].includes(ext)) {
@@ -5587,5 +5620,7 @@ var layouts_default = React10.forwardRef(({ theme: theme4, params, hooks, layout
 exports.Attachments = Attachments_default;
 exports.ChatCopilot = layouts_default;
 exports.ChatSender = ChatSender_default;
+exports.getFileIcon = getFileIcon;
+exports.getFileUrl = getFileUrl;
 //# sourceMappingURL=index.cjs.js.map
 //# sourceMappingURL=index.cjs.js.map