@esmx/router 3.0.0-rc.12 → 3.0.0-rc.120

package/dist/micro-app.mjs

@@ -0,0 +1,132 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import { isBrowser, isPlainObject } from "./util.mjs";
+export function getRootElement(appId) {
+  const el = document.getElementById(appId);
+  if (el) {
+    return el;
+  }
+  const newEl = document.createElement("div");
+  newEl.id = appId;
+  document.body.appendChild(newEl);
+  return newEl;
+}
+export class MicroApp {
+  constructor() {
+    __publicField(this, "app", null);
+    __publicField(this, "root", null);
+    __publicField(this, "_factory", null);
+    __publicField(this, "destroyed", false);
+  }
+  _update(router, force = false) {
+    if (this.destroyed) {
+      throw new Error("MicroApp has been destroyed");
+    }
+    const factory = this._getNextFactory(router);
+    if (!force && factory === this._factory) {
+      return;
+    }
+    const oldApp = this.app;
+    const app = factory ? factory(router) : null;
+    if (isBrowser && app) {
+      let root = this.root;
+      if (root === null) {
+        root = getRootElement(router.appId);
+        const { rootStyle } = router.parsedOptions;
+        if (root && isPlainObject(rootStyle)) {
+          Object.assign(root.style, router.parsedOptions.rootStyle);
+        }
+        this.root = root;
+      }
+      if (root) {
+        const isHydration = root.hasAttribute("data-ssr");
+        if (isHydration) {
+          const appRoot = root.firstElementChild;
+          if (appRoot) {
+            if (app.hydration) {
+              app.hydration(appRoot);
+            } else {
+              throw new Error(
+                "SSR content detected but hydration function not provided"
+              );
+            }
+          } else {
+            const el = document.createElement("div");
+            root.appendChild(el);
+            try {
+              app.mount(el);
+            } catch (e) {
+              el.remove();
+              throw e;
+            }
+          }
+          root.removeAttribute("data-ssr");
+        } else {
+          const oldChildren = Array.from(root.childNodes);
+          const el = document.createElement("div");
+          root.appendChild(el);
+          try {
+            app.mount(el);
+          } catch (e) {
+            el.remove();
+            throw e;
+          }
+          if (oldApp) {
+            try {
+              oldApp.unmount();
+            } catch (e) {
+              console.error(
+                "[@esmx/router] MicroApp unmount failed during route transition. Check the framework unmount hook returned by your render function (Vue: app.unmount, React: root.unmount, etc.).",
+                e
+              );
+            }
+          }
+          oldChildren.forEach((child) => {
+            if (child.parentNode) {
+              child.remove();
+            }
+          });
+        }
+      }
+    }
+    this.app = app;
+    this._factory = factory;
+  }
+  _getNextFactory({
+    route,
+    options
+  }) {
+    if (!route.matched || route.matched.length === 0) {
+      return null;
+    }
+    const name = route.matched[0].app;
+    if (typeof name === "string" && options.apps && typeof options.apps === "object") {
+      return options.apps[name] || null;
+    }
+    if (typeof name === "function") {
+      return name;
+    }
+    if (typeof options.apps === "function") {
+      return options.apps;
+    }
+    return null;
+  }
+  destroy() {
+    var _a;
+    (_a = this.app) == null ? void 0 : _a.unmount();
+    this._clearRoot();
+    this.app = null;
+    this.root = null;
+    this._factory = null;
+    this.destroyed = true;
+  }
+  _clearRoot() {
+    if (!this.root) {
+      return;
+    }
+    Array.from(this.root.childNodes).forEach((child) => {
+      child.remove();
+    });
+  }
+}

package/dist/navigation.d.ts

