@modern-js/runtime 1.21.5 → 2.0.0-beta.1

package/dist/js/node/router/runtime/plugin.js

@@ -4,46 +4,22 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.routerPlugin = void 0;
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _history = require("history");
-
+var _react = _interopRequireDefault(require("react"));
 var _reactRouterDom = require("react-router-dom");
-
 var _hoistNonReactStatics = _interopRequireDefault(require("hoist-non-react-statics"));
-
-var _core = require("../../core");
-
-var _common = require("../../common");
-
 var _utils = require("./utils");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 const routerPlugin = ({
   serverBase: _serverBase = [],
-  history: customHistory,
   supportHtml5History: _supportHtml5History = true,
   routesConfig,
-  historyOptions: _historyOptions = {}
+  createRoutes
 }) => {
-  const isBrow = (0, _common.isBrowser)();
-
   const select = pathname => _serverBase.find(baseUrl => pathname.search(baseUrl) === 0) || '/';
-
   return {
     name: '@modern-js/plugin-router',
     setup: () => {
@@ -51,54 +27,37 @@ const routerPlugin = ({
         hoc: ({
           App
         }, next) => {
+          // can not get routes config, skip wrapping React Router.
+          // e.g. App.tsx as the entrypoint
+          if (!routesConfig) {
+            return next({
+              App
+            });
+          }
           const getRouteApp = () => {
-            if (isBrow) {
+            return props => {
               var _window$_SERVER_DATA;
-
+              const routeElements = (0, _utils.renderRoutes)(routesConfig);
+              const routes = createRoutes ? createRoutes() : (0, _reactRouterDom.createRoutesFromElements)(routeElements);
               const baseUrl = ((_window$_SERVER_DATA = window._SERVER_DATA) === null || _window$_SERVER_DATA === void 0 ? void 0 : _window$_SERVER_DATA.router.baseUrl) || select(location.pathname);
-              _historyOptions.basename = baseUrl === '/' ? (0, _utils.urlJoin)(baseUrl, _historyOptions.basename) : baseUrl;
-              const history = customHistory || (_supportHtml5History ? (0, _history.createBrowserHistory)(_historyOptions) : (0, _history.createHashHistory)(_historyOptions));
-              return props => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRouterDom.Router, {
-                history: history,
-                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(App, _objectSpread(_objectSpread({}, props), {}, {
-                  children: routesConfig ? (0, _utils.renderRoutes)(routesConfig, props) : null
-                }))
-              });
-            }
-
-            return props => {
-              const runtimeContext = (0, _react.useContext)(_core.RuntimeReactContext);
-              const {
-                ssrContext
-              } = runtimeContext;
-              const location = (0, _utils.getLocation)(ssrContext);
-              const routerContext = (ssrContext === null || ssrContext === void 0 ? void 0 : ssrContext.redirection) || {};
-              const request = ssrContext === null || ssrContext === void 0 ? void 0 : ssrContext.request;
-              const baseUrl = request === null || request === void 0 ? void 0 : request.baseUrl;
-              const basename = baseUrl === '/' ? (0, _utils.urlJoin)(baseUrl, _historyOptions.basename) : baseUrl;
-              return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRouterDom.StaticRouter, {
-                basename: basename === '/' ? '' : basename,
-                location: location,
-                context: routerContext,
-                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(App, _objectSpread(_objectSpread({}, props), {}, {
-                  children: routesConfig ? (0, _utils.renderRoutes)(routesConfig, props) : null
-                }))
+              const router = _supportHtml5History ? (0, _reactRouterDom.createBrowserRouter)(routes, {
+                basename: baseUrl
+              }) : (0, _reactRouterDom.createHashRouter)(routes, {
+                basename: baseUrl
               });
+              return /*#__PURE__*/(0, _jsxRuntime.jsx)(App, _objectSpread(_objectSpread({}, props), {}, {
+                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRouterDom.RouterProvider, {
+                  router: router
+                })
+              }));
             };
           };
-
-          let RouteApp = getRouteApp();
-
-          if (App) {
-            RouteApp = (0, _hoistNonReactStatics.default)(RouteApp, App);
-          }
-
-          if (routesConfig !== null && routesConfig !== void 0 && routesConfig.globalApp) {
+          const RouteApp = getRouteApp();
+          if (routesConfig.globalApp) {
             return next({
               App: (0, _hoistNonReactStatics.default)(RouteApp, routesConfig.globalApp)
             });
           }
-
           return next({
             App: RouteApp
           });
@@ -107,5 +66,4 @@ const routerPlugin = ({
     }
   };
 };
-
 exports.routerPlugin = routerPlugin;

package/dist/js/node/router/runtime/plugin.node.js

@@ -0,0 +1,147 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createFetchHeaders = createFetchHeaders;
+exports.routerPlugin = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _router = require("@remix-run/router");
+var _server = require("react-router-dom/server");
+var _hoistNonReactStatics = _interopRequireDefault(require("hoist-non-react-statics"));
+var _node = require("@remix-run/node");
+var _reactRouterDom = require("react-router-dom");
+var _core = require("../../core");
+var _utils = require("./utils");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+// Polyfill Web Fetch API
+(0, _node.installGlobals)();
+
+// TODO: polish
+function createFetchRequest(req) {
+  // const origin = `${req.protocol}://${req.get('host')}`;
+  const origin = `${req.protocol}://${req.host}`;
+  // Note: This had to take originalUrl into account for presumably vite's proxying
+  const url = new URL(req.originalUrl || req.url, origin);
+  const controller = new AbortController();
+
+  // req.on('close', () => {
+  //   controller.abort();
+  // });
+
+  const init = {
+    method: req.method,
+    headers: createFetchHeaders(req.headers),
+    signal: controller.signal
+  };
+
+  // if (req.method !== 'GET' && req.method !== 'HEAD') {
+  //   init.body = req.body;
+  // }
+
+  return new Request(url.href, init);
+}
+function createFetchHeaders(requestHeaders) {
+  const headers = new Headers();
+  for (const [key, values] of Object.entries(requestHeaders)) {
+    if (values) {
+      if (Array.isArray(values)) {
+        for (const value of values) {
+          headers.append(key, value);
+        }
+      } else {
+        headers.set(key, values);
+      }
+    }
+  }
+  return headers;
+}
+const routerPlugin = ({
+  routesConfig,
+  createRoutes
+}) => {
+  return {
+    name: '@modern-js/plugin-router',
+    setup: () => {
+      return {
+        async init({
+          context
+        }, next) {
+          // can not get routes config, skip wrapping React Router.
+          // e.g. App.tsx as the entrypoint
+          if (!routesConfig) {
+            return next({
+              context
+            });
+          }
+          const {
+            request
+          } = context.ssrContext;
+          const routeElements = (0, _utils.renderRoutes)(routesConfig);
+          const routes = createRoutes ? createRoutes() : (0, _reactRouterDom.createRoutesFromElements)(routeElements);
+          const {
+            query
+          } = (0, _router.unstable_createStaticHandler)(routes);
+          const remixRequest = createFetchRequest(request);
+          const routerContext = await query(remixRequest);
+          if (routerContext instanceof Response) {
+            // React Router would return a Response when redirects occur in loader.
+            // Throw the Response to bail out and let the server handle it with an HTTP redirect
+            return routerContext;
+          }
+          const router = (0, _server.unstable_createStaticRouter)(routes, routerContext);
+          context.router = router;
+          context.routerContext = routerContext;
+          context.routes = routes;
+          // set routeManifest in context to be consistent with csr context
+          context.routeManifest = context.ssrContext.routeManifest;
+          return next({
+            context
+          });
+        },
+        hoc: ({
+          App
+        }, next) => {
+          // can not get routes config, skip wrapping React Router.
+          // e.g. App.tsx as the entrypoint
+          if (!routesConfig) {
+            return next({
+              App
+            });
+          }
+          const getRouteApp = () => {
+            return props => {
+              const {
+                router,
+                routerContext
+              } = (0, _react.useContext)(_core.RuntimeReactContext);
+              return /*#__PURE__*/(0, _jsxRuntime.jsx)(App, _objectSpread(_objectSpread({}, props), {}, {
+                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_server.unstable_StaticRouterProvider, {
+                  router: router,
+                  context: routerContext,
+                  nonce: "the-nonce"
+                })
+              }));
+            };
+          };
+          const RouteApp = getRouteApp();
+          if (routesConfig.globalApp) {
+            return next({
+              App: (0, _hoistNonReactStatics.default)(RouteApp, routesConfig.globalApp)
+            });
+          }
+          return next({
+            App: RouteApp
+          });
+        }
+      };
+    }
+  };
+};
+exports.routerPlugin = routerPlugin;

package/dist/js/node/router/runtime/root/index.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RootLayout = RootLayout;
+var _react = _interopRequireWildcard(require("react"));
+var _reactRouterDom = require("react-router-dom");
+var _core = require("../../../core");
+var _load = require("./load");
+var _jsxRuntime = require("react/jsx-runtime");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function RootLayout(props) {
+  const location = (0, _reactRouterDom.useLocation)();
+  const context = (0, _react.useContext)(_core.RuntimeReactContext);
+  (0, _react.useEffect)(() => {
+    const {
+      routes
+    } = props;
+    (0, _load.handleLoad)(routes, location, context.routeManifest);
+  }, [location]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+    children: props.children
+  });
+}

package/dist/js/node/router/runtime/root/load.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.handleLoad = handleLoad;
+exports.loadRouteModule = loadRouteModule;
+exports.matchClientRoutes = matchClientRoutes;
+var _reactRouterDom = require("react-router-dom");
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+class Logger {
+  static getLogger(options) {
+    if (this.logger) {
+      return this.logger;
+    }
+    this.logger = new Logger(options);
+    return this.logger;
+  }
+  constructor(options) {
+    _defineProperty(this, "enableLogging", void 0);
+    this.enableLogging = options.enableLogging;
+  }
+  log(...args) {
+    if (this.enableLogging) {
+      // eslint-disable-next-line no-console
+      console.log(...args);
+    }
+  }
+}
+_defineProperty(Logger, "logger", void 0);
+function handleLoad(routes, location, routeManifest) {
+  if (!routeManifest || !routeManifest.enableFetchParallel === false) {
+    return;
+  }
+  const {
+    routeAssets
+  } = routeManifest;
+  Logger.getLogger({
+    enableLogging: routeManifest.enableLogging
+  }).log('handle page load');
+  const matches = matchClientRoutes(routes, location);
+  matches === null || matches === void 0 ? void 0 : matches.forEach(match => loadRouteModule(match.route, routeAssets));
+}
+function matchClientRoutes(routes, location) {
+  const matches = (0, _reactRouterDom.matchRoutes)(routes, location);
+  return matches;
+}
+async function loadRouteModule(route, routeAssets) {
+  const routeId = route.id;
+  if (!routeId) {
+    return;
+  }
+  if (!routeAssets[routeId]) {
+    return;
+  }
+  const {
+    chunkIds
+  } = routeAssets[routeId];
+  if (!chunkIds) {
+    return;
+  }
+  try {
+    await Promise.all(chunkIds.map(chunkId => {
+      return __webpack_chunk_load__(String(chunkId));
+    }));
+  } catch (error) {
+    console.error(error);
+  }
+}

package/dist/js/node/router/runtime/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/js/node/router/runtime/utils.js

@@ -4,127 +4,161 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getLocation = getLocation;
+exports.getRouteComponents = getRouteComponents;
 exports.renderRoutes = renderRoutes;
 exports.standardSlash = standardSlash;
 exports.urlJoin = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
+var _react = _interopRequireWildcard(require("react"));
 var _reactRouterDom = require("react-router-dom");
-
 var _DefaultNotFound = require("./DefaultNotFound");
-
+var _root = require("./root");
 var _jsxRuntime = require("react/jsx-runtime");
-
 const _excluded = ["Component"];
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
-function renderRoutes(routesConfig, extraProps = {}) {
+const renderNestedRoute = (nestedRoute, parent) => {
+  const {
+    children,
+    index,
+    id,
+    component: Component
+  } = nestedRoute;
+  const childElements = children === null || children === void 0 ? void 0 : children.map(childRoute => {
+    return renderNestedRoute(childRoute, nestedRoute);
+  });
+  const routeProps = {
+    caseSensitive: nestedRoute.caseSensitive,
+    path: nestedRoute.path,
+    id: nestedRoute.id,
+    loader: nestedRoute.loader,
+    action: nestedRoute.action,
+    hasErrorBoundary: nestedRoute.hasErrorBoundary,
+    shouldRevalidate: nestedRoute.shouldRevalidate,
+    handle: nestedRoute.handle,
+    index: nestedRoute.index,
+    errorElement: nestedRoute.errorElement
+  };
+  if (nestedRoute.error) {
+    const errorElement = /*#__PURE__*/(0, _jsxRuntime.jsx)(nestedRoute.error, {});
+    routeProps.errorElement = errorElement;
+  }
+  let element;
+  if (Component) {
+    if (parent !== null && parent !== void 0 && parent.loading) {
+      const Loading = parent.loading;
+      element = /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Suspense, {
+        fallback: /*#__PURE__*/(0, _jsxRuntime.jsx)(Loading, {}),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {})
+      });
+    } else {
+      element = /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Suspense, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, {})
+      });
+    }
+  }
+  if (!parent) {
+    element = /*#__PURE__*/(0, _jsxRuntime.jsx)(_root.RootLayout, {
+      routes: [nestedRoute],
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.Suspense, {
+        children: element
+      })
+    });
+  }
+  routeProps.element = element;
+  const routeElement = index ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRouterDom.Route, _objectSpread(_objectSpread({}, routeProps), {}, {
+    index: true
+  }), id) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRouterDom.Route, _objectSpread(_objectSpread({}, routeProps), {}, {
+    index: false,
+    children: childElements
+  }), id);
+  return routeElement;
+};
+function getRouteComponents(routes, globalApp) {
   const Layout = _ref => {
     let {
-      Component
-    } = _ref,
-        props = _objectWithoutProperties(_ref, _excluded);
-
-    const GlobalLayout = routesConfig === null || routesConfig === void 0 ? void 0 : routesConfig.globalApp;
-
+        Component
+      } = _ref,
+      props = _objectWithoutProperties(_ref, _excluded);
+    const GlobalLayout = globalApp;
     if (!GlobalLayout) {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, _objectSpread({}, props));
     }
