x-star-design 0.0.66 → 0.0.67

package/dist/micro-app/index.js

@@ -1,9 +1,9 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import { initGlobalState, loadMicroApp } from 'qiankun';
-import React, { useEffect, useMemo } from 'react';
-import ReactDOM from 'react-dom/client';
+import React, { useEffect, useMemo, useState } from 'react';
 import { randomString } from 'x-star-utils';
 import { useLocale } from "../locales";
 import RainbowCat from "../rainbow-cat";
@@ -17,58 +17,13 @@ var MicroApp = function MicroApp(_ref) {
   var microAppId = useMemo(function () {
     return "microapp-".concat(randomString(8));
   }, []);
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    loading = _useState2[0],
+    setLoading = _useState2[1];
   var _useLocale = useLocale('MicroApp'),
     t = _useLocale.format;
   useEffect(function () {
-    // 创建一个加载元素
-    var rainbowCatContainer = null;
-    var showLoading = /*#__PURE__*/function () {
-      var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
-        var microAppContainer;
-        return _regeneratorRuntime().wrap(function _callee$(_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              // 加载子应用前，创建一个容器并挂载 RainbowCat 组件
-              rainbowCatContainer = document.createElement('div');
-              rainbowCatContainer.style.position = 'absolute';
-              rainbowCatContainer.style.top = '0';
-              rainbowCatContainer.style.left = '0';
-              rainbowCatContainer.style.width = '100%';
-              microAppContainer = document.getElementById(microAppId);
-              microAppContainer.append(rainbowCatContainer);
-              ReactDOM.createRoot(rainbowCatContainer).render( /*#__PURE__*/React.createElement(RainbowCat, {
-                text: t('Loading')
-              }));
-            case 8:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee);
-      }));
-      return function showLoading() {
-        return _ref2.apply(this, arguments);
-      };
-    }();
-    var hideLoading = /*#__PURE__*/function () {
-      var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
-        var _rainbowCatContainer;
-        return _regeneratorRuntime().wrap(function _callee2$(_context2) {
-          while (1) switch (_context2.prev = _context2.next) {
-            case 0:
-              // 挂载子应用前，卸载 RainbowCat 组件
-              (_rainbowCatContainer = rainbowCatContainer) === null || _rainbowCatContainer === void 0 ? void 0 : _rainbowCatContainer.remove();
-              rainbowCatContainer = null;
-            case 2:
-            case "end":
-              return _context2.stop();
-          }
-        }, _callee2);
-      }));
-      return function hideLoading() {
-        return _ref3.apply(this, arguments);
-      };
-    }();
-
     // 启动 qiankun
     var microApp = loadMicroApp({
       name: name,
@@ -78,8 +33,40 @@ var MicroApp = function MicroApp(_ref) {
         pathname: pathname
       }, microProps)
     }, undefined, {
-      beforeLoad: showLoading,
-      beforeMount: hideLoading
+      beforeLoad: function () {
+        var _beforeLoad = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+          return _regeneratorRuntime().wrap(function _callee$(_context) {
+            while (1) switch (_context.prev = _context.next) {
+              case 0:
+                setLoading(true);
+              case 1:
+              case "end":
+                return _context.stop();
+            }
+          }, _callee);
+        }));
+        function beforeLoad() {
+          return _beforeLoad.apply(this, arguments);
+        }
+        return beforeLoad;
+      }(),
+      beforeMount: function () {
+        var _beforeMount = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
+          return _regeneratorRuntime().wrap(function _callee2$(_context2) {
+            while (1) switch (_context2.prev = _context2.next) {
+              case 0:
+                setLoading(false);
+              case 1:
+              case "end":
+                return _context2.stop();
+            }
+          }, _callee2);
+        }));
+        function beforeMount() {
+          return _beforeMount.apply(this, arguments);
+        }
+        return beforeMount;
+      }()
     });
     return function () {
       microApp.unmount();
@@ -92,11 +79,13 @@ var MicroApp = function MicroApp(_ref) {
       position: 'relative',
       minHeight: 600
     }, style)
-  });
+  }, loading && /*#__PURE__*/React.createElement(RainbowCat, {
+    text: t('Loading')
+  }));
 };
-MicroApp.useGlobalState = function (_ref4) {
-  var lang = _ref4.lang,
-    setLang = _ref4.setLang;
+MicroApp.useGlobalState = function (_ref2) {
+  var lang = _ref2.lang,
+    setLang = _ref2.setLang;
   var actions = useMemo(function () {
     return initGlobalState({
       lang: lang

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "x-star-design",
-  "version": "0.0.66",
+  "version": "0.0.67",
   "description": "A react component library developed by turingstar",
   "license": "MIT",
   "module": "dist/index.js",