@@ -0,0 +1,45 @@
+import type { RouterParsedOptions, RouteState } from './types';
+type NavigationSubscribe = (url: string, state: RouteState) => void;
+type NavigationGoResult = null | {
+    type: 'success';
+    url: string;
+    state: RouteState;
+};
+export declare class Navigation {
+    readonly options: RouterParsedOptions;
+    private readonly _history;
+    private readonly _unSubscribePopState;
+    private _promiseResolve;
+    constructor(options: RouterParsedOptions, onUpdated?: NavigationSubscribe);
+    get length(): number;
+    private _push;
+    private _replace;
+    push(data: any, url?: string | URL | null): RouteState;
+    replace(data: any, url?: string | URL | null): RouteState;
+    pushHistoryState(data: any, url?: string | URL | null): void;
+    replaceHistoryState(data: any, url?: string | URL | null): void;
+    backHistoryState(): Promise<NavigationGoResult>;
+    private _go;
+    go(delta?: number): Promise<NavigationGoResult>;
+    forward(): Promise<NavigationGoResult>;
+    back(): Promise<NavigationGoResult>;
+    destroy(): void;
+}
+export declare class MemoryHistory implements History {
+    private _entries;
+    private _index;
+    private get _curEntry();
+    private readonly _popStateCbs;
+    scrollRestoration: ScrollRestoration;
+    get state(): any;
+    get url(): string;
+    constructor();
+    get length(): number;
+    pushState(data: any, unused: string, url?: string | URL | null): void;
+    replaceState(data: any, unused: string, url?: string | URL | null): void;
+    back(): void;
+    forward(): void;
+    go(delta?: number): void;
+    onPopState(cb: NavigationSubscribe): () => void;
+}
+export {};

package/dist/navigation.mjs

@@ -0,0 +1,153 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import { PAGE_ID } from "./increment-id.mjs";
+import { RouterMode } from "./types.mjs";
+const PAGE_ID_KEY = "__pageId__";
+export class Navigation {
+  constructor(options, onUpdated) {
+    __publicField(this, "options");
+    __publicField(this, "_history");
+    __publicField(this, "_unSubscribePopState");
+    __publicField(this, "_promiseResolve", null);
+    const history2 = options.mode === RouterMode.history ? window.history : new MemoryHistory();
+    const onPopStateChange = (url, state) => {
+      const dispatchEvent = this._promiseResolve || onUpdated;
+      dispatchEvent == null ? void 0 : dispatchEvent(url, state);
+    };
+    const subscribePopState = history2 instanceof MemoryHistory ? history2.onPopState(onPopStateChange) : subscribeHtmlHistory(onPopStateChange);
+    this.options = options;
+    this._history = history2;
+    this._unSubscribePopState = subscribePopState;
+  }
+  get length() {
+    return this._history.length;
+  }
+  _push(history2, data, url) {
+    const state = {
+      ...data || {},
+      [PAGE_ID_KEY]: PAGE_ID.next()
+    };
+    history2.pushState(state, "", url);
+    return state;
+  }
+  _replace(history2, data, url) {
+    var _a;
+    const oldId = (_a = history2.state) == null ? void 0 : _a[PAGE_ID_KEY];
+    const state = {
+      ...data || {},
+      [PAGE_ID_KEY]: typeof oldId === "number" ? oldId : PAGE_ID.next()
+    };
+    history2.replaceState(state, "", url);
+    return state;
+  }
+  push(data, url) {
+    return this._push(this._history, data, url);
+  }
+  replace(data, url) {
+    return this._replace(this._history, data, url);
+  }
+  pushHistoryState(data, url) {
+    this._push(history, data, url);
+  }
+  replaceHistoryState(data, url) {
+    this._replace(history, data, url);
+  }
+  backHistoryState() {
+    return this._go(history, -1);
+  }
+  _go(history2, index) {
+    if (this._promiseResolve) {
+      return Promise.resolve(null);
+    }
+    return new Promise((resolve) => {
+      this._promiseResolve = (url, state) => {
+        this._promiseResolve = null;
+        if (typeof url !== "string") return resolve(null);
+        resolve({ type: "success", url, state: state || {} });
+      };
+      setTimeout(this._promiseResolve, 80);
+      history2.go(index);
+    });
+  }
+  go(delta) {
+    return this._go(this._history, delta || 0);
+  }
+  forward() {
+    return this.go(1);
+  }
+  back() {
+    return this.go(-1);
+  }
+  destroy() {
+    var _a;
+    (_a = this._promiseResolve) == null ? void 0 : _a.call(this);
+    this._unSubscribePopState();
+  }
+}
+export class MemoryHistory {
+  constructor() {
+    __publicField(this, "_entries", []);
+    __publicField(this, "_index", -1);
+    __publicField(this, "_popStateCbs", /* @__PURE__ */ new Set());
+    __publicField(this, "scrollRestoration", "auto");
+    this.pushState(null, "", "/");
+  }
+  get _curEntry() {
+    const idx = this._index;
+    if (idx < 0 || idx >= this.length) return null;
+    return this._entries[idx];
+  }
+  // Return null when no current entry to align with browser history.state behavior
+  // Browser history.state can be null when no state was provided
+  get state() {
+    var _a, _b;
+    return (_b = (_a = this._curEntry) == null ? void 0 : _a.state) != null ? _b : null;
+  }
+  get url() {
+    var _a, _b;
+    return (_b = (_a = this._curEntry) == null ? void 0 : _a.url) != null ? _b : "";
+  }
+  get length() {
+    return this._entries.length;
+  }
+  pushState(data, unused, url) {
+    var _a;
+    this._entries.splice(this._index + 1);
+    this._entries.push({ state: data, url: (_a = url == null ? void 0 : url.toString()) != null ? _a : this.url });
+    this._index = this._entries.length - 1;
+  }
+  replaceState(data, unused, url) {
+    const curEntry = this._curEntry;
+    if (!curEntry) return;
+    curEntry.state = { ...data };
+    if (url) curEntry.url = url.toString();
+  }
+  back() {
+    this.go(-1);
+  }
+  forward() {
+    this.go(1);
+  }
+  go(delta) {
+    if (!delta) return;
+    const newIdx = this._index + delta;
+    if (newIdx < 0 || newIdx >= this.length) return;
+    this._index = newIdx;
+    const entry = this._curEntry;
+    setTimeout(() => {
+      this._popStateCbs.forEach((cb) => cb(entry.url, entry.state));
+    });
+  }
+  onPopState(cb) {
+    if (typeof cb !== "function") return () => {
+    };
+    this._popStateCbs.add(cb);
+    return () => this._popStateCbs.delete(cb);
+  }
+}
+function subscribeHtmlHistory(cb) {
+  const wrapper = () => cb(location.href, history.state || {});
+  window.addEventListener("popstate", wrapper);
+  return () => window.removeEventListener("popstate", wrapper);
+}