-
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(GlobalLayout, _objectSpread({
       Component: Component
     }, props));
   };
-
-  const findMatchedRoute = pathname => {
-    var _routesConfig$routes;
-
-    return routesConfig === null || routesConfig === void 0 ? void 0 : (_routesConfig$routes = routesConfig.routes) === null || _routesConfig$routes === void 0 ? void 0 : _routesConfig$routes.find(route => {
-      const info = (0, _reactRouterDom.matchPath)(pathname, {
+  const routeElements = [];
+  for (const route of routes) {
+    if (route.type === 'nested') {
+      const routeElement = renderNestedRoute(route);
+      routeElements.push(routeElement);
+    } else {
+      const routeElement = /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRouterDom.Route, {
         path: route.path,
-        exact: route.exact,
-        sensitive: route.sensitive
-      });
-      return Boolean(info);
-    });
-  };
-
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRouterDom.Route, {
-    path: "/",
-    render: props => {
-      const matchedRoute = findMatchedRoute(props.location.pathname);
-
-      if (!matchedRoute) {
-        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_DefaultNotFound.DefaultNotFound, {});
-      }
-
-      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRouterDom.Route, {
-        path: matchedRoute.path,
-        exact: matchedRoute.exact,
-        sensitive: matchedRoute.sensitive,
-        render: routeProps => /*#__PURE__*/(0, _jsxRuntime.jsx)(Layout, _objectSpread(_objectSpread({
-          Component: matchedRoute.component
-        }, routeProps), extraProps))
-      });
+        element: /*#__PURE__*/(0, _jsxRuntime.jsx)(Layout, {
+          Component: route.component
+        })
+      }, route.path);
+      routeElements.push(routeElement);
     }
