@esmx/router 3.0.0-rc.12

package/dist/router.mjs

@@ -0,0 +1,399 @@
+import URLParse from "url-parse";
+import { createHistory } from "./history/index.mjs";
+import { createRouterMatcher } from "./matcher/index.mjs";
+import {
+  RouterMode,
+  StateLayerConfigKey
+} from "./types";
+import { inBrowser, normalizePath, regexDomain } from "./utils/index.mjs";
+const baseValue = Number(Date.now());
+let layerIdOffset = 0;
+function getLatestLayerId() {
+  return baseValue + ++layerIdOffset;
+}
+export class Router {
+  /**
+   * 当前路由对象的上级路由对象
+   */
+  parent = null;
+  /* 路由配置 */
+  options;
+  /**
+   * 路由固定前置路径
+   * 需要注意的是如果使用函数返回 base，需要尽量保证相同的路径返回相同base
+   */
+  base;
+  /* 路由模式 */
+  mode;
+  /* 路由匹配器 */
+  matcher;
+  /* 路由history类 */
+  history;
+  /* 滚动行为 */
+  scrollBehavior;
+  /* 当前路由信息 */
+  route = {
+    href: "",
+    origin: "",
+    host: "",
+    protocol: "",
+    hostname: "",
+    port: "",
+    pathname: "",
+    search: "",
+    hash: "",
+    params: {},
+    query: {},
+    queryArray: {},
+    state: {},
+    meta: {},
+    base: "",
+    path: "",
+    fullPath: "",
+    matched: []
+  };
+  constructor(options) {
+    this.options = options;
+    this.matcher = createRouterMatcher(options.routes || []);
+    this.mode = options.mode || (inBrowser ? RouterMode.HISTORY : RouterMode.ABSTRACT);
+    this.base = options.base || "";
+    this.scrollBehavior = options.scrollBehavior || ((to, from, savedPosition) => {
+      if (savedPosition) return savedPosition;
+      return {
+        left: 0,
+        top: 0
+      };
+    });
+    this.history = createHistory({
+      router: this,
+      mode: this.mode
+    });
+  }
+  /* 更新路由 */
+  updateRoute(route) {
+    var _a, _b, _c, _d, _e, _f;
+    const curAppType = (_b = (_a = this.route) == null ? void 0 : _a.matched[0]) == null ? void 0 : _b.appType;
+    const appType = (_c = route.matched[0]) == null ? void 0 : _c.appType;
+    this.applyRoute(route);
+    const curRegisterConfig = curAppType && this.registeredConfigMap[curAppType];
+    const registerConfig = appType && this.registeredConfigMap[appType];
+    if (registerConfig) {
+      const { mounted, generator } = registerConfig;
+      if (!mounted) {
+        registerConfig.config = generator(this);
+        (_d = registerConfig.config) == null ? void 0 : _d.mount();
+        registerConfig.mounted = true;
+        this.layerMap[this.layerId] = {
+          router: this,
+          config: registerConfig.config,
+          destroyed: false
+        };
+        if (!this.layerConfigList.find(
+          (item) => item.id === this.layerId
+        )) {
+          this.layerConfigList.push({
+            id: this.layerId,
+            depth: 0
+          });
+        }
+      }
+      (_e = registerConfig.config) == null ? void 0 : _e.updated();
+    }
+    if (curAppType !== appType && curRegisterConfig) {
+      (_f = curRegisterConfig.config) == null ? void 0 : _f.destroy();
+      curRegisterConfig.mounted = false;
+    }
+  }
+  /* 应用路由 */
+  applyRoute(route) {
+    let url = "";
+    const { fullPath } = route;
+    if (inBrowser && !regexDomain.test(fullPath)) {
+      url = normalizePath(fullPath, location.origin);
+    } else {
+      url = normalizePath(fullPath);
+    }
+    const {
+      hash,
+      host,
+      hostname,
+      href,
+      origin,
+      pathname,
+      port,
+      protocol,
+      query
+    } = new URLParse(url);
+    Object.assign(
+      this.route,
+      {
+        href,
+        origin,
+        host,
+        protocol,
+        hostname,
+        port,
+        pathname,
+        search: query,
+        hash
+      },
+      route
+    );
+  }
+  /* 解析路由 */
+  resolve(location2) {
+    return this.history.resolve(location2);
+  }
+  /**
+   * 新增单个路由匹配规则
+   */
+  // addRoutes(routes: RouteConfig[]) {
+  //     this.matcher.addRoutes(routes);
+  // }
+  /**
+   * 新增多个路由匹配规则
+   */
+  // addRoute(route: RouteConfig): void {
+  //     this.matcher.addRoute(route);
+  // }
+  /* 初始化 */
+  async init(options = {}) {
+    var _a;
+    const { parent = null, route, replace = true } = options;
+    await this.history.init({
+      replace
+    });
+    const layerId = getLatestLayerId();
+    this.layerId = layerId;
+    let layerMap = {};
+    let layerConfigList = [];
+    if (parent && route) {
+      const appType = (_a = route.matched[0]) == null ? void 0 : _a.appType;
+      if (!appType) return;
+      const registerConfig = parent.registeredConfigMap[appType];
+      if (!registerConfig) return;
+      parent.freeze();
+      this.registeredConfigMap = parent.registeredConfigMap;
+      const { generator } = registerConfig;
+      const config = generator(this);
+      config.mount();
+      config.updated();
+      layerMap = parent.layerMap;
+      layerMap[layerId] = {
+        router: this,
+        config,
+        destroyed: false
+      };
+      layerConfigList = parent.layerConfigList;
+    }
+    if (!layerConfigList.find((item) => item.id === layerId)) {
+      layerConfigList.push({
+        id: layerId,
+        depth: 0
+      });
+    }
+    this.parent = parent;
+    this.layerMap = layerMap;
+    this.layerConfigList = layerConfigList;
+  }
+  /**
+   * 卸载方法
+   */
+  async destroy() {
+  }
+  /* 已注册的app配置 */
+  registeredConfigMap = {};
+  /* app配置注册 */
+  register(name, config) {
+    this.registeredConfigMap[name] = {
+      generator: config,
+      mounted: false
+    };
+  }
+  /* 全局路由守卫 */
+  guards = {
+    beforeEach: [],
+    afterEach: []
+  };
+  /* 注册全局路由前置守卫 */
+  beforeEach(guard) {
+    this.guards.beforeEach.push(guard);
+  }
+  /* 卸载全局路由前置守卫 */
+  unBindBeforeEach(guard) {
+    const i = this.guards.beforeEach.findIndex((item) => item === guard);
+    this.guards.beforeEach.splice(i, 1);
+  }
+  /* 注册全局路由后置守卫 */
+  afterEach(guard) {
+    this.guards.afterEach.push(guard);
+  }
+  /* 卸载全局路由后置守卫 */
+  unBindAfterEach(guard) {
+    const i = this.guards.afterEach.findIndex((item) => item === guard);
+    this.guards.afterEach.splice(i, 1);
+  }
+  /* 路由跳转方法，会创建新的历史记录 */
+  async push(location2) {
+    await this.history.push(location2);
+  }
+  /* 路由跳转方法，会替换当前的历史记录 */
+  async replace(location2) {
+    await this.history.replace(location2);
+  }
+  /**
+   * 当前路由弹层id，用于区分不同的路由弹层
+   */
+  layerId = 0;
+  /**
+   * 路由弹层配置
+   * key为路由弹层id
+   */
+  layerConfigList = [];
+  /**
+   * 路由弹层id与路由实例的map
+   */
+  layerMap = {};
+  /**
+   * 路由是否冻结
+   */
+  isFrozen = false;
+  /**
+   * 路由冻结方法
+   */
+  freeze() {
+    this.isFrozen = true;
+  }
+  /**
+   * 路由解冻方法
+   */
+  unfreeze() {
+    this.isFrozen = false;
+  }
+  /**
+   * 打开路由弹层方法，会创建新的路由实例并调用注册的 register 方法
+   * 服务端会使用 push 作为替代
+   */
+  async pushLayer(location2) {
+    if (this.isFrozen) return;
+    const route = this.resolve(location2);
+    if (route.fullPath === this.route.fullPath) return;
+    if (!inBrowser) {
+      this.push(location2);
+      return;
+    }
+    const router = createRouter({
+      ...this.options,
+      initUrl: route.fullPath
+    });
+    await router.init({ parent: this, route, replace: false });
+  }
+  /**
+   * 更新路由弹层方法
+   * @param state 参数为history.state
+   * @description 没有传入 state 时使用当前配置更新 history.state，传入了 state 时使用传入的 state 更新当前配置
+   */
+  checkLayerState(state) {
+    const stateLayerConfigList = state[StateLayerConfigKey] || [];
+    const layerConfigList = Object.keys(this.layerMap).map(Number);
+    const stateLayerIdList = stateLayerConfigList.map(({ id }) => id).filter((id) => {
+      return layerConfigList.includes(id);
+    });
+    if (stateLayerIdList.length === 0) {
+      return false;
+    }
+    if (stateLayerIdList.length === 1 && stateLayerIdList[0] === this.layerId) {
+      return false;
+    }
+    const createList = [];
+    const destroyList = [];
+    Object.entries(this.layerMap).forEach(([key, value]) => {
+      if (stateLayerIdList.includes(Number(key))) {
+        if (value.destroyed) {
+          createList.push(Number(key));
+        }
+      } else {
+        destroyList.push(Number(key));
+      }
+    });
+    if (createList.length === 0 && destroyList.length === 0) {
+      return false;
+    }
+    const activeId = Math.max(...stateLayerIdList);
+    layerConfigList.forEach((id) => {
+      const { router } = this.layerMap[id];
+      if (activeId === id) {
+        router.unfreeze();
+      } else {
+        router.freeze();
+      }
+    });
+    destroyList.forEach((id) => {
+      const layer = this.layerMap[id];
+      if (!layer.destroyed) {
+        const { router, config } = layer;
+        config.destroy();
+        router.destroy();
+        router.freeze();
+        layer.destroyed = true;
+      }
+    });
+    createList.forEach((id) => {
+      const layer = this.layerMap[id];
+      if (layer.destroyed) {
+        const { router, config } = layer;
+        config.mount();
+        router.unfreeze();
+        layer.destroyed = false;
+      }
+    });
+    this.layerConfigList = stateLayerConfigList;
+    return true;
+  }
+  updateLayerState(route) {
+    const layerConfig = this.layerConfigList.find((item) => {
+      return item.id === this.layerId;
+    });
+    if (layerConfig) layerConfig.depth++;
+    const stateConfigList = this.layerConfigList.filter(({ id }) => {
+      var _a;
+      return !((_a = this.layerMap[id]) == null ? void 0 : _a.destroyed);
+    });
+    const state = {
+      ...history.state,
+      [StateLayerConfigKey]: stateConfigList
+    };
+    window.history.replaceState(state, "", route.fullPath);
+  }
+  /**
+   * 新开浏览器窗口的方法，在服务端会调用 push 作为替代
+   */
+  pushWindow(location2) {
+    this.history.pushWindow(location2);
+  }
+  /**
+   * 替换当前浏览器窗口的方法，在服务端会调用 replace 作为替代
+   */
+  replaceWindow(location2) {
+    this.history.replaceWindow(location2);
+  }
+  /* 前往特定路由历史记录的方法，可以在历史记录前后移动 */
+  go(delta = 0) {
+    this.history.go(delta);
+  }
+  /* 路由历史记录前进方法 */
+  forward() {
+    this.history.forward();
+  }
+  /* 路由历史记录后退方法 */
+  back() {
+    this.history.back();
+  }
+  /* 根据获取当前所有活跃的路由Record对象 */
+  getRoutes() {
+    return this.matcher.getRoutes();
+  }
+}
+export function createRouter(options) {
+  return new Router(options);
+}

