@blocklet/payment-react/lib/components/lazy-loader.js

Reusable react components for payment kit v2

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.createLazyComponent = createLazyComponent;
var _jsxRuntime = require("react/jsx-runtime");
var _react = require("react");
var _Center = _interopRequireDefault(require("@arcblock/ux/lib/Center"));
var _material = require("@mui/material");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function createLazyComponent(loader, options = {}) {
  let loadPromise = null;
  const {
    LoadingComponent = () => /* @__PURE__ */(0, _jsxRuntime.jsx)(_Center.default, {
      children: /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.CircularProgress, {})
    }),
    ErrorComponent = ({
      error
    }) => /* @__PURE__ */(0, _jsxRuntime.jsxs)("div", {
      children: ["Error: ", error.message]
    })
  } = options;
  const loadComponent = async () => {
    if (loadPromise) return loadPromise;
    try {
      loadPromise = loader().then(result => "default" in result ? result.default : result);
      return await loadPromise;
    } catch (error) {
      loadPromise = null;
      throw error;
    }
  };
  return function WrappedComponent(props) {
    const [Component, setComponent] = (0, _react.useState)(null);
    const [error, setError] = (0, _react.useState)(null);
    (0, _react.useEffect)(() => {
      loadComponent().then(comp => {
        setComponent(() => comp);
      }).catch(err => {
        setError(err);
        console.error("Failed to load component:", err);
      });
    }, []);
    if (error) {
      return /* @__PURE__ */(0, _jsxRuntime.jsx)(ErrorComponent, {
        error
      });
    }
    if (!Component) {
      return /* @__PURE__ */(0, _jsxRuntime.jsx)(LoadingComponent, {});
    }
    return /* @__PURE__ */(0, _jsxRuntime.jsx)(Component, {
      ...props
    });
  };
}