-  });
+  }
+  routeElements.push( /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRouterDom.Route, {
+    path: "*",
+    element: /*#__PURE__*/(0, _jsxRuntime.jsx)(_DefaultNotFound.DefaultNotFound, {})
+  }, "*"));
+  return routeElements;
+}
+function renderRoutes(routesConfig) {
+  if (!routesConfig) {
+    return null;
+  }
+  const {
+    routes,
+    globalApp
+  } = routesConfig;
+  if (!routes) {
+    return null;
+  }
+  const routeElements = getRouteComponents(routes, globalApp);
+  return routeElements;
 }
-
 function getLocation(serverContext) {
   var _url$replace;
-
   const {
     pathname,
     url
   } = (serverContext === null || serverContext === void 0 ? void 0 : serverContext.request) || {};
   const cleanUrl = url === null || url === void 0 ? void 0 : (_url$replace = url.replace('http://', '')) === null || _url$replace === void 0 ? void 0 : _url$replace.replace('https://', '');
   const index = (cleanUrl || '').indexOf(pathname);
-
   if (index === -1) {
     return pathname;
   }
-
   return cleanUrl.substring(index);
 }
-
 const urlJoin = (...parts) => {
   const separator = '/';
   const replace = new RegExp(`${separator}{1,}`, 'g');
   return standardSlash(parts.join(separator).replace(replace, separator));
 };
