@modern-js/plugin-garfish 2.0.0-beta.4 → 2.0.0-beta.5

package/dist/js/modern/cli/index.js

@@ -44,6 +44,7 @@ import {
   setRuntimeConfig,
   generateAsyncEntry
 } from "./utils";
+import "./types";
 const externals = { "react-dom": "react-dom", react: "react" };
 function getDefaultMicroFrontedConfig(microFrontend) {
   if (microFrontend === true) {
@@ -181,10 +182,12 @@ var cli_default = ({
         };
       },
       addRuntimeExports() {
-        const addExportStatement = `export { default as garfish, default as masterApp, hoistNonReactStatics } from '${pluginName}'`;
+        const addExportStatement = `export { default as garfish, default as masterApp, hoistNonReactStatics } from '${pluginName}/runtime'`;
         logger("exportStatement", addExportStatement);
         pluginsExportsUtils.addExport(addExportStatement);
-        runtimeExportsUtils.addExport(`export * from '${mfPackagePath}'`);
+        runtimeExportsUtils.addExport(
+          `export * from '${mfPackagePath}/runtime'`
+        );
       },
       modifyEntryImports({ entrypoint, imports }) {
         const config = useResolvedConfigContext();

package/dist/js/modern/runtime/plugin.js

@@ -140,7 +140,7 @@ var plugin_default = (config) => ({
             logger("GarfishProvider state", this.state);
             return /* @__PURE__ */ jsx(GarfishProvider, {
               value: this.state,
-              children: /* @__PURE__ */ jsx(App, __spreadValues(__spreadValues({}, this.props), this.state))
+              children: /* @__PURE__ */ jsx(App, __spreadValues({}, this.props))
             });
           }
         }

package/dist/js/modern/runtime/utils/apps.js

@@ -50,147 +50,160 @@ var __async = (__this, __arguments, generator) => {
   });
 };
 import { Fragment, jsx } from "react/jsx-runtime";
-import path from "path";
-import React from "react";
+import { useContext, useState, useEffect, useRef } from "react";
+import { RuntimeReactContext } from "@modern-js/runtime";
 import Garfish from "garfish";
-import { withRouter } from "@modern-js/plugin-router-legacy";
 import { logger, generateSubAppContainerKey } from "../../util";
 import { Loadable } from "../loadable";
+function pathJoin(...args) {
+  const res = args.reduce((res2, path) => {
+    let nPath = path;
+    if (!nPath || typeof nPath !== "string") {
+      return res2;
+    }
+    if (nPath[0] !== "/") {
+      nPath = `/${nPath}`;
+    }
+    const lastIndex = path.length - 1;
+    if (nPath[lastIndex] === "/") {
+      nPath = nPath.substring(0, lastIndex);
+    }
+    return res2 + nPath;
+  }, "");
+  return res || "/";
+}
 function getAppInstance(options, appInfo, manifest) {
   let locationHref = "";
-  class MicroApp extends React.Component {
-    constructor() {
-      super(...arguments);
-      this.state = {
-        appInstance: null,
-        domId: generateSubAppContainerKey(appInfo),
-        SubModuleComponent: void 0
-      };
-      this.unregisterHistoryListener = () => {
-      };
+  function MicroApp(props) {
+    var _a, _b, _c, _d, _e, _f;
+    const appRef = useRef(null);
+    const domId = generateSubAppContainerKey(appInfo);
+    const [SubModuleComponent, setSubModuleComponent] = useState();
+    const context = useContext(RuntimeReactContext);
+    const match = (_b = (_a = context == null ? void 0 : context.router) == null ? void 0 : _a.useRouteMatch) == null ? void 0 : _b.call(_a);
+    const matchs = (_d = (_c = context == null ? void 0 : context.router) == null ? void 0 : _c.useMatches) == null ? void 0 : _d.call(_c);
+    const location = (_f = (_e = context == null ? void 0 : context.router) == null ? void 0 : _e.useLocation) == null ? void 0 : _f.call(_e);
+    let basename = (options == null ? void 0 : options.basename) || "/";
+    if (matchs && matchs.length > 0) {
+      basename = pathJoin(basename, matchs[matchs.length - 1].pathname || "/");
+    } else if (match) {
+      basename = pathJoin(basename, (match == null ? void 0 : match.path) || "/");
     }
-    componentDidMount() {
-      return __async(this, null, function* () {
-        const _a = this.props, { match, history, setLoadingState } = _a, userProps = __objRest(_a, ["match", "history", "setLoadingState"]);
-        const { domId } = this.state;
-        const loadAppOptions = __spreadProps(__spreadValues({}, appInfo), {
-          insulationVariable: [
-            ...appInfo.insulationVariable || [],
-            "_SERVER_DATA"
-          ],
-          domGetter: `#${domId}`,
-          basename: path.join((options == null ? void 0 : options.basename) || "/", (match == null ? void 0 : match.path) || "/"),
-          cache: true,
-          props: __spreadValues(__spreadValues({}, appInfo.props), userProps),
-          customLoader: (provider) => {
-            const {
-              render,
-              destroy,
-              SubModuleComponent,
-              jupiter_submodule_app_key
-            } = provider;
-            const componetRenderMode = (manifest == null ? void 0 : manifest.componentRender) && (SubModuleComponent || jupiter_submodule_app_key);
-            return {
-              mount: (...props) => {
-                if (componetRenderMode) {
-                  this.setState({
-                    SubModuleComponent: SubModuleComponent != null ? SubModuleComponent : jupiter_submodule_app_key
-                  });
-                  return void 0;
-                } else {
-                  logger("MicroApp customer render", props);
-                  return render == null ? void 0 : render.apply(provider, props);
-                }
-              },
-              unmount(...props) {
-                if (componetRenderMode) {
-                  return void 0;
-                }
-                logger("MicroApp customer destroy", props);
-                return destroy == null ? void 0 : destroy.apply(provider, props);
+    useEffect(() => {
+      if (location && locationHref !== location.pathname) {
+        locationHref = location.pathname;
+        const popStateEvent = new PopStateEvent("popstate");
+        popStateEvent.garfish = true;
+        dispatchEvent(popStateEvent);
+        logger(`MicroApp Garfish.loadApp popstate`);
+      }
+    }, [location]);
+    useEffect(() => {
+      const _a2 = props, { setLoadingState } = _a2, userProps = __objRest(_a2, ["setLoadingState"]);
+      const loadAppOptions = __spreadProps(__spreadValues({}, appInfo), {
+        insulationVariable: [
+          ...appInfo.insulationVariable || [],
+          "_SERVER_DATA"
+        ],
+        domGetter: `#${domId}`,
+        basename,
+        cache: true,
+        props: __spreadValues(__spreadValues({}, appInfo.props), userProps),
+        customLoader: (provider) => {
+          const {
+            render,
+            destroy,
+            SubModuleComponent: SubModuleComponent2,
+            jupiter_submodule_app_key
+          } = provider;
+          const componetRenderMode = (manifest == null ? void 0 : manifest.componentRender) && (SubModuleComponent2 || jupiter_submodule_app_key);
+          return {
+            mount: (...props2) => {
+              if (componetRenderMode) {
+                setSubModuleComponent(SubModuleComponent2);
+                return void 0;
+              } else {
+                logger("MicroApp customer render", props2);
+                return render == null ? void 0 : render.apply(provider, props2);
               }
-            };
-          }
-        });
-        setLoadingState({
-          isLoading: true,
-          error: null
-        });
-        logger(`MicroApp Garfish.loadApp "${appInfo.name}"`, {
-          loadAppOptions
-        });
-        try {
-          const appInstance = yield Garfish.loadApp(appInfo.name, loadAppOptions);
-          if (!appInstance) {
-            throw new Error(
-              `MicroApp Garfish.loadApp "${appInfo.name}" result is null`
+            },
+            unmount(...props2) {
+              if (componetRenderMode) {
+                return void 0;
+              }
+              logger("MicroApp customer destroy", props2);
+              return destroy == null ? void 0 : destroy.apply(provider, props2);
+            }
+          };
+        }
+      });
+      setLoadingState({
+        isLoading: true,
+        error: null
+      });
+      logger(`MicroApp Garfish.loadApp "${appInfo.name}"`, {
+        loadAppOptions
+      });
+      function renderApp() {
+        return __async(this, null, function* () {
+          try {
+            const appInstance = yield Garfish.loadApp(
+              appInfo.name,
+              loadAppOptions
             );
-          }
-          this.setState({
-            appInstance
-          });
-          setLoadingState({
-            isLoading: false
-          });
-          if (appInstance.mounted && appInstance.appInfo.cache) {
-            logger(`MicroApp Garfish.loadApp "${appInfo.name}" show`, {
-              appInfo: appInstance.appInfo,
-              appInstance
+            if (!appInstance) {
+              throw new Error(
+                `MicroApp Garfish.loadApp "${appInfo.name}" result is null`
+              );
+            }
+            appRef.current = appInstance;
+            setLoadingState({
+              isLoading: false
             });
-            yield appInstance == null ? void 0 : appInstance.show();
-          } else {
-            logger(`MicroApp Garfish.loadApp "${appInfo.name}" mount`, {
-              appInfo: appInstance.appInfo,
-              appInstance
+            if (appInstance.mounted && appInstance.appInfo.cache) {
+              logger(`MicroApp Garfish.loadApp "${appInfo.name}" show`, {
+                appInfo: appInstance.appInfo,
+                appInstance
+              });
+              yield appInstance == null ? void 0 : appInstance.show();
+            } else {
+              logger(`MicroApp Garfish.loadApp "${appInfo.name}" mount`, {
+                appInfo: appInstance.appInfo,
+                appInstance
+              });
+              yield appInstance == null ? void 0 : appInstance.mount();
+            }
+          } catch (error) {
+            setLoadingState({
+              isLoading: true,
+              error
             });
-            yield appInstance == null ? void 0 : appInstance.mount();
           }
-          this.unregisterHistoryListener = history == null ? void 0 : history.listen(() => {
-            if (locationHref !== history.location.pathname) {
-              locationHref = history.location.pathname;
-              const popStateEvent = new PopStateEvent("popstate");
-              dispatchEvent(popStateEvent);
-              logger(`MicroApp Garfish.loadApp popstate`);
-            }
-          });
-        } catch (error) {
-          setLoadingState({
-            isLoading: true,
-            error
-          });
-        }
-      });
-    }
-    componentWillUnmount() {
-      return __async(this, null, function* () {
-        var _a;
-        const { appInstance } = this.state;
-        (_a = this.unregisterHistoryListener) == null ? void 0 : _a.call(this);
-        if (appInstance) {
-          const { appInfo: appInfo2 } = appInstance;
+        });
+      }
+      renderApp();
+      return () => {
+        var _a3, _b2;
+        if (appRef.current) {
+          const { appInfo: appInfo2 } = appRef.current;
           if (appInfo2.cache) {
             logger(`MicroApp Garfish.loadApp "${appInfo2.name}" hide`);
-            appInstance == null ? void 0 : appInstance.hide();
+            (_a3 = appRef.current) == null ? void 0 : _a3.hide();
           } else {
             logger(`MicroApp Garfish.loadApp "${appInfo2.name}" unmount`);
-            appInstance == null ? void 0 : appInstance.unmount();
+            (_b2 = appRef.current) == null ? void 0 : _b2.unmount();
           }
         }
-      });
-    }
-    render() {
-      const { domId, SubModuleComponent } = this.state;
-      return /* @__PURE__ */ jsx(Fragment, {
-        children: /* @__PURE__ */ jsx("div", {
-          id: domId,
-          children: SubModuleComponent && /* @__PURE__ */ jsx(SubModuleComponent, {})
-        })
-      });
-    }
+      };
+    }, []);
+    return /* @__PURE__ */ jsx(Fragment, {
+      children: /* @__PURE__ */ jsx("div", {
+        id: domId,
+        children: SubModuleComponent && /* @__PURE__ */ jsx(SubModuleComponent, {})
+      })
+    });
   }
-  return Loadable(withRouter(MicroApp))(
-    manifest == null ? void 0 : manifest.loadable
-  );
+  return Loadable(MicroApp)(manifest == null ? void 0 : manifest.loadable);
 }
 function generateApps(options, manifest) {
   var _a;
@@ -203,5 +216,6 @@ function generateApps(options, manifest) {
   return { apps, appInfoList: options.apps || [] };
 }
 export {
-  generateApps
+  generateApps,
+  pathJoin
 };

package/dist/js/node/cli/index.js

@@ -2,8 +2,22 @@ var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -21,33 +35,6 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var stdin_exports = {};
-__export(stdin_exports, {
-  default: () => cli_default,
-  externals: () => externals,
-  getDefaultMicroFrontedConfig: () => getDefaultMicroFrontedConfig
-});
-module.exports = __toCommonJS(stdin_exports);
-var import_path = __toESM(require("path"));
-var import_utils = require("@modern-js/utils");
-var import_util = require("../util");
-var import_utils2 = require("./utils");
-var __defProp2 = Object.defineProperty;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp2 = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp2.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
 var __async = (__this, __arguments, generator) => {
   return new Promise((resolve, reject) => {
     var fulfilled = (value) => {
@@ -68,6 +55,18 @@ var __async = (__this, __arguments, generator) => {
     step((generator = generator.apply(__this, __arguments)).next());
   });
 };
+var cli_exports = {};
+__export(cli_exports, {
+  default: () => cli_default,
+  externals: () => externals,
+  getDefaultMicroFrontedConfig: () => getDefaultMicroFrontedConfig
+});
+module.exports = __toCommonJS(cli_exports);
+var import_path = __toESM(require("path"));
+var import_utils = require("@modern-js/utils");
+var import_util = require("../util");
+var import_utils2 = require("./utils");
+var import_types = require("./types");
 const externals = { "react-dom": "react-dom", react: "react" };
 function getDefaultMicroFrontedConfig(microFrontend) {
   if (microFrontend === true) {
@@ -205,10 +204,12 @@ var cli_default = ({
         };
       },
       addRuntimeExports() {
-        const addExportStatement = `export { default as garfish, default as masterApp, hoistNonReactStatics } from '${pluginName}'`;
+        const addExportStatement = `export { default as garfish, default as masterApp, hoistNonReactStatics } from '${pluginName}/runtime'`;
         (0, import_util.logger)("exportStatement", addExportStatement);
         pluginsExportsUtils.addExport(addExportStatement);
-        runtimeExportsUtils.addExport(`export * from '${mfPackagePath}'`);
+        runtimeExportsUtils.addExport(
+          `export * from '${mfPackagePath}/runtime'`
+        );
       },
       modifyEntryImports({ entrypoint, imports }) {
         const config = useResolvedConfigContext();
@@ -313,3 +314,8 @@ var cli_default = ({
     };
   }
 });
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  externals,
+  getDefaultMicroFrontedConfig
+});

package/dist/js/node/cli/utils.js

@@ -15,15 +15,15 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var stdin_exports = {};
-__export(stdin_exports, {
+var utils_exports = {};
+__export(utils_exports, {
   generateAsyncEntry: () => generateAsyncEntry,
   getRuntimeConfig: () => getRuntimeConfig,
   makeProvider: () => makeProvider,
   makeRenderFunction: () => makeRenderFunction,
   setRuntimeConfig: () => setRuntimeConfig
 });
-module.exports = __toCommonJS(stdin_exports);
+module.exports = __toCommonJS(utils_exports);
 const makeProvider = () => `
 export const provider = function ({basename, dom}) {
   return {
@@ -148,3 +148,11 @@ const generateAsyncEntry = (code) => {
       ${transformCode}
     `;
 };
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  generateAsyncEntry,
+  getRuntimeConfig,
+  makeProvider,
+  makeRenderFunction,
+  setRuntimeConfig
+});

package/dist/js/node/index.js

@@ -22,10 +22,12 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var stdin_exports = {};
-__export(stdin_exports, {
+var src_exports = {};
+__export(src_exports, {
   default: () => import_runtime.default
 });
-module.exports = __toCommonJS(stdin_exports);
+module.exports = __toCommonJS(src_exports);
 var import_runtime = __toESM(require("./runtime"));
-__reExport(stdin_exports, require("./runtime"), module.exports);
+__reExport(src_exports, require("./runtime"), module.exports);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {});

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

@@ -21,8 +21,8 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var stdin_exports = {};
-__export(stdin_exports, {
+var runtime_exports = {};
+__export(runtime_exports, {
   Garfish: () => import_garfish.default,
   default: () => import_plugin.default,
   garfish: () => import_garfish.default,
@@ -30,8 +30,16 @@ __export(stdin_exports, {
   useModuleApp: () => import_useModuleApps.useModuleApp,
   useModuleApps: () => import_useModuleApps.useModuleApps
 });
-module.exports = __toCommonJS(stdin_exports);
+module.exports = __toCommonJS(runtime_exports);
 var import_plugin = __toESM(require("./plugin"));
 var import_useModuleApps = require("./useModuleApps");
 var import_garfish = __toESM(require("garfish"));
 var import_hoist_non_react_statics = __toESM(require("hoist-non-react-statics"));
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Garfish,
+  garfish,
+  hoistNonReactStatics,
+  useModuleApp,
+  useModuleApps
+});

package/dist/js/node/runtime/loadable.js

@@ -1,38 +1,15 @@
 var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var stdin_exports = {};
-__export(stdin_exports, {
-  Loadable: () => Loadable
-});
-module.exports = __toCommonJS(stdin_exports);
-var import_jsx_runtime = require("react/jsx-runtime");
-var import_react = require("react");
-var import_util = require("../util");
-var __defProp2 = Object.defineProperty;
 var __defProps = Object.defineProperties;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropNames = Object.getOwnPropertyNames;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp2 = Object.prototype.hasOwnProperty;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __spreadValues = (a, b) => {
   for (var prop in b || (b = {}))
-    if (__hasOwnProp2.call(b, prop))
+    if (__hasOwnProp.call(b, prop))
       __defNormalProp(a, prop, b[prop]);
   if (__getOwnPropSymbols)
     for (var prop of __getOwnPropSymbols(b)) {
@@ -45,7 +22,7 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __objRest = (source, exclude) => {
   var target = {};
   for (var prop in source)
-    if (__hasOwnProp2.call(source, prop) && exclude.indexOf(prop) < 0)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
       target[prop] = source[prop];
   if (source != null && __getOwnPropSymbols)
     for (var prop of __getOwnPropSymbols(source)) {
@@ -54,6 +31,27 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var loadable_exports = {};
+__export(loadable_exports, {
+  Loadable: () => Loadable
+});
+module.exports = __toCommonJS(loadable_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_react = require("react");
+var import_util = require("../util");
 const DEFAULT_LOADABLE = {
   delay: 200,
   timeout: 1e4,
@@ -150,3 +148,7 @@ function Loadable(WrapComponent) {
     };
   };
 }
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Loadable
+});