package/dist/task-pipe/index.d.ts

@@ -0,0 +1 @@
+export { Tasks, createTasks } from './task';

package/dist/task-pipe/index.mjs

@@ -0,0 +1 @@
+export { Tasks, createTasks } from "./task.mjs";

package/dist/task-pipe/task.d.ts

@@ -0,0 +1,30 @@
+import type { Awaitable } from '../types';
+/**
+ * 创建可操作的任务队列
+ */
+type func = (...args: any) => any;
+/**
+ * 任务状态
+ */
+export declare enum TaskStatus {
+    INITIAL = "initial",
+    RUNNING = "running",
+    FINISHED = "finished",
+    ERROR = "error",
+    ABORTED = "aborted"
+}
+export declare class Tasks<T extends func = func> {
+    protected handlers: T[];
+    add(handler: T | T[]): void;
+    reset(): void;
+    get list(): T[];
+    get length(): number;
+    status: TaskStatus;
+    run({ cb, final }?: {
+        cb?: (res: Awaited<ReturnType<T>>) => Awaitable<void>;
+        final?: () => Awaitable<void>;
+    }): Promise<void>;
+    abort(): void;
+}
+export declare function createTasks<T extends func = func>(): Tasks<T>;
+export {};

package/dist/task-pipe/task.mjs