package/dist/options.d.ts

@@ -0,0 +1,4 @@
+import type { Router } from './router';
+import type { Route, RouterOptions, RouterParsedOptions } from './types';
+export declare function parsedOptions(options?: RouterOptions): RouterParsedOptions;
+export declare function fallback(to: Route, from: Route | null, router: Router): Window | null | undefined;

package/dist/options.mjs

@@ -0,0 +1,95 @@
+import { createMatcher, createRouteMatches } from "./matcher.mjs";
+import { RouterMode } from "./types.mjs";
+import { isBrowser } from "./util.mjs";
+function getBaseUrl(options) {
+  let sourceUrl;
+  if (options.base) {
+    sourceUrl = options.base;
+  } else if (isBrowser) {
+    sourceUrl = location.origin;
+  } else if (options.req) {
+    const { req } = options;
+    const protocol = req.headers["x-forwarded-proto"] || req.headers["x-forwarded-protocol"] || (req.socket && "encrypted" in req.socket && req.socket.encrypted ? "https" : "http");
+    const host = req.headers["x-forwarded-host"] || req.headers.host || req.headers["x-real-ip"] || "localhost";
+    const port = req.headers["x-forwarded-port"];
+    const path = req.url || "";
+    sourceUrl = "".concat(protocol, "://").concat(host).concat(port ? ":".concat(port) : "").concat(path);
+  } else {
+    sourceUrl = "https://esmx.dev/";
+  }
+  let base;
+  try {
+    base = new URL(".", sourceUrl);
+  } catch (e) {
+    console.warn(
+      "Failed to parse base URL '".concat(sourceUrl, "', using default: https://esmx.dev/")
+    );
+    base = new URL("https://esmx.dev/");
+  }
+  base.search = base.hash = "";
+  return base;
+}
+export function parsedOptions(options = {}) {
+  var _a, _b, _c, _d, _e, _f, _g, _h;
+  const base = getBaseUrl(options);
+  const routes = (_a = options.routes) != null ? _a : [];
+  const compiledRoutes = createRouteMatches(routes);
+  return Object.freeze({
+    rootStyle: options.rootStyle || false,
+    appId: options.appId || "app",
+    context: options.context || {},
+    data: options.data || {},
+    req: options.req || null,
+    res: options.res || null,
+    layer: options.layer || false,
+    zIndex: options.zIndex || 1e4,
+    base,
+    mode: isBrowser ? (_b = options.mode) != null ? _b : RouterMode.history : RouterMode.memory,
+    routes,
+    apps: typeof options.apps === "function" ? options.apps : Object.assign({}, options.apps),
+    compiledRoutes,
+    matcher: createMatcher(routes, compiledRoutes),
+    normalizeURL: (_c = options.normalizeURL) != null ? _c : ((url) => url),
+    fallback: (_d = options.fallback) != null ? _d : fallback,
+    nextTick: (_e = options.nextTick) != null ? _e : (() => {
+    }),
+    handleBackBoundary: (_f = options.handleBackBoundary) != null ? _f : (() => {
+    }),
+    handleLayerClose: (_g = options.handleLayerClose) != null ? _g : (() => {
+    }),
+    resolveLink: (_h = options.resolveLink) != null ? _h : ((link) => link)
+  });
+}
+export function fallback(to, from, router) {
+  const href = to.url.href;
+  if (!isBrowser && (router == null ? void 0 : router.res)) {
+    let statusCode = 302;
+    const validRedirectCodes = [300, 301, 302, 303, 304, 307, 308];
+    if (to.statusCode && validRedirectCodes.includes(to.statusCode)) {
+      statusCode = to.statusCode;
+    } else if (to.statusCode) {
+      console.warn(
+        "Invalid redirect status code ".concat(to.statusCode, ", using default 302")
+      );
+    }
+    router.res.statusCode = statusCode;
+    router.res.setHeader("Location", href);
+    router.res.end();
+    return;
+  }
+  if (isBrowser) {
+    if (to.isPush) {
+      try {
+        const newWindow = window.open(href);
+        if (!newWindow) {
+          location.href = href;
+        } else {
+          newWindow.opener = null;
+        }
+        return newWindow;
+      } catch (e) {
+      }
+    }
+    location.href = href;
+  }
+}

