@nocobase/flow-engine 2.1.0-beta.36 → 2.1.0-beta.38

package/lib/FlowContextProvider.d.ts

@@ -8,7 +8,7 @@
  */
 import React from 'react';
 import { FlowContext, FlowEngineContext } from './flowContext';
-import { FlowView } from './views/FlowView';
+import { FlowView, FlowViewer } from './views/FlowView';
 export declare const FlowReactContext: React.Context<FlowContext>;
 export declare const FlowViewContext: React.Context<FlowContext>;
 export declare function FlowContextProvider(props: {
@@ -22,3 +22,7 @@ export declare const FlowViewContextProvider: React.MemoExoticComponent<(props:
 export declare function useFlowContext<T = FlowEngineContext>(): T;
 export declare function useFlowViewContext<T = FlowEngineContext>(): T;
 export declare function useFlowView(): FlowView;
+/**
+ * Access the `FlowViewer` that opens new drawers / modals / pages (`viewer.drawer({...})`, `viewer.modal({...})`, etc.). This is the counterpart to `useFlowView()`: `useFlowView()` returns the *current* mounted view (use it to close yourself, render Header/Footer slots, etc.), while `useFlowViewer()` returns the surface that lets you open a *new* view from inside any flow-context subtree.
+ */
+export declare function useFlowViewer(): FlowViewer;

package/lib/FlowContextProvider.js

@@ -43,7 +43,8 @@ __export(FlowContextProvider_exports, {
   FlowViewContextProvider: () => FlowViewContextProvider,
   useFlowContext: () => useFlowContext,
   useFlowView: () => useFlowView,
-  useFlowViewContext: () => useFlowViewContext
+  useFlowViewContext: () => useFlowViewContext,
+  useFlowViewer: () => useFlowViewer
 });
 module.exports = __toCommonJS(FlowContextProvider_exports);
 var import_react = __toESM(require("react"));
@@ -70,6 +71,11 @@ function useFlowView() {
   return ctx.view;
 }
 __name(useFlowView, "useFlowView");
+function useFlowViewer() {
+  const ctx = useFlowContext();
+  return ctx.viewer;
+}
+__name(useFlowViewer, "useFlowViewer");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   FlowContextProvider,
@@ -78,5 +84,6 @@ __name(useFlowView, "useFlowView");
   FlowViewContextProvider,
   useFlowContext,
   useFlowView,
-  useFlowViewContext
+  useFlowViewContext,
+  useFlowViewer
 });

package/lib/components/settings/wrappers/contextual/DefaultSettingsIcon.js

@@ -183,6 +183,13 @@ const getToolbarPopupContainer = /* @__PURE__ */ __name((triggerNode) => {
   }
   return triggerNode.closest(TOOLBAR_ICONS_SELECTOR) || triggerNode.closest(TOOLBAR_CONTAINER_SELECTOR);
 }, "getToolbarPopupContainer");