@@ -0,0 +1,66 @@
+import { warn } from "../utils/index.mjs";
+export var TaskStatus = /* @__PURE__ */ ((TaskStatus2) => {
+  TaskStatus2["INITIAL"] = "initial";
+  TaskStatus2["RUNNING"] = "running";
+  TaskStatus2["FINISHED"] = "finished";
+  TaskStatus2["ERROR"] = "error";
+  TaskStatus2["ABORTED"] = "aborted";
+  return TaskStatus2;
+})(TaskStatus || {});
+export class Tasks {
+  handlers = [];
+  add(handler) {
+    const params = handler instanceof Array ? handler : [handler];
+    this.handlers.push(...params);
+  }
+  reset() {
+    this.handlers = [];
+  }
+  get list() {
+    return this.handlers;
+  }
+  get length() {
+    return this.handlers.length;
+  }
+  status = "initial" /* INITIAL */;
+  async run({
+    cb,
+    final
+  } = {}) {
+    if (this.status !== "initial") {
+      if (process.env.NODE_ENV !== "production") {
+        warn(`task start failed in status ${this.status}`);
+      }
+      return;
+    }
+    this.status = "running" /* RUNNING */;
+    for await (const handler of this.list) {
+      if (this.status === "aborted" /* ABORTED */) {
+        return;
+      }
+      if (typeof handler === "function") {
+        try {
+          const res = await handler();
+          cb && await cb(res);
+        } catch (error) {
+          warn("task error:", error);
+          this.status = "error" /* ERROR */;
+        }
+      } else {
+        warn("task is not a function", handler);
+      }
+    }
+    if (this.status !== "running" /* RUNNING */) return;
+    final && await final();
+    this.status = "finished" /* FINISHED */;
+  }
+  abort() {
+    if (process.env.NODE_ENV !== "production" && this.status === "running" /* RUNNING */) {
+      warn("abort task when task is running");
+    }
+    this.status = "aborted" /* ABORTED */;
+  }
+}
+export function createTasks() {
+  return new Tasks();
+}

