@zk-tech/base-ui-configuration-service 0.0.1-alpha.1

package/dist/index.cjs

@@ -0,0 +1,984 @@
+'use strict';
+
+var dispose = require('@zk-tech/bedrock/dispose');
+var di = require('@zk-tech/bedrock/di');
+var event = require('@zk-tech/bedrock/event');
+var assert = require('@zk-tech/bedrock/assert');
+var valtio = require('valtio');
+var lodashEs = require('lodash-es');
+var React3 = require('react');
+var lock = require('@zk-tech/bedrock/lock');
+var reactRouterDom = require('react-router-dom');
+var pathToRegexp = require('path-to-regexp');
+var reactErrorBoundary = require('react-error-boundary');
+var ahooks = require('ahooks');
+var cs = require('classnames');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React3__default = /*#__PURE__*/_interopDefault(React3);
+var cs__default = /*#__PURE__*/_interopDefault(cs);
+
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (decorator(result)) || result;
+  return result;
+};
+var __decorateParam = (index, decorator) => (target, key) => decorator(target, key, index);
+
+// src/base/middleware/action-point-runner.ts
+var ActionPointRunner = class extends Function {
+  constructor(middlewares, point, _uiConfig) {
+    super();
+    this.middlewares = middlewares;
+    this.point = point;
+    this._uiConfig = _uiConfig;
+    this._isStop = false;
+    this.index = 0;
+    const closure = (...args) => closure.run(...args);
+    closure.middlewares = middlewares;
+    closure.point = point ?? {
+      name: "",
+      from: "",
+      trigger: "",
+      path: []
+    };
+    closure._uiConfig = _uiConfig;
+    return Object.setPrototypeOf(closure, new.target.prototype);
+  }
+  get isStop() {
+    return this._isStop;
+  }
+  run(...args) {
+    this._rawArguments = args;
+    this.index = -1;
+    let data;
+    while (this.hasNext() && !this._isStop) {
+      data = this.getNext()();
+    }
+    return data;
+  }
+  hasNext() {
+    return this.index < this.middlewares.length - 1;
+  }
+  getNext(skip = false) {
+    let next = () => {
+    };
+    if (this.hasNext()) {
+      this.index += 1;
+      const handler = this.middlewares[this.index];
+      next = () => {
+        return handler({
+          stop: () => {
+            this._isStop = true;
+          },
+          uiConfig: this._uiConfig,
+          actionInfo: this.point,
+          triggerArgs: this._rawArguments
+        });
+      };
+    }
+    return next;
+  }
+};
+
+// src/base/middleware/middleware.ts
+var MiddlewareManager = class {
+  constructor() {
+    this._registerById = /* @__PURE__ */ new Map();
+    /** caller <-> middleware handler 的映射表 */
+    this._registerByCaller = /* @__PURE__ */ new Map();
+    this._onMiddlewareChange = new event.Emitter();
+    this._disposeMap = /* @__PURE__ */ new Map();
+    this.onMiddlewareChange = this._onMiddlewareChange.event;
+  }
+  buildRunner(options) {
+    const caller = this._getCaller(options);
+    const handlers = (this._registerByCaller.get(caller) ?? []).map((id) => this._registerById.get(id)?.handler).filter((item) => item);
+    if (options.handler) {
+      handlers.push(options.handler);
+    }
+    return new ActionPointRunner(
+      // @ts-ignore type error
+      handlers,
+      {
+        from: options.trigger,
+        name: options.uiConfig.id,
+        trigger: options.method
+      },
+      options.uiConfig
+    );
+  }
+  use(props) {
+    const existed = this._registerById.get(props.id);
+    if (existed) {
+      assert.lvAssertNotHere("config had been existed");
+    }
+    this._registerById.set(props.id, props);
+    props.triggerMethod.forEach((item) => {
+      const caller = this._getCaller({ trigger: props.trigger, method: item });
+      if (!this._registerByCaller.has(caller)) {
+        this._registerByCaller.set(caller, []);
+      }
+      const target = this._registerByCaller.get(caller);
+      target.push(props.id);
+    });
+    this._onMiddlewareChange.fire({
+      trigger: props.trigger,
+      method: props.triggerMethod
+    });
+    const dispose = props.freshTrigger(() => {
+      this._onMiddlewareChange.fire({
+        trigger: props.trigger,
+        method: props.triggerMethod
+      });
+    });
+    this._disposeMap.set(props.id, dispose);
+  }
+  unUse(id) {
+    const target = this._registerById.get(id);
+    if (!target) {
+      return;
+    }
+    target.triggerMethod.forEach((item) => {
+      const caller = this._getCaller({ trigger: target.trigger, method: item });
+      if (!this._registerByCaller.has(caller)) {
+        return;
+      }
+      const triggers = this._registerByCaller.get(caller);
+      this._registerByCaller.set(
+        caller,
+        triggers.filter((_item) => _item === target.id)
+      );
+    });
+    this._onMiddlewareChange.fire({
+      trigger: target.trigger,
+      method: target.triggerMethod
+    });
+    const dispose = this._disposeMap.get(id);
+    dispose?.dispose();
+    this._disposeMap.delete(id);
+  }
+  _getCaller({ trigger, method }) {
+    return `${trigger}-${method.toString()}`;
+  }
+};
+
+// src/base/base-ui-configuration-service.tsx
+exports.BaseUiConfigurationService = class BaseUiConfigurationService extends dispose.Disposable {
+  constructor(_setting, _containerService) {
+    super();
+    this._setting = _setting;
+    this._containerService = _containerService;
+  }
+  get setting() {
+    return this._setting;
+  }
+  registerConfig(config) {
+    for (const key of Object.keys(config)) {
+      this.uiManager[key].registerConfig(config[key]);
+    }
+  }
+  useMiddleware(props) {
+    return this.middleware.use(props);
+  }
+  _bootstrap() {
+    this.middleware = this._containerService.createInstance(MiddlewareManager);
+    this._initAllManager();
+  }
+};
+exports.BaseUiConfigurationService = __decorateClass([
+  __decorateParam(1, di.IContainerService)
+], exports.BaseUiConfigurationService);
+var BaseSetting = class {
+  constructor(options) {
+    const defaultConfig = {
+      namespace: "base",
+      visible: true,
+      debugMode: false
+    };
+    this.observableData = valtio.proxy(lodashEs.merge(defaultConfig, options.setting));
+  }
+  get namespace() {
+    return this.observableData.namespace;
+  }
+  get debugMode() {
+    return this.observableData.debugMode;
+  }
+  get visible() {
+    return this.observableData.visible;
+  }
+};
+var GlobalContext = React3.createContext();
+var BaseUiManager = class {
+  // feat: 修复旧框架跳转新框架闪动
+  constructor(_middlewareManager) {
+    this._middlewareManager = _middlewareManager;
+    this._listenerMiddlewareChange();
+  }
+  unRegisterConfig(id) {
+    assert.lvAssertNotHere(
+      "There is no such scenario yet, and no support capability is provided for the time being. If necessary, please contact infrastructure support"
+    );
+  }
+  _listenerMiddlewareChange() {
+    this._middlewareManager.onMiddlewareChange((props) => {
+      this._middlewareChange(props);
+    });
+  }
+};
+
+// src/utils/sort.ts
+var OrderLevel = /* @__PURE__ */ ((OrderLevel2) => {
+  OrderLevel2["high"] = "high";
+  OrderLevel2["default"] = "default";
+  OrderLevel2["low"] = "low";
+  return OrderLevel2;
+})(OrderLevel || {});
+function sortListBySettings({
+  list,
+  filter = (item) => item
+}) {
+  return list.sort((a, b) => {
+    const typeSort = { high: 2, default: 1, low: 0 };
+    const { orderLevel: aType = "default", order: aPriority = 0 } = a;
+    const { orderLevel: bType = "default", order: bPriority = 0 } = b;
+    if (aType !== bType) {
+      return typeSort[bType] - typeSort[aType];
+    }
+    return bPriority - aPriority;
+  }).map(filter);
+}
+
+// src/utils/merged-array.ts
+var mergeUiConfigs = (configs) => {
+  const uiConfigs = {};
+  configs.map((configObj) => {
+    for (const [key, config] of Object.entries(configObj)) {
+      if (!Array.isArray(config)) {
+        continue;
+      }
+      if (key in uiConfigs) {
+        uiConfigs[key]?.push(...config);
+      } else {
+        Object.assign(uiConfigs, {
+          [key]: config
+        });
+      }
+    }
+  });
+  return uiConfigs;
+};
+
+// src/utils/runner-builder.ts
+function runnerBuilder({
+  middleware,
+  trigger,
+  method,
+  handler,
+  uiConfig
+}) {
+  const runner = middleware.buildRunner({
+    trigger,
+    method,
+    handler,
+    uiConfig
+  });
+  return runner;
+}
+
+// src/utils/evaluate.ts
+function evaluate(config, defaultValue, ...args) {
+  if (typeof config === "function") {
+    return config(...args) ?? defaultValue;
+  }
+  return config ?? defaultValue;
+}
+var PageRouteManagerSymbol = "PageRoute";
+var KeepAliveStatus = /* @__PURE__ */ ((KeepAliveStatus2) => {
+  KeepAliveStatus2["Activated"] = "Activated";
+  KeepAliveStatus2["InActivated"] = "InActivated";
+  return KeepAliveStatus2;
+})(KeepAliveStatus || {});
+var InitAwaitLock = class {
+  constructor() {
+    this._mutex = new lock.SharedMutex();
+    void this._mutex.lock();
+  }
+  /**
+   * @description 是否已经完成初始化
+   */
+  get hasBeenDone() {
+    return !this._mutex.isLocked();
+  }
+  /**
+   * @description 标记初始化完成并放行
+   */
+  initDone() {
+    if (this.hasBeenDone) {
+      return;
+    }
+    this._mutex.unLock();
+  }
+};
+
+// src/utils/is-equal.ts
+var isEqualStr = (val, otherVal) => val === otherVal;
+var queryStringify = (parseObj) => {
+  if (typeof parseObj !== "object") {
+    assert.lvAssertNever(parseObj);
+  }
+  return Object.entries(parseObj).map((item) => `${item[0]}=${item[1]}`).join("&");
+};
+var ErrorBoundary = ({ children, fallback, onError }) => {
+  return /* @__PURE__ */ React.createElement(reactErrorBoundary.ErrorBoundary, { fallback: fallback ?? /* @__PURE__ */ React.createElement("div", null), onError }, children);
+};
+function useObserverSelector(selectionTarget, selector, options = {}) {
+  const { deps } = options;
+  if (!selectionTarget) {
+    return void 0;
+  }
+  const snapshot2 = valtio.useSnapshot(selectionTarget);
+  const selectedValue = React3.useMemo(() => {
+    return selector(snapshot2);
+  }, [snapshot2, ...deps ?? []]);
+  return selectedValue;
+}
+
+// src/feature/page-route/component/page-route.module.scss
+var page_route_module_default = {};
+
+// src/feature/page-route/component/page-route.tsx
+var PageRoute = ({ layout }) => {
+  const navigate2 = reactRouterDom.useNavigate();
+  const { uiConfigurationService } = React3.useContext(GlobalContext);
+  const baseRoute = useObserverSelector(uiConfigurationService.setting, (manager) => {
+    return {
+      namespace: manager.namespace,
+      baseRoute: manager.baseRoute,
+      redirectRouteIdWhen404: manager.redirectRouteIdWhen404
+    };
+  });
+  const routeConfig = useObserverSelector(
+    uiConfigurationService.uiManager[PageRouteManagerSymbol],
+    (manager) => {
+      return manager.observableData.configs;
+    }
+  );
+  const redirectRouteId = useObserverSelector(uiConfigurationService.setting, (setting) => {
+    return setting?.observableData?.redirectRouteIdWhen404;
+  });
+  const redirectRoute = React3.useMemo(() => {
+    if (!redirectRouteId) return void 0;
+    return routeConfig.find(({ id }) => id === redirectRouteId);
+  }, [redirectRouteId, routeConfig]);
+  React3.useEffect(() => {
+    const routeManager = uiConfigurationService.uiManager[PageRouteManagerSymbol];
+    const { pendingNavigateOptions } = routeManager;
+    if (pendingNavigateOptions) {
+      navigate2(pendingNavigateOptions.path, pendingNavigateOptions.options);
+    }
+    const dispose = routeManager.onWouldRouteChange((to, options) => {
+      if (typeof to === "string") {
+        navigate2(to, options);
+      } else {
+        navigate2(to);
+      }
+    });
+    routeManager.initDone();
+    return () => {
+      dispose.dispose();
+    };
+  }, []);
+  const config = React3.useMemo(
+    () => routeConfig.map((item) => /* @__PURE__ */ React.createElement(
+      reactRouterDom.Route,
+      {
+        key: `${item.id}-${item._updateTime}`,
+        path: item.path,
+        index: item.index,
+        element: /* @__PURE__ */ React.createElement(ErrorBoundary, { fallback: item.errorElement ?? /* @__PURE__ */ React.createElement("div", null) }, item.content ? item.content() : item.skeleton?.() ?? null)
+      }
+    )),
+    [routeConfig]
+  );
+  return /* @__PURE__ */ React.createElement("div", { id: baseRoute.namespace, className: page_route_module_default.root }, /* @__PURE__ */ React.createElement(reactRouterDom.Routes, null, /* @__PURE__ */ React.createElement(reactRouterDom.Route, { element: layout }, config), redirectRoute ? /* @__PURE__ */ React.createElement(reactRouterDom.Route, { path: "*", element: /* @__PURE__ */ React.createElement(reactRouterDom.Navigate, { to: redirectRoute.path, replace: true }) }) : null));
+};
+var Repeater = React3.memo((props) => {
+  const { mode, children } = props;
+  const resolveRef = React3.useRef();
+  if (mode === "hidden") {
+    React3.startTransition(() => {
+      throw new Promise((resolve) => resolveRef.current = resolve);
+    });
+  }
+  if (resolveRef.current) {
+    React3.startTransition(() => {
+      resolveRef.current?.();
+      resolveRef.current = void 0;
+    });
+  }
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, children);
+});
+
+// src/feature/page-route/component/keep-alive-outlet/components/offscreen/index.tsx
+var Offscreen = React3.memo((props) => {
+  const { mode, children, fallback } = props;
+  return /* @__PURE__ */ React.createElement(React3.Suspense, { fallback }, /* @__PURE__ */ React.createElement(Repeater, { mode }, children));
+});
+var isNeedCache = (routesConfig, pathName, updateTime) => {
+  for (const route of routesConfig) {
+    const isMatch = reactRouterDom.matchPath(route.path, pathName);
+    if (isMatch) {
+      const needCache = evaluate(route.isNeedCache, false);
+      const hasContentRendered = Boolean(evaluate(route.content, null));
+      const updated = !updateTime ? true : updateTime === route._updateTime;
+      return needCache && hasContentRendered && updated;
+    }
+  }
+  return false;
+};
+
+// src/feature/page-route/component/keep-alive-outlet/utils/outlets.ts
+var getValidOutlets = (routesConfig, pathname, outlets) => {
+  outlets.forEach((outletData) => {
+    const needRefresh = !(outletData.isCacheItem && isNeedCache(routesConfig, outletData.pathname, outletData?.updateTime));
+    if (needRefresh) {
+      outletData.outlet = null;
+    }
+  });
+  const newOutlets = outlets.filter((item) => item.outlet);
+  return newOutlets;
+};
+
+// src/feature/page-route/component/keep-alive-outlet/index.tsx
+var OutletWrapper = ({ visible, updateTime, path, children }) => {
+  const { uiConfigurationService } = React3.useContext(GlobalContext);
+  React3.useEffect(() => {
+    uiConfigurationService.uiManager[PageRouteManagerSymbol].notifyPageRendered(path);
+  }, [path, visible, updateTime]);
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, children);
+};
+function KeepAliveOutlet({ fallback, routesConfig }) {
+  const { uiConfigurationService } = React3.useContext(GlobalContext);
+  const location = reactRouterDom.useLocation();
+  const outlet = reactRouterDom.useOutlet();
+  const initRef = React3.useRef(true);
+  const handleNotifyActivateRoute = (pathName) => {
+    uiConfigurationService.uiManager[PageRouteManagerSymbol].activateKeepAliveRoute(pathName, location.state);
+  };
+  const calcOutlets = (tempOutlets) => {
+    handleNotifyActivateRoute(location.pathname);
+    const validTempOutlets = getValidOutlets(routesConfig, location.pathname, tempOutlets);
+    let result = validTempOutlets.find((o) => isEqualStr(o.pathname, location.pathname));
+    const isCacheItem = isNeedCache(routesConfig, location.pathname);
+    const notUpdated = routesConfig.reduce((bool, _config) => {
+      if (!bool) {
+        return false;
+      }
+      if (!_config._updateTime) {
+        return true;
+      }
+      return tempOutlets.find((item) => item.pathname === location.pathname)?.updateTime === _config._updateTime;
+    }, true);
+    if (result && isCacheItem && notUpdated) {
+      return validTempOutlets;
+    }
+    if (!result) {
+      const route = uiConfigurationService.uiManager[PageRouteManagerSymbol].getRouteConfigByPath(
+        location.pathname
+      );
+      result = {
+        key: location.key,
+        pathname: location.pathname,
+        updateTime: route?._updateTime,
+        isCacheItem,
+        outlet
+      };
+      validTempOutlets.push(result);
+    }
+    return validTempOutlets;
+  };
+  const [outlets, setOutlets] = React3.useState(
+    // eslint-disable-next-line no-nested-ternary
+    uiConfigurationService.uiManager[PageRouteManagerSymbol].pendingNavigateOptions ? [] : initRef.current ? calcOutlets([]) : []
+  );
+  initRef.current = false;
+  React3.useEffect(() => {
+    setOutlets(calcOutlets);
+  }, [location.pathname, routesConfig]);
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, outlets.map((o) => {
+    const visibilityMode = isEqualStr(o.pathname, location.pathname) ? "visible" : "hidden";
+    return /* @__PURE__ */ React.createElement(Offscreen, { key: o.key, mode: visibilityMode, fallback: fallback || null }, /* @__PURE__ */ React.createElement(
+      OutletWrapper,
+      {
+        updateTime: o.updateTime,
+        path: location.pathname,
+        visible: visibilityMode === "visible"
+      },
+      o.outlet
+    ));
+  }));
+}
+var OutletWrapper2 = ({ visible, updateTime, path, children }) => {
+  const { uiConfigurationService } = React3.useContext(GlobalContext);
+  React3.useEffect(() => {
+    uiConfigurationService.uiManager[PageRouteManagerSymbol].notifyPageRendered(path);
+  }, [path, visible, updateTime]);
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, children);
+};
+function KeepAliveSingleOutlet({ fallback, routesConfig }) {
+  const { uiConfigurationService } = React3.useContext(GlobalContext);
+  const location = reactRouterDom.useLocation();
+  const outlet = reactRouterDom.useOutlet();
+  const handleNotifyActivateRoute = (pathName) => {
+    uiConfigurationService.uiManager[PageRouteManagerSymbol].activateKeepAliveRoute(pathName, location.state);
+  };
+  const calcOutlets = ahooks.useMemoizedFn((tempOutlets) => {
+    handleNotifyActivateRoute(location.pathname);
+    const validTempOutlets = getValidOutlets(routesConfig, location.pathname, tempOutlets);
+    let result = validTempOutlets.find((o) => isEqualStr(o.pathname, location.pathname));
+    const isCacheItem = isNeedCache(routesConfig, location.pathname);
+    const notUpdated = routesConfig.reduce((bool, _config) => {
+      if (!bool) {
+        return false;
+      }
+      if (!_config._updateTime) {
+        return true;
+      }
+      return tempOutlets.find((item) => item.pathname === location.pathname)?.updateTime === _config._updateTime;
+    }, true);
+    if (result && isCacheItem && notUpdated) {
+      return validTempOutlets;
+    }
+    if (!result) {
+      const route = uiConfigurationService.uiManager[PageRouteManagerSymbol].getRouteConfigByPath(
+        location.pathname
+      );
+      result = {
+        key: location.key,
+        pathname: location.pathname,
+        updateTime: route?._updateTime,
+        isCacheItem,
+        outlet
+      };
+      validTempOutlets.push(result);
+    }
+    return validTempOutlets;
+  });
+  const outlets = React3.useMemo(() => {
+    if (uiConfigurationService.uiManager[PageRouteManagerSymbol].pendingNavigateOptions) {
+      return [];
+    }
+    return calcOutlets([]);
+  }, [
+    uiConfigurationService.uiManager[PageRouteManagerSymbol].pendingNavigateOptions,
+    location.pathname,
+    routesConfig,
+    calcOutlets
+  ]);
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, outlets.map((o) => {
+    const visibilityMode = isEqualStr(o.pathname, location.pathname) ? "visible" : "hidden";
+    return /* @__PURE__ */ React.createElement(Offscreen, { key: o.key, mode: visibilityMode, fallback: fallback || null }, /* @__PURE__ */ React.createElement(
+      OutletWrapper2,
+      {
+        updateTime: o.updateTime,
+        path: location.pathname,
+        visible: visibilityMode === "visible"
+      },
+      o.outlet
+    ));
+  }));
+}
+
+// src/feature/page-route/page-route-manager.tsx
+var PageRouteManager = class extends BaseUiManager {
+  constructor() {
+    super(...arguments);
+    this.observableData = valtio.proxy({
+      currentRoute: void 0,
+      configs: [],
+      keepAliveStatusMap: {},
+      historyRoutes: [],
+      containerWidth: 0
+    });
+    this._locker = new InitAwaitLock();
+    this._onWouldRouteChange = new event.Emitter();
+    this.onWouldRouteChange = this._onWouldRouteChange.event;
+    this._onKeepAliveChange = new event.Emitter();
+    this.onKeepAliveChange = this._onKeepAliveChange.event;
+    this._onPageRendered = new event.Emitter();
+    this.onPageRendered = this._onPageRendered.event;
+    this._onPageContainerWidthChange = new event.Emitter();
+    this.onPageContainerWidthChange = this._onPageContainerWidthChange.event;
+    // fix: 修复个人页刷新打开埋点参数上报错误
+    this._onRouteConfigChange = new event.Emitter();
+    this.onRouteConfigChange = this._onRouteConfigChange.event;
+  }
+  get pendingNavigateOptions() {
+    return this._pendingNavigateOptions;
+  }
+  get currentRoute() {
+    return this.getRouteConfigByPath(this.observableData.currentRoute);
+  }
+  registerConfig(configs) {
+    configs.forEach((config) => {
+      const idx = this.observableData.configs.findIndex((item) => item.id === config.id);
+      if (idx !== -1) {
+        this.observableData.configs[idx] = lodashEs.merge(this.observableData.configs[idx], config, {
+          _updateTime: Date.now()
+        });
+      } else {
+        this.observableData.configs.push(
+          lodashEs.merge({}, config, {
+            _updateTime: 0
+          })
+        );
+      }
+    });
+    this._onRouteConfigChange.fire(valtio.snapshot(this.observableData.configs));
+  }
+  updatePageRoute(path) {
+    const routesLength = this.observableData.historyRoutes.length;
+    if (this.observableData.historyRoutes[routesLength - 1] !== path) {
+      this.observableData.historyRoutes.push(path);
+    }
+    const preRoute = this.getRouteConfigByPath(this.observableData.currentRoute);
+    const setRoute = this.getRouteConfigByPath(path);
+    if (preRoute?.id !== setRoute?.id) {
+      if (preRoute) {
+        preRoute?.onActiveChange?.({ active: false });
+      }
+      setRoute?.onActiveChange?.({ active: true });
+    }
+    this.observableData.currentRoute = path;
+  }
+  navigate(id, options) {
+    const path = this.generatePath(id, options);
+    if (!path) {
+      assert.lvAssert(path);
+    }
+    const runner = runnerBuilder({
+      middleware: this._middlewareManager,
+      trigger: PageRouteManagerSymbol,
+      method: "shouldInterceptNavigate",
+      uiConfig: { id, path }
+    });
+    const interceptRes = runner.run();
+    if (runner.isStop || interceptRes) {
+      return;
+    }
+    this._navigateByPath(path, options);
+  }
+  _navigateByPath(path, options) {
+    if (!this._locker.hasBeenDone) {
+      this._pendingNavigateOptions = {
+        path,
+        options
+      };
+    } else {
+      this._onWouldRouteChange.fire(path, options);
+    }
+  }
+  updateContainerWidth(width) {
+    this.observableData.containerWidth = width;
+  }
+  initDone() {
+    if (this._locker.hasBeenDone) {
+      return;
+    }
+    this._pendingNavigateOptions = void 0;
+    this._locker.initDone();
+  }
+  navigateBack(to = -1) {
+    this._onWouldRouteChange.fire(to);
+  }
+  generatePath(id, options) {
+    const target = this.observableData.configs.find((item) => item.id === id);
+    if (!target) {
+      assert.lvAssert(target);
+    }
+    const compiler = pathToRegexp.compile(target.path);
+    let result = compiler(options?.params ?? {});
+    const query = typeof options?.query === "string" ? options.query : queryStringify(options?.query ?? {});
+    if (query.length !== 0) {
+      result += query.includes("?") ? query : `?${query}`;
+    }
+    return result;
+  }
+  activateKeepAliveRoute(activatePathName, locationState) {
+    if (activatePathName === this.currentKeepAliveData?.pathName && Object.values(this.observableData.keepAliveStatusMap).length > 0) {
+      return;
+    }
+    const allAlivePathName = Object.keys(this.observableData.keepAliveStatusMap);
+    for (const alivePathName of allAlivePathName) {
+      if (isEqualStr(alivePathName, activatePathName)) {
+        continue;
+      }
+      this._updateKeepAliveStatus(alivePathName, "InActivated" /* InActivated */);
+    }
+    this._updateKeepAliveStatus(activatePathName, "Activated" /* Activated */, locationState);
+  }
+  _updateKeepAliveStatus(pathName, status, locationState) {
+    const lastStatusVal = this.observableData.keepAliveStatusMap[pathName];
+    const lastStatus = lastStatusVal?.status;
+    const matchRoteConfig = this.observableData.configs.find((item) => reactRouterDom.matchPath(item.path, pathName));
+    const newStatusVal = {
+      pathName,
+      status,
+      routeId: matchRoteConfig?.id ?? "NOT_FOUND",
+      locationState
+    };
+    this.observableData.keepAliveStatusMap[pathName] = newStatusVal;
+    if (status !== lastStatus) {
+      this._onKeepAliveChange.fire(newStatusVal);
+    }
+  }
+  get currentKeepAliveData() {
+    const { keepAliveStatusMap, currentRoute = "" } = this.observableData;
+    return Object.values(keepAliveStatusMap).find((item) => item.status === "Activated" /* Activated */);
+  }
+  notifyPageRendered(config) {
+    if (typeof config === "string") {
+      const routeConfig = this.getRouteConfigByPath(config);
+      this._onPageRendered.fire(routeConfig ? valtio.snapshot(routeConfig) : routeConfig);
+    } else {
+      this._onPageRendered.fire(config);
+    }
+  }
+  getRouteConfigByPath(path) {
+    if (!path) {
+      return void 0;
+    }
+    return this.observableData.configs.find((item) => reactRouterDom.matchPath(item.path, path));
+  }
+  render(options) {
+    return /* @__PURE__ */ React.createElement(PageRoute, { layout: options.layout });
+  }
+  renderOutlet(options) {
+    return /* @__PURE__ */ React.createElement(KeepAliveOutlet, { ...options });
+  }
+  renderSingleOutlet(options) {
+    return /* @__PURE__ */ React.createElement(KeepAliveSingleOutlet, { ...options });
+  }
+  _middlewareChange(props) {
+  }
+};
+var useKeepAliveEffect = (cb) => {
+  const { uiConfigurationService } = React3.useContext(GlobalContext);
+  const location = reactRouterDom.useLocation();
+  const initedLocationPathName = React3.useRef(location.pathname);
+  const disposeCb = React3.useRef(null);
+  const handleTrggerEffect = (data) => {
+    if (!data) {
+      return;
+    }
+    if (data.pathName !== initedLocationPathName.current) {
+      return;
+    }
+    if (data.status === "Activated" /* Activated */) {
+      disposeCb.current = cb?.();
+    } else {
+      disposeCb.current?.();
+    }
+  };
+  React3.useEffect(() => {
+    const pageRouteManager = uiConfigurationService.uiManager[PageRouteManagerSymbol];
+    handleTrggerEffect(pageRouteManager.currentKeepAliveData);
+    const diposeEvent = pageRouteManager.onKeepAliveChange((data) => {
+      handleTrggerEffect(data);
+    });
+    return () => {
+      diposeEvent.dispose();
+      disposeCb.current?.();
+    };
+  }, []);
+};
+var useKeepAliveLayoutEffect = (cb) => {
+  const { uiConfigurationService } = React3.useContext(GlobalContext);
+  const location = reactRouterDom.useLocation();
+  const initedLocationPathName = React3.useRef(location.pathname);
+  const disposeCb = React3.useRef(null);
+  const handleTrggerEffect = (data) => {
+    if (!data) {
+      return;
+    }
+    if (data.pathName !== initedLocationPathName.current) {
+      return;
+    }
+    if (data.status === "Activated" /* Activated */) {
+      disposeCb.current = cb?.();
+    } else {
+      disposeCb.current?.();
+    }
+  };
+  React3.useLayoutEffect(() => {
+    const pageRouteManager = uiConfigurationService.uiManager[PageRouteManagerSymbol];
+    handleTrggerEffect(pageRouteManager.currentKeepAliveData);
+    const diposeEvent = pageRouteManager.onKeepAliveChange((data) => {
+      handleTrggerEffect(data);
+    });
+    return () => {
+      diposeEvent.dispose();
+      disposeCb.current?.();
+    };
+  }, []);
+};
+var usePageContainerWidth = () => {
+  const { uiConfigurationService } = React3.useContext(GlobalContext);
+  return useObserverSelector(uiConfigurationService.uiManager[PageRouteManagerSymbol], (manager) => {
+    return manager.observableData.containerWidth;
+  });
+};
+function navigate(platformUiConfiguration, to, options) {
+  const pageRouteManager = platformUiConfiguration.uiManager[PageRouteManagerSymbol];
+  switch (true) {
+    case (typeof to === "string" || typeof to === "object"):
+      if (typeof to === "object") {
+        to = reactRouterDom.createPath(to);
+      }
+      const path = reactRouterDom.parsePath(to);
+      const routesConfig = pageRouteManager.observableData.configs;
+      const matchItem = routesConfig.find((item) => reactRouterDom.matchPath(item.path, path?.pathname ?? ""));
+      if (!matchItem) {
+        return;
+      }
+      const matchRes = Object.entries(reactRouterDom.matchPath(matchItem.path, path?.pathname ?? "")?.params ?? {}).reduce((pre, cur) => {
+        const [key, value] = cur;
+        if (!key || !value) {
+          return pre;
+        }
+        pre[key] = value;
+        return pre;
+      }, {});
+      pageRouteManager.navigate(matchItem.id, {
+        query: path.search,
+        params: matchRes,
+        ...options
+      });
+      break;
+    case typeof to === "number":
+      pageRouteManager.navigateBack(to);
+      break;
+  }
+}
+var useNavigateFactory = (uiConfigurationService) => {
+  const useNavigate2 = ahooks.useMemoizedFn((to, options) => {
+    navigate(uiConfigurationService, to, options);
+  });
+  return useNavigate2;
+};
+
+// src/feature/block-content/block-content-manager.interface.ts
+var BlockContentManagerSymbol = "BlockContent";
+
+// src/feature/block-content/component/block-content.module.scss
+var block_content_module_default = {};
+
+// src/feature/block-content/component/block-content.tsx
+var BlockContentComponent = React3__default.default.memo(() => {
+  const { uiConfigurationService } = React3.useContext(GlobalContext);
+  const activeBlockContentConfig = useObserverSelector(
+    uiConfigurationService.uiManager[BlockContentManagerSymbol],
+    (manager) => {
+      const { activeId, configs } = manager.observableData;
+      return configs.find((item) => item.id === activeId);
+    }
+  );
+  const containerRef = React3.useRef(null);
+  return /* @__PURE__ */ React3__default.default.createElement(
+    "div",
+    {
+      ref: containerRef,
+      className: cs__default.default(block_content_module_default.container, evaluate(activeBlockContentConfig?.className, ""))
+    },
+    evaluate(activeBlockContentConfig?.content, null)
+  );
+});
+var BlockContent = BlockContentComponent;
+
+// src/feature/block-content/block-content-manager.tsx
+var BlockContentManager = class extends BaseUiManager {
+  constructor() {
+    super(...arguments);
+    this.observableData = valtio.proxy({
+      forceUpdate: 0,
+      activeId: void 0,
+      configs: []
+    });
+  }
+  registerConfig(configs) {
+    configs.forEach((config) => {
+      const idx = this.observableData.configs.findIndex((item) => item.id === config.id);
+      if (idx !== -1) {
+        this.observableData.configs[idx] = lodashEs.merge(this.observableData.configs[idx], config);
+      } else {
+        assert.lvAssertNotNil(
+          config.id,
+          `The "id" attribute is required when registering "UiManagerName.BlockContent"`
+        );
+        this.observableData.configs.push(config);
+      }
+    });
+    if (!(this.observableData.activeId && this.observableData.configs.find((item) => item.id === this.observableData.activeId))) {
+      this.observableData.activeId = this.observableData.configs[0]?.id;
+    }
+  }
+  changeActiveId(activeId) {
+    this.observableData.activeId = activeId;
+  }
+  render() {
+    return /* @__PURE__ */ React.createElement(BlockContent, null);
+  }
+  _middlewareChange() {
+    this.observableData.forceUpdate++;
+  }
+};
+
+Object.defineProperty(exports, "Navigate", {
+  enumerable: true,
+  get: function () { return reactRouterDom.Navigate; }
+});
+Object.defineProperty(exports, "matchPath", {
+  enumerable: true,
+  get: function () { return reactRouterDom.matchPath; }
+});
+Object.defineProperty(exports, "parsePath", {
+  enumerable: true,
+  get: function () { return reactRouterDom.parsePath; }
+});
+Object.defineProperty(exports, "resolvePath", {
+  enumerable: true,
+  get: function () { return reactRouterDom.resolvePath; }
+});
+Object.defineProperty(exports, "useLocation", {
+  enumerable: true,
+  get: function () { return reactRouterDom.useLocation; }
+});
+Object.defineProperty(exports, "useSearchParams", {
+  enumerable: true,
+  get: function () { return reactRouterDom.useSearchParams; }
+});
+exports.BaseSetting = BaseSetting;
+exports.BaseUiManager = BaseUiManager;
+exports.BlockContentManager = BlockContentManager;
+exports.BlockContentManagerSymbol = BlockContentManagerSymbol;
+exports.GlobalContext = GlobalContext;
+exports.KeepAliveStatus = KeepAliveStatus;
+exports.MiddlewareManager = MiddlewareManager;
+exports.OrderLevel = OrderLevel;
+exports.PageRouteManager = PageRouteManager;
+exports.PageRouteManagerSymbol = PageRouteManagerSymbol;
+exports.evaluate = evaluate;
+exports.mergeUiConfigs = mergeUiConfigs;
+exports.runnerBuilder = runnerBuilder;
+exports.sortListBySettings = sortListBySettings;
+exports.useKeepAliveEffect = useKeepAliveEffect;
+exports.useKeepAliveLayoutEffect = useKeepAliveLayoutEffect;
+exports.useNavigateFactory = useNavigateFactory;
+exports.usePageContainerWidth = usePageContainerWidth;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map