-
 exports.urlJoin = urlJoin;
-
 function standardSlash(str) {
   let addr = str;
-
   if (!addr || typeof addr !== 'string') {
     return addr;
   }
-
   if (addr.startsWith('.')) {
     addr = addr.slice(1);
   }
-
   if (!addr.startsWith('/')) {
     addr = `/${addr}`;
   }
-
   if (addr.endsWith('/') && addr !== '/') {
     addr = addr.slice(0, addr.length - 1);
   }
-
   return addr;
 }

package/dist/js/node/router/runtime/withRouter.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.withRouter = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactRouterDom = require("react-router-dom");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+const withRouter = Component => {
+  return props => {
+    const location = (0, _reactRouterDom.useLocation)();
+    const params = (0, _reactRouterDom.useParams)();
+    const navigate = (0, _reactRouterDom.useNavigate)();
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, _objectSpread(_objectSpread({}, props), {}, {
+      location: location,
+      params: params,
+      navigate: navigate
+    }));
+  };
+};
+exports.withRouter = withRouter;

package/dist/js/node/runtime-context.js

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.RuntimeReactContext = void 0;
-
+exports.ServerRouterContext = exports.RuntimeReactContext = void 0;
 var _react = require("react");
-
 const RuntimeReactContext = /*#__PURE__*/(0, _react.createContext)({});
-exports.RuntimeReactContext = RuntimeReactContext;
+exports.RuntimeReactContext = RuntimeReactContext;
+const ServerRouterContext = /*#__PURE__*/(0, _react.createContext)({});
+exports.ServerRouterContext = ServerRouterContext;