package/dist/utils/bom.d.ts

@@ -0,0 +1,5 @@
+/**
+ * 在新窗口打开页面，如果被拦截，则会降级到当前窗口打开
+ * @param url 打开的地址
+ */
+export declare function openWindow(url: string, target?: string): void;

package/dist/utils/bom.mjs

@@ -0,0 +1,10 @@
+export function openWindow(url, target) {
+  try {
+    const newWindow = window.open(url, target);
+    if (!newWindow) {
+      location.href = url;
+    }
+  } catch (e) {
+    location.href = url;
+  }
+}

package/dist/utils/encoding.d.ts

@@ -0,0 +1,48 @@
+export declare const PLUS_RE: RegExp;
+/**
+ * Encode characters that need to be encoded on the hash section of the URL.
+ *
+ * @param text - string to encode
+ * @returns encoded string
+ */
+export declare function encodeHash(text: string): string;
+/**
+ * Encode characters that need to be encoded query values on the query
+ * section of the URL.
+ *
+ * @param text - string to encode
+ * @returns encoded string
+ */
+export declare function encodeQueryValue(text: string | number): string;
+/**
+ * Like `encodeQueryValue` but also encodes the `=` character.
+ *
+ * @param text - string to encode
+ */
+export declare function encodeQueryKey(text: string | number): string;
+/**
+ * Encode characters that need to be encoded on the path section of the URL.
+ *
+ * @param text - string to encode
+ * @returns encoded string
+ */
+export declare function encodePath(text: string | number): string;
+/**
+ * Encode characters that need to be encoded on the path section of the URL as a
+ * param. This function encodes everything {@link encodePath} does plus the
+ * slash (`/`) character. If `text` is `null` or `undefined`, returns an empty
+ * string instead.
+ *
+ * @param text - string to encode
+ * @returns encoded string
+ */
+export declare function encodeParam(text: string | number | null | undefined): string;
+/**
+ * Decode text using `decodeURIComponent`. Returns the original text if it
+ * fails.
+ *
+ * @param text - string to decode
+ * @returns decoded string
+ */
+export declare function decode(text: string | number): string;
+export declare function decodeQuery(text: string): string;

package/dist/utils/encoding.mjs