+const removeExtraMenuItemClickHandlers = /* @__PURE__ */ __name((item) => {
+  const { onClick: _onClick, children, ...rest } = item;
+  return {
+    ...rest,
+    children: (children == null ? void 0 : children.length) ? children.map(removeExtraMenuItemClickHandlers) : void 0
+  };
+}, "removeExtraMenuItemClickHandlers");
 const DefaultSettingsIcon = /* @__PURE__ */ __name(({
   model,
   showDeleteButton = true,
@@ -698,7 +705,7 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
         type: "divider"
       });
       if (commonExtras.length > 0) {
-        items.push(...commonExtras);
+        items.push(...commonExtras.map(removeExtraMenuItemClickHandlers));
       }
       if (showCopyUidButton && model.uid) {
         items.push({

package/lib/components/subModel/LazyDropdown.js

@@ -169,16 +169,66 @@ const useKeepDropdownOpen = /* @__PURE__ */ __name(() => {
 }, "useKeepDropdownOpen");
 const useMenuSearch = /* @__PURE__ */ __name(() => {
   const [searchValues, setSearchValues] = (0, import_react.useState)({});
+  const [inputValues, setInputValues] = (0, import_react.useState)({});
   const [isSearching, setIsSearching] = (0, import_react.useState)(false);
+  const [composingCount, setComposingCount] = (0, import_react.useState)(0);
+  const composingKeysRef = (0, import_react.useRef)(/* @__PURE__ */ new Set());
   const searchTimeoutRef = (0, import_react.useRef)(null);
-  const updateSearchValue = /* @__PURE__ */ __name((key, value) => {
+  const updateSearchValue = (0, import_react.useCallback)((key, value) => {
     setIsSearching(true);
+    setInputValues((prev) => ({ ...prev, [key]: value }));
     setSearchValues((prev) => ({ ...prev, [key]: value }));
     if (searchTimeoutRef.current) {
       clearTimeout(searchTimeoutRef.current);
     }
     searchTimeoutRef.current = setTimeout(() => setIsSearching(false), 300);
-  }, "updateSearchValue");
+  }, []);
+  const startComposition = (0, import_react.useCallback)((key) => {
+    composingKeysRef.current.add(key);
+    setIsSearching(true);
+    setComposingCount(composingKeysRef.current.size);
+    if (searchTimeoutRef.current) {
+      clearTimeout(searchTimeoutRef.current);
+      searchTimeoutRef.current = null;
+    }
+  }, []);
+  const endComposition = (0, import_react.useCallback)(
+    (key, value) => {
+      composingKeysRef.current.delete(key);
+      setComposingCount(composingKeysRef.current.size);
+      updateSearchValue(key, value);
+    },
+    [updateSearchValue]
+  );
+  const updateInputValue = (0, import_react.useCallback)((key, value) => {
+    setInputValues((prev) => ({ ...prev, [key]: value }));
+  }, []);
+  const clearSearchValue = (0, import_react.useCallback)((key) => {
+    composingKeysRef.current.delete(key);
+    setComposingCount(composingKeysRef.current.size);
+    setInputValues((prev) => {
+      if (!(key in prev)) return prev;
+      const next = { ...prev };
+      delete next[key];
+      return next;
+    });
+    setSearchValues((prev) => {
+      if (!(key in prev)) return prev;
+      const next = { ...prev };
+      delete next[key];
+      return next;
+    });
+  }, []);
+  const clearAllSearchValues = (0, import_react.useCallback)(() => {
+    composingKeysRef.current.clear();
+    setComposingCount(0);
+    setInputValues({});
+    setSearchValues({});
+    setIsSearching(false);
+  }, []);
+  const isComposing = (0, import_react.useCallback)((key) => {
+    return key ? composingKeysRef.current.has(key) : composingKeysRef.current.size > 0;
+  }, []);
   (0, import_react.useEffect)(() => {
     return () => {
       if (searchTimeoutRef.current) {
@@ -188,8 +238,15 @@ const useMenuSearch = /* @__PURE__ */ __name(() => {
   }, []);
   return {
     searchValues,
-    isSearching,
-    updateSearchValue
+    inputValues,
+    isSearching: isSearching || composingCount > 0,
+    updateSearchValue,
+    updateInputValue,
+    startComposition,
+    endComposition,
+    clearSearchValue,
+    clearAllSearchValues,
+    isComposing
   };
 }, "useMenuSearch");
 const useSubmenuStyles = /* @__PURE__ */ __name((menuVisible, dropdownMaxHeight) => {
@@ -275,10 +332,10 @@ const getLabelSearchText = /* @__PURE__ */ __name((label) => {
   }
   return "";
 }, "getLabelSearchText");
-const createSearchItem = /* @__PURE__ */ __name((item, searchKey, currentSearchValue, menuVisible, t, updateSearchValue) => ({
+const createSearchItem = /* @__PURE__ */ __name((item, searchKey, currentSearchValue, menuVisible, t, searchHandlers, activateSearchSubmenu, deactivateSearchSubmenu) => ({
   key: `${searchKey}-search`,
   type: "group",
-  label: /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(
+  label: /* @__PURE__ */ import_react.default.createElement("div", { onMouseDown: (e) => e.stopPropagation(), onClick: (e) => e.stopPropagation() }, /* @__PURE__ */ import_react.default.createElement(
     SearchInputWithAutoFocus,
     {
       visible: menuVisible,
@@ -286,11 +343,44 @@ const createSearchItem = /* @__PURE__ */ __name((item, searchKey, currentSearchV
       allowClear: true,
       placeholder: t(item.searchPlaceholder || "Search"),
       value: currentSearchValue,
+      onFocus: (e) => {
+        e.stopPropagation();
+      },
       onChange: (e) => {
+        var _a;
+        e.stopPropagation();
+        const value = e.target.value;
+        activateSearchSubmenu(searchKey);
+        if (((_a = e.nativeEvent) == null ? void 0 : _a.isComposing) || searchHandlers.isComposing(searchKey)) {
+          searchHandlers.updateInputValue(searchKey, value);
+          return;
+        }
+        if (!value) {
+          deactivateSearchSubmenu(searchKey);
+        }
+        searchHandlers.updateSearchValue(searchKey, value);
+      },
+      onCompositionStart: (e) => {
+        e.stopPropagation();
+        activateSearchSubmenu(searchKey);
+        searchHandlers.startComposition(searchKey);
+      },
+      onCompositionEnd: (e) => {
+        e.stopPropagation();
+        const value = e.currentTarget.value;
+        if (value) {
+          activateSearchSubmenu(searchKey);
+        } else {
+          deactivateSearchSubmenu(searchKey);
+        }
+        searchHandlers.endComposition(searchKey, value);
+      },
+      onClick: (e) => {
+        e.stopPropagation();
+      },
+      onKeyDown: (e) => {
         e.stopPropagation();
-        updateSearchValue(searchKey, e.target.value);
       },
-      onClick: (e) => e.stopPropagation(),
       onMouseDown: (e) => {
         e.stopPropagation();
       },
@@ -313,13 +403,21 @@ const KEEP_OPEN_LABEL_STYLE = {
   width: "100%"
 };
 const DROPDOWN_PERSIST_TTL_MS = 350;
+const SUBMENU_CLOSE_DELAY = 0.05;
+const SUBMENU_MOTION_DISABLED = {
+  motionEnter: false,
+  motionLeave: false
+};
 const dropdownPersistRegistry = /* @__PURE__ */ new Map();
 const LazyDropdown = /* @__PURE__ */ __name(({ menu, ...props }) => {
   const engine = (0, import_provider.useFlowEngine)();
   const [menuVisible, setMenuVisible] = (0, import_react.useState)(false);
   const [openKeys, setOpenKeys] = (0, import_react.useState)(/* @__PURE__ */ new Set());
+  const [activeSearchKey, setActiveSearchKey] = (0, import_react.useState)(null);
   const [rootItems, setRootItems] = (0, import_react.useState)([]);
   const [rootLoading, setRootLoading] = (0, import_react.useState)(false);
+  const closeByOutsideClickRef = (0, import_react.useRef)(false);
+  const skipPreserveActiveSearchRef = (0, import_react.useRef)(false);
   const dropdownMaxHeight = useNiceDropdownMaxHeight();
   const t = engine.translate.bind(engine);
   const { items: menuItems, keepDropdownOpen, persistKey, stateVersion, refreshKeys, ...dropdownMenuProps } = menu;
@@ -330,22 +428,89 @@ const LazyDropdown = /* @__PURE__ */ __name(({ menu, ...props }) => {
     openKeys,
     refreshKeys
   );
-  const { searchValues, isSearching, updateSearchValue } = useMenuSearch();
+  const searchHandlers = useMenuSearch();
+  const { searchValues, inputValues, clearSearchValue, clearAllSearchValues } = searchHandlers;
   const { requestKeepOpen, shouldPreventClose } = useKeepDropdownOpen();
   useSubmenuStyles(menuVisible, dropdownMaxHeight);
+  const closeMenu = (0, import_react.useCallback)(() => {
+    setMenuVisible(false);
+    setActiveSearchKey(null);
+    setOpenKeys(/* @__PURE__ */ new Set());
+    clearAllSearchValues();
+  }, [clearAllSearchValues]);
+  const activateSearchSubmenu = (0, import_react.useCallback)((key) => {
+    setActiveSearchKey(key);
+    setOpenKeys((prev) => {
+      if (prev.has(key)) return prev;
+      const next = new Set(prev);
+      next.add(key);
+      return next;
+    });
+  }, []);
+  const deactivateSearchSubmenu = (0, import_react.useCallback)((key) => {
+    setActiveSearchKey((prev) => prev === key ? null : prev);
+  }, []);
+  const closeActiveSearchForPath = (0, import_react.useCallback)(
+    (keyPath) => {
+      if (!activeSearchKey || keyPath === activeSearchKey || keyPath.startsWith(`${activeSearchKey}/`) || activeSearchKey.startsWith(`${keyPath}/`)) {
+        return;
+      }
+      skipPreserveActiveSearchRef.current = true;
+      clearSearchValue(activeSearchKey);
+      setActiveSearchKey(null);
+      setOpenKeys((prev) => {
+        const next = new Set(prev);
+        next.delete(activeSearchKey);
+        return next;
+      });
+    },
+    [activeSearchKey, clearSearchValue]
+  );
   const handleMenuOpenChange = (0, import_react.useCallback)(
     (nextOpenKeys) => {
       var _a, _b;
-      if (!nextOpenKeys.length && shouldPreventClose()) {
+      let normalized = normalizeOpenKeys(nextOpenKeys);
+      if (activeSearchKey && openKeys.has(activeSearchKey) && !normalized.includes(activeSearchKey)) {
+        if (normalized.length || skipPreserveActiveSearchRef.current) {
+          clearSearchValue(activeSearchKey);
+          setActiveSearchKey(null);
+        } else {
+          normalized = [activeSearchKey];
+        }
+      }
+      if (!normalized.length && shouldPreventClose()) {
         (_a = dropdownMenuProps.onOpenChange) == null ? void 0 : _a.call(dropdownMenuProps, Array.from(openKeys));
+        skipPreserveActiveSearchRef.current = false;
         return;
       }
-      const normalized = normalizeOpenKeys(nextOpenKeys);
+      Array.from(openKeys).forEach((key) => {
+        if (!normalized.includes(key)) {
+          clearSearchValue(key);
+        }
+      });
       setOpenKeys(new Set(normalized));
       (_b = dropdownMenuProps.onOpenChange) == null ? void 0 : _b.call(dropdownMenuProps, normalized);
+      skipPreserveActiveSearchRef.current = false;
     },
-    [dropdownMenuProps, openKeys, shouldPreventClose]
+    [activeSearchKey, clearSearchValue, dropdownMenuProps, openKeys, shouldPreventClose]
   );
+  (0, import_react.useEffect)(() => {
+    if (!menuVisible) return;
+    const markOutsideClick = /* @__PURE__ */ __name((event) => {
+      const target = event.target;
+      const isOutside = !(target == null ? void 0 : target.closest(".ant-dropdown, .ant-dropdown-menu, .ant-dropdown-menu-submenu-popup"));
+      closeByOutsideClickRef.current = isOutside;
+      if (isOutside) {
+        closeMenu();
+      }
+    }, "markOutsideClick");
+    document.addEventListener("pointerdown", markOutsideClick, true);
+    document.addEventListener("mousedown", markOutsideClick, true);
+    return () => {
+      document.removeEventListener("pointerdown", markOutsideClick, true);
+      document.removeEventListener("mousedown", markOutsideClick, true);
+    };
+  }, [closeMenu, menuVisible]);
   (0, import_react.useEffect)(() => {
     if (!persistKey) return;
     const until = dropdownPersistRegistry.get(persistKey) || 0;
@@ -391,6 +556,7 @@ const LazyDropdown = /* @__PURE__ */ __name(({ menu, ...props }) => {
   function buildSearchChildren(children, item, keyPath, path, menuVisible2, resolve) {
     const searchKey = keyPath;
     const currentSearchValue = searchValues[searchKey] || "";
+    const currentInputValue = inputValues[searchKey] ?? currentSearchValue;
     const filteredChildren = currentSearchValue ? (/* @__PURE__ */ __name(function deepFilter(items2) {
       const searchText = currentSearchValue.toLowerCase();
       return items2.map((child) => {
@@ -407,7 +573,16 @@ const LazyDropdown = /* @__PURE__ */ __name(({ menu, ...props }) => {
       }).filter(Boolean);
     }, "deepFilter"))(children) : children;
     const resolvedFiltered = resolve(filteredChildren, [...path, item.key]);
-    const searchItem = createSearchItem(item, searchKey, currentSearchValue, menuVisible2, t, updateSearchValue);
+    const searchItem = createSearchItem(
+      item,
+      searchKey,
+      currentInputValue,
+      menuVisible2,
+      t,
+      searchHandlers,
+      activateSearchSubmenu,
+      deactivateSearchSubmenu
+    );
     const dividerItem = { key: `${keyPath}-search-divider`, type: "divider" };
     if (currentSearchValue && resolvedFiltered.length === 0) {
       return [searchItem, dividerItem, createEmptyItem(keyPath, t)];
@@ -466,6 +641,7 @@ const LazyDropdown = /* @__PURE__ */ __name(({ menu, ...props }) => {
           label,
           onClick: /* @__PURE__ */ __name((info) => {
           }, "onClick"),
+          onMouseEnter: /* @__PURE__ */ __name(() => closeActiveSearchForPath(keyPath), "onMouseEnter"),
           children: buildSearchChildren(children, item, keyPath, path, menuVisible, resolveItems)
         };
       }
@@ -513,6 +689,7 @@ const LazyDropdown = /* @__PURE__ */ __name(({ menu, ...props }) => {
         onClick: /* @__PURE__ */ __name((info) => {
           if (!itemShouldKeepOpen) handleLeafClick(info);
         }, "onClick"),
+        onMouseEnter: /* @__PURE__ */ __name(() => closeActiveSearchForPath(keyPath), "onMouseEnter"),
         onMouseDown: /* @__PURE__ */ __name(() => {
           if (!itemShouldKeepOpen) {
             return;
@@ -555,6 +732,8 @@ const LazyDropdown = /* @__PURE__ */ __name(({ menu, ...props }) => {
         ...dropdownMenuProps,
         openKeys: Array.from(openKeys),
         items,
+        subMenuCloseDelay: dropdownMenuProps.subMenuCloseDelay ?? SUBMENU_CLOSE_DELAY,
+        motion: dropdownMenuProps.motion ?? SUBMENU_MOTION_DISABLED,
         onClick: /* @__PURE__ */ __name(() => {
         }, "onClick"),
         onOpenChange: handleMenuOpenChange,
@@ -564,14 +743,19 @@ const LazyDropdown = /* @__PURE__ */ __name(({ menu, ...props }) => {
           ...dropdownMenuProps == null ? void 0 : dropdownMenuProps.style
         }
       },
-      onOpenChange: (visible) => {
-        if (!visible && isSearching) {
+      onOpenChange: (visible, info) => {
+        if (!visible && activeSearchKey && (info == null ? void 0 : info.source) === "trigger" && !closeByOutsideClickRef.current) {
           return;
         }
         if (!visible && shouldPreventClose()) {
           return;
         }
-        setMenuVisible(visible);
+        if (!visible) {
+          closeMenu();
+        } else {
+          setMenuVisible(visible);
+        }
+        closeByOutsideClickRef.current = false;
       }
     },
     props.children

package/lib/flowContext.js

@@ -2697,6 +2697,9 @@ const _FlowEngineContext = class _FlowEngineContext extends BaseFlowEngineContex
       }, "get")
     });
     this.defineMethod("aclCheck", function(params) {
+      if (this.skipAclCheck) {
+        return true;
+      }
       return this.acl.aclCheck(params);
     });
     this.defineMethod("createResource", function(resourceType) {

package/lib/flowEngine.js

@@ -63,6 +63,7 @@ var import_emitter = require("./emitter");
 var import_ModelOperationScheduler = __toESM(require("./scheduler/ModelOperationScheduler"));
 var import_utils = require("./utils");
 var _FlowEngine_instances, registerModel_fn;
+const getFlowEngineLoggerLevel = /* @__PURE__ */ __name(() => process.env.NODE_ENV === "production" ? "warn" : "trace", "getFlowEngineLoggerLevel");
 const _FlowEngine = class _FlowEngine {
   /**
    * Constructor. Initializes React view, registers default model and form scopes.
@@ -195,7 +196,7 @@ const _FlowEngine = class _FlowEngine {
       MultiRecordResource: import_resources.MultiRecordResource
     });
     this.logger = (0, import_pino.default)({
-      level: "trace",
+      level: getFlowEngineLoggerLevel(),
       browser: {
         write: {
           fatal: /* @__PURE__ */ __name((o) => console.trace(o), "fatal"),
@@ -859,7 +860,6 @@ const _FlowEngine = class _FlowEngine {
     const visited = /* @__PURE__ */ new Set();
     while (current) {
       if (visited.has(current)) {
-        console.warn(`FlowEngine: resolveUse circular reference detected on '${current.name}'.`);
         break;
       }
       visited.add(current);
@@ -960,7 +960,7 @@ const _FlowEngine = class _FlowEngine {
   removeModel(uid) {
     var _a, _b, _c;
     if (!this._modelInstances.has(uid)) {
-      console.warn(`FlowEngine: Model with UID '${uid}' does not exist.`);
+      this.logger.debug(`FlowEngine: Model with UID '${uid}' does not exist.`);
       return false;
     }
     const modelInstance = this._modelInstances.get(uid);

package/lib/models/flowModel.js

@@ -668,7 +668,7 @@ const _FlowModel = class _FlowModel {
     }
     const isFork = this.isFork === true;
     const target = this;
-    console.log(
+    currentFlowEngine.logger.debug(
       `[FlowModel] applyFlow: uid=${this.uid}, flowKey=${flowKey}, isFork=${isFork}, cleanRun=${this.cleanRun}, targetIsFork=${(target == null ? void 0 : target.isFork) === true}`
     );
     return currentFlowEngine.executor.runFlow(target, flowKey, inputArgs, runId);
@@ -681,7 +681,7 @@ const _FlowModel = class _FlowModel {
     }
     const isFork = this.isFork === true;
     const target = this;
-    console.log(
+    currentFlowEngine.logger.debug(
       `[FlowModel] dispatchEvent: uid=${this.uid}, event=${eventName}, isFork=${isFork}, cleanRun=${this.cleanRun}, targetIsFork=${(target == null ? void 0 : target.isFork) === true}`
     );
     return await currentFlowEngine.executor.dispatchEvent(target, eventName, inputArgs, options);
@@ -1056,7 +1056,7 @@ const _FlowModel = class _FlowModel {
   }
   clearForks() {
     var _a;
-    console.log(`FlowModel ${this.uid} clearing all forks.`);
+    this.flowEngine.logger.debug(`FlowModel ${this.uid} clearing all forks.`);
     if ((_a = this.forks) == null ? void 0 : _a.size) {
       this.forks.forEach((fork) => fork.dispose());
       this.forks.clear();

package/lib/utils/parsePathnameToViewParams.d.ts

@@ -16,6 +16,10 @@ export interface ViewParam {
     /** source Id */
     sourceId?: string;
 }
+export interface ParsePathnameToViewParamsOptions {
+    rootPrefix?: string;
+    basePath?: string;
+}
 /**
  * 解析路径名为视图参数数组
  *
@@ -31,4 +35,4 @@ export interface ViewParam {
  * parsePathnameToViewParams('/admin/xxx/view/yyy') // [{ viewUid: 'xxx' }, { viewUid: 'yyy' }]
  * ```
  */
-export declare const parsePathnameToViewParams: (pathname: string) => ViewParam[];
+export declare const parsePathnameToViewParams: (pathname: string, options?: ParsePathnameToViewParamsOptions) => ViewParam[];

package/lib/utils/parsePathnameToViewParams.js

@@ -30,20 +30,44 @@ __export(parsePathnameToViewParams_exports, {
   parsePathnameToViewParams: () => parsePathnameToViewParams
 });
 module.exports = __toCommonJS(parsePathnameToViewParams_exports);
-const parsePathnameToViewParams = /* @__PURE__ */ __name((pathname) => {
+const normalizePathname = /* @__PURE__ */ __name((pathname) => {
+  if (!pathname || pathname === "/") {
+    return "/";
+  }
+  return `/${pathname.replace(/^\/+/, "").replace(/\/+$/, "")}`;
+}, "normalizePathname");
+const normalizeBasePath = /* @__PURE__ */ __name((basePath) => `/${basePath.replace(/^\/+/, "").replace(/\/+$/, "")}`, "normalizeBasePath");
+const stripBasePath = /* @__PURE__ */ __name((pathname, basePath) => {
+  const normalizedPathname = normalizePathname(pathname);
+  const normalizedBasePath = normalizeBasePath(basePath);
+  if (normalizedPathname === normalizedBasePath) {
+    return "";
+  }
+  if (normalizedPathname.startsWith(`${normalizedBasePath}/`)) {
+    return normalizedPathname.slice(normalizedBasePath.length + 1);
+  }
+  return "";
+}, "stripBasePath");
+const parsePathnameToViewParams = /* @__PURE__ */ __name((pathname, options = {}) => {
   if (!pathname || pathname === "/") {
     return [];
   }
-  const segments = pathname.replace(/^\/+/, "").split("/").filter(Boolean);
-  if (segments.length < 2) {
+  const rootPrefix = options.rootPrefix || "admin";
+  const relativePath = options.basePath ? stripBasePath(pathname, options.basePath) : "";
+  const segments = (options.basePath ? relativePath : pathname).replace(/^\/+/, "").split("/").filter(Boolean);
+  if (segments.length < (options.basePath ? 1 : 2)) {
     return [];
   }
   const result = [];
   let currentView = null;
   let i = 0;
+  if (options.basePath) {
+    currentView = { viewUid: segments[0] };
+    i = 1;
+  }
   while (i < segments.length) {
     const segment = segments[i];
-    if (segment === "admin" || segment === "view") {
+    if (segment === rootPrefix || segment === "view") {
       if (currentView) {
         result.push(currentView);
       }

package/lib/views/ViewNavigation.d.ts

@@ -11,6 +11,14 @@ import { ViewParam as SharedViewParam } from '../utils';
 type ViewParams = Omit<SharedViewParam, 'viewUid'> & {
     viewUid?: string;
 };
+export interface GeneratePathnameFromViewParamsOptions {
+    prefix?: string;
+    basePath?: string;
+}
+export interface ViewNavigationOptions {
+    basePath?: string;
+    layoutBasePath?: string;
+}
 /**
  * 将 ViewParam 数组转换为 pathname
  *
@@ -24,12 +32,13 @@ type ViewParams = Omit<SharedViewParam, 'viewUid'> & {
  * generatePathnameFromViewParams([{ viewUid: 'xxx' }, { viewUid: 'yyy' }]) // '/admin/xxx/view/yyy'
  * ```
  */
-export declare function generatePathnameFromViewParams(viewParams: ViewParams[]): string;
+export declare function generatePathnameFromViewParams(viewParams: ViewParams[], options?: GeneratePathnameFromViewParamsOptions): string;
 export declare class ViewNavigation {
     viewStack: ReadonlyArray<ViewParams>;
     ctx: FlowEngineContext;
     viewParams: ViewParams;
-    constructor(ctx: FlowEngineContext, viewParams: ViewParams[]);
+    private readonly basePath?;
+    constructor(ctx: FlowEngineContext, viewParams: ViewParams[], options?: ViewNavigationOptions);
     setViewStack(viewParams: ViewParams[]): void;
     changeTo(viewParam: ViewParams): void;
     navigateTo(viewParam: ViewParams, opts?: {
@@ -37,5 +46,6 @@ export declare class ViewNavigation {
         state?: any;
     }): void;
     back(): void;
+    private getLayoutBasePath;
 }
 export {};

package/lib/views/ViewNavigation.js

@@ -47,11 +47,17 @@ function hasUsableSourceId(sourceId) {
   return sourceId !== void 0 && sourceId !== null && String(sourceId) !== "";
 }
 __name(hasUsableSourceId, "hasUsableSourceId");
-function generatePathnameFromViewParams(viewParams) {
+function normalizeBasePath(basePath) {
+  const value = basePath || "/admin";
+  return `/${value.replace(/^\/+/, "").replace(/\/+$/, "")}`;
+}
+__name(normalizeBasePath, "normalizeBasePath");
+function generatePathnameFromViewParams(viewParams, options = {}) {
+  const basePath = normalizeBasePath(options.basePath || options.prefix);
   if (!viewParams || viewParams.length === 0) {
-    return "/admin";
+    return basePath;
   }
-  const segments = ["admin"];
+  const segments = basePath.replace(/^\/+/, "").split("/").filter(Boolean);
   viewParams.forEach((viewParam, index) => {
     if (index > 0) {
       segments.push("view");
@@ -78,9 +84,11 @@ const _ViewNavigation = class _ViewNavigation {
   // 只能通过 setViewStack 修改
   ctx;
   viewParams;
-  constructor(ctx, viewParams) {
+  basePath;
+  constructor(ctx, viewParams, options = {}) {
     this.setViewStack(viewParams);
     this.ctx = ctx;
+    this.basePath = options.basePath || options.layoutBasePath;
     (0, import_reactive.define)(this, {
       viewParams: import_reactive.observable
     });
@@ -96,19 +104,26 @@ const _ViewNavigation = class _ViewNavigation {
       }
       return { ...item };
     });
-    const newPathname = generatePathnameFromViewParams(newViewStack);
+    const newPathname = generatePathnameFromViewParams(newViewStack, { basePath: this.getLayoutBasePath() });
     this.ctx.router.navigate(newPathname, { replace: true });
   }
   navigateTo(viewParam, opts) {
-    const newViewPathname = generatePathnameFromViewParams([...this.viewStack, viewParam]);
+    const newViewPathname = generatePathnameFromViewParams([...this.viewStack, viewParam], {
+      basePath: this.getLayoutBasePath()
+    });
     const newPathname = newViewPathname;
     this.ctx.router.navigate(newPathname, opts);
   }
   back() {
     const prevStack = this.viewStack.slice(0, -1);
-    const prevPath = generatePathnameFromViewParams(prevStack);
+    const prevPath = generatePathnameFromViewParams(prevStack, { basePath: this.getLayoutBasePath() });
     this.ctx.router.navigate(prevPath, { replace: true });
   }
+  getLayoutBasePath() {
+    var _a, _b;
+    const routePath = (_a = this.ctx.layout) == null ? void 0 : _a.routePath;
+    return this.basePath || ((_b = this.ctx.layoutRoute) == null ? void 0 : _b.basePathname) || ((routePath == null ? void 0 : routePath.startsWith("/")) ? routePath : "/admin");
+  }
 };
 __name(_ViewNavigation, "ViewNavigation");
 let ViewNavigation = _ViewNavigation;