package/dist/route-task.d.ts

@@ -0,0 +1,40 @@
+import { Route } from './route';
+import type { Router } from './router';
+import type { RouteConfirmHook } from './types';
+/**
+ * Controls the execution and cancellation of a route task.
+ */
+export declare class RouteTaskController {
+    private _aborted;
+    /**
+     * Aborts the current task.
+     */
+    abort(): void;
+    shouldCancel(name: string): boolean;
+}
+export interface RouteTaskOptions {
+    to: Route;
+    from: Route | null;
+    tasks: RouteTask[];
+    router: Router;
+    /**
+     * Optional route task controller.
+     * Used to control the execution and cancellation of the task.
+     */
+    controller?: RouteTaskController;
+}
+export declare function createRouteTask(opts: RouteTaskOptions): Promise<Route>;
+export declare enum RouteTaskType {
+    fallback = "fallback",
+    override = "override",
+    asyncComponent = "asyncComponent",
+    beforeEach = "beforeEach",
+    beforeEnter = "beforeEnter",
+    beforeUpdate = "beforeUpdate",
+    beforeLeave = "beforeLeave",
+    confirm = "confirm"
+}
+export interface RouteTask {
+    name: string;
+    task: RouteConfirmHook;
+}

package/dist/route-task.mjs

@@ -0,0 +1,77 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import {
+  RouteNavigationAbortedError,
+  RouteSelfRedirectionError,
+  RouteTaskCancelledError,
+  RouteTaskExecutionError
+} from "./error.mjs";
+import { Route } from "./route.mjs";
+import { isUrlEqual, isValidConfirmHookResult } from "./util.mjs";
+export class RouteTaskController {
+  constructor() {
+    __publicField(this, "_aborted", false);
+  }
+  /**
+   * Aborts the current task.
+   */
+  abort() {
+    this._aborted = true;
+  }
+  shouldCancel(name) {
+    return this._aborted;
+  }
+}
+export async function createRouteTask(opts) {
+  const { to, from, tasks, controller, router } = opts;
+  for (const task of tasks) {
+    if (controller == null ? void 0 : controller.shouldCancel(task.name)) {
+      throw new RouteTaskCancelledError(task.name, to, from);
+    }
+    let result = null;
+    try {
+      result = await task.task(to, from, router);
+    } catch (e) {
+      throw new RouteTaskExecutionError(task.name, to, from, e);
+    }
+    if (controller == null ? void 0 : controller.shouldCancel(task.name)) {
+      throw new RouteTaskCancelledError(task.name, to, from);
+    }
+    if (!isValidConfirmHookResult(result)) continue;
+    if (typeof result === "function") {
+      to.handle = result;
+      return to;
+    }
+    if (result === false) {
+      throw new RouteNavigationAbortedError(task.name, to, from);
+    }
+    const nextTo = new Route({
+      options: router.parsedOptions,
+      toType: to.type,
+      toInput: result,
+      from: to.url
+    });
+    if (isUrlEqual(nextTo.url, to.url)) {
+      throw new RouteSelfRedirectionError(to.fullPath, to, from);
+    }
+    return createRouteTask({
+      ...opts,
+      to: nextTo,
+      from: to,
+      controller
+    });
+  }
+  return to;
+}
+export var RouteTaskType = /* @__PURE__ */ ((RouteTaskType2) => {
+  RouteTaskType2["fallback"] = "fallback";
+  RouteTaskType2["override"] = "override";
+  RouteTaskType2["asyncComponent"] = "asyncComponent";
+  RouteTaskType2["beforeEach"] = "beforeEach";
+  RouteTaskType2["beforeEnter"] = "beforeEnter";
+  RouteTaskType2["beforeUpdate"] = "beforeUpdate";
+  RouteTaskType2["beforeLeave"] = "beforeLeave";
+  RouteTaskType2["confirm"] = "confirm";
+  return RouteTaskType2;
+})(RouteTaskType || {});