@@ -0,0 +1,44 @@
+import { warn } from "./warn.mjs";
+const HASH_RE = /#/g;
+const AMPERSAND_RE = /&/g;
+const SLASH_RE = /\//g;
+const EQUAL_RE = /=/g;
+const IM_RE = /\?/g;
+export const PLUS_RE = /\+/g;
+const ENC_BRACKET_OPEN_RE = /%5B/g;
+const ENC_BRACKET_CLOSE_RE = /%5D/g;
+const ENC_CARET_RE = /%5E/g;
+const ENC_BACKTICK_RE = /%60/g;
+const ENC_CURLY_OPEN_RE = /%7B/g;
+const ENC_PIPE_RE = /%7C/g;
+const ENC_CURLY_CLOSE_RE = /%7D/g;
+const ENC_SPACE_RE = /%20/g;
+function commonEncode(text) {
+  return encodeURIComponent("" + text).replace(ENC_PIPE_RE, "|").replace(ENC_BRACKET_OPEN_RE, "[").replace(ENC_BRACKET_CLOSE_RE, "]");
+}
+export function encodeHash(text) {
+  return commonEncode(text).replace(ENC_CURLY_OPEN_RE, "{").replace(ENC_CURLY_CLOSE_RE, "}").replace(ENC_CARET_RE, "^");
+}
+export function encodeQueryValue(text) {
+  return commonEncode(text).replace(PLUS_RE, "%2B").replace(ENC_SPACE_RE, "+").replace(HASH_RE, "%23").replace(AMPERSAND_RE, "%26").replace(ENC_BACKTICK_RE, "`").replace(ENC_CURLY_OPEN_RE, "{").replace(ENC_CURLY_CLOSE_RE, "}").replace(ENC_CARET_RE, "^");
+}
+export function encodeQueryKey(text) {
+  return encodeQueryValue(text).replace(EQUAL_RE, "%3D");
+}
+export function encodePath(text) {
+  return commonEncode(text).replace(HASH_RE, "%23").replace(IM_RE, "%3F");
+}
+export function encodeParam(text) {
+  return text == null ? "" : encodePath(text).replace(SLASH_RE, "%2F");
+}
+export function decode(text) {
+  try {
+    return decodeURIComponent("" + text);
+  } catch (err) {
+    warn(`Error decoding "${text}". Using original value`);
+  }
+  return "" + text;
+}
+export function decodeQuery(text) {
+  return decode(text.replace(PLUS_RE, " "));
+}

package/dist/utils/guards.d.ts

@@ -0,0 +1,9 @@
+import type { RouteRecord } from '../types';
+/**
+ * 判断是否是同一个路由
+ */
+export declare function isSameRoute(from: RouteRecord, to: RouteRecord): any;
+/**
+ * 判断是否是全等的路由: 路径完全相同
+ */
+export declare function isEqualRoute(from: RouteRecord, to: RouteRecord): boolean;

package/dist/utils/guards.mjs

@@ -0,0 +1,12 @@
+export function isSameRoute(from, to) {
+  return from.matched.length === to.matched.length && from.matched.every((record, i) => record === to.matched[i]);
+}
+export function isEqualRoute(from, to) {
+  return (
+    // 这里不仅仅判断了前后的path是否一致
+    // 同时判断了匹配路由对象的个数
+    // 这是因为在首次初始化时 this.current 的值为 { path:'/',matched:[] }
+    // 假如我们打开页面同样为 / 路径时，此时如果单纯判断path那么就会造成无法渲染
+    from.fullPath === to.fullPath && from.matched.length === to.matched.length
+  );
+}

package/dist/utils/index.d.ts

@@ -0,0 +1,7 @@
+export { regexDomain, normalizePath, parsePath, stringifyPath, normalizeLocation, isPathWithProtocolOrDomain } from './path';
+export { isESModule, inBrowser } from './utils';
+export { warn } from './warn';
+export { isSameRoute, isEqualRoute } from './guards';
+export { computeScrollPosition, scrollToPosition, saveScrollPosition, getSavedScrollPosition, getKeepScrollPosition } from './scroll';
+export { openWindow } from './bom';
+export { encodeHash, encodeParam, encodePath, encodeQueryKey, encodeQueryValue, decode } from './encoding';

package/dist/utils/index.mjs

@@ -0,0 +1,27 @@
+export {
+  regexDomain,
+  normalizePath,
+  parsePath,
+  stringifyPath,
+  normalizeLocation,
+  isPathWithProtocolOrDomain
+} from "./path.mjs";
+export { isESModule, inBrowser } from "./utils.mjs";
+export { warn } from "./warn.mjs";
+export { isSameRoute, isEqualRoute } from "./guards.mjs";
+export {
+  computeScrollPosition,
+  scrollToPosition,
+  saveScrollPosition,
+  getSavedScrollPosition,
+  getKeepScrollPosition
+} from "./scroll.mjs";
+export { openWindow } from "./bom.mjs";
+export {
+  encodeHash,
+  encodeParam,
+  encodePath,
+  encodeQueryKey,
+  encodeQueryValue,
+  decode
+} from "./encoding.mjs";