package/dist/route-transition.d.ts

@@ -0,0 +1,54 @@
+import { Route } from './route';
+import type { Router } from './router';
+import type { RouteConfirmHook, RouteConfirmHookResult, RouteLocationInput, RouteNotifyHook } from './types';
+import { RouteType } from './types';
+/**
+ * Route transition hooks responsible for handling different stages of the navigation process.
+ * Each hook is responsible for a specific aspect of route transition.
+ */
+export declare const ROUTE_TRANSITION_HOOKS: {
+    fallback(to: Route, from: Route | null, router: Router): Promise<RouteConfirmHookResult>;
+    override(to: Route, from: Route | null, router: Router): Promise<RouteConfirmHookResult>;
+    asyncComponent(to: Route, from: Route | null, router: Router): Promise<RouteConfirmHookResult>;
+    beforeLeave(to: Route, from: Route | null, router: Router): Promise<RouteConfirmHookResult>;
+    beforeEnter(to: Route, from: Route | null, router: Router): Promise<RouteConfirmHookResult>;
+    beforeUpdate(to: Route, from: Route | null, router: Router): Promise<RouteConfirmHookResult>;
+    beforeEach(to: Route, from: Route | null, router: Router): Promise<RouteConfirmHookResult>;
+    confirm(to: Route, from: Route | null, router: Router): Promise<RouteConfirmHookResult>;
+};
+/**
+ * Route type handlers configuration.
+ * Maps each route type to its corresponding navigation handler function.
+ * These handlers perform the actual navigation operations like updating browser state,
+ * managing micro-app updates, and handling different navigation patterns.
+ */
+export declare const ROUTE_TYPE_HANDLERS: {
+    push(to: Route, from: Route | null, router: Router): void;
+    replace(to: Route, from: Route | null, router: Router): void;
+    restartApp(to: Route, from: Route | null, router: Router): void;
+    pushWindow(to: Route, from: Route | null, router: Router): unknown;
+    replaceWindow(to: Route, from: Route | null, router: Router): unknown;
+    pushLayer(to: Route, from: Route | null, router: Router): Promise<import("./types").RouteLayerResult>;
+    default(to: Route, from: Route | null, router: Router): void;
+};
+/**
+ * Route Transition Manager
+ * Responsible for managing all route transition logic, including guard execution,
+ * task processing, and status updates.
+ */
+export declare class RouteTransition {
+    private readonly router;
+    route: Route | null;
+    private _controller;
+    readonly guards: {
+        beforeEach: RouteConfirmHook[];
+        afterEach: RouteNotifyHook[];
+    };
+    private destroyed;
+    constructor(router: Router);
+    beforeEach(guard: RouteConfirmHook): () => void;
+    afterEach(guard: RouteNotifyHook): () => void;
+    destroy(): void;
+    to(toType: RouteType, toInput: RouteLocationInput): Promise<Route>;
+    private _runTask;
+}