@ant-design/pro-components 3.0.0-beta.1 → 3.0.0-beta.3

package/lib/layout/components/PageContainer/index.js

@@ -1,180 +1,129 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-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 __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+"use strict";
 
-// src/layout/components/PageContainer/index.tsx
-var PageContainer_exports = {};
-__export(PageContainer_exports, {
-  PageContainer: () => PageContainer,
-  ProBreadcrumb: () => ProBreadcrumb,
-  ProPageHeader: () => ProPageHeader
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
 });
-module.exports = __toCommonJS(PageContainer_exports);
-var import_antd = require("antd");
-var import_classnames = __toESM(require("classnames"));
-var import_react = __toESM(require("react"));
-var import_provider = require("../../../provider");
-var import_RouteContext = require("../../context/RouteContext");
-var import_FooterToolbar = require("../FooterToolbar");
-var import_GridContent = require("../GridContent");
-var import_PageHeader = require("../PageHeader");
-var import_PageLoading = require("../PageLoading");
-var import_style = require("./style");
-var import_stylish = require("./style/stylish");
+exports.ProPageHeader = exports.ProBreadcrumb = exports.PageContainer = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+var _antd = require("antd");
+var _classnames = _interopRequireDefault(require("classnames"));
+var _react = _interopRequireWildcard(require("react"));
+var _provider = require("../../../provider");
+var _RouteContext = require("../../context/RouteContext");
+var _FooterToolbar = require("../FooterToolbar");
+var _GridContent = require("../GridContent");
+var _PageHeader = require("../PageHeader");
+var _PageLoading = require("../PageLoading");
+var _style = require("./style");
+var _stylish = require("./style/stylish");
+var _jsxRuntime = require("react/jsx-runtime");
+var _excluded = ["title", "content", "pageHeaderRender", "header", "prefixedClassName", "extraContent", "childrenContentStyle", "style", "prefixCls", "hashId", "value", "breadcrumbRender"],
+  _excluded2 = ["children", "loading", "className", "style", "footer", "affixProps", "token", "fixedHeader", "breadcrumbRender", "footerToolBarProps", "childrenContentStyle"];
 function genLoading(spinProps) {
-  if (typeof spinProps === "object") {
+  if ((0, _typeof2.default)(spinProps) === 'object') {
     return spinProps;
   }
-  return { spinning: spinProps };
+  return {
+    spinning: spinProps
+  };
 }
-var renderFooter = ({
-  tabList,
-  tabActiveKey,
-  onTabChange,
-  hashId,
-  tabBarExtraContent,
-  tabProps,
-  prefixedClassName
-}) => {
+
+/**
+ * Render Footer tabList In order to be compatible with the old version of the PageHeader basically
+ * all the functions are implemented.
+ */
+var renderFooter = function renderFooter(_ref) {
+  var tabList = _ref.tabList,
+    tabActiveKey = _ref.tabActiveKey,
+    onTabChange = _ref.onTabChange,
+    hashId = _ref.hashId,
+    tabBarExtraContent = _ref.tabBarExtraContent,
+    tabProps = _ref.tabProps,
+    prefixedClassName = _ref.prefixedClassName;
   if (Array.isArray(tabList) || tabBarExtraContent) {
-    return /* @__PURE__ */ import_react.default.createElement(
-      import_antd.Tabs,
-      __spreadValues({
-        className: `${prefixedClassName}-tabs ${hashId}`.trim(),
-        activeKey: tabActiveKey,
-        onChange: (key) => {
-          if (onTabChange) {
-            onTabChange(key);
-          }
-        },
-        tabBarExtraContent,
-        items: tabList == null ? void 0 : tabList.map((item, index) => {
-          var _a;
-          return __spreadProps(__spreadValues({
-            label: item.tab
-          }, item), {
-            key: ((_a = item.key) == null ? void 0 : _a.toString()) || (index == null ? void 0 : index.toString())
-          });
-        })
-      }, tabProps)
-    );
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tabs, (0, _objectSpread2.default)({
+      className: "".concat(prefixedClassName, "-tabs ").concat(hashId).trim(),
+      activeKey: tabActiveKey,
+      onChange: function onChange(key) {
+        if (onTabChange) {
+          onTabChange(key);
+        }
+      },
+      tabBarExtraContent: tabBarExtraContent,
+      items: tabList === null || tabList === void 0 ? void 0 : tabList.map(function (item, index) {
+        var _item$key;
+        return (0, _objectSpread2.default)((0, _objectSpread2.default)({
+          label: item.tab
+        }, item), {}, {
+          key: ((_item$key = item.key) === null || _item$key === void 0 ? void 0 : _item$key.toString()) || (index === null || index === void 0 ? void 0 : index.toString())
+        });
+      })
+    }, tabProps));
   }
   return null;
 };
-var renderPageHeader = (content, extraContent, prefixedClassName, hashId) => {
+var renderPageHeader = function renderPageHeader(content, extraContent, prefixedClassName, hashId) {
   if (!content && !extraContent) {
     return null;
   }
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixedClassName}-detail ${hashId}`.trim() }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixedClassName}-main ${hashId}`.trim() }, /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixedClassName}-row ${hashId}`.trim() }, content && /* @__PURE__ */ import_react.default.createElement("div", { className: `${prefixedClassName}-content ${hashId}`.trim() }, content), extraContent && /* @__PURE__ */ import_react.default.createElement(
-    "div",
-    {
-      className: `${prefixedClassName}-extraContent ${hashId}`.trim()
-    },
-    extraContent
-  ))));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    className: "".concat(prefixedClassName, "-detail ").concat(hashId).trim(),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "".concat(prefixedClassName, "-main ").concat(hashId).trim(),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+        className: "".concat(prefixedClassName, "-row ").concat(hashId).trim(),
+        children: [content && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: "".concat(prefixedClassName, "-content ").concat(hashId).trim(),
+          children: content
+        }), extraContent && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: "".concat(prefixedClassName, "-extraContent ").concat(hashId).trim(),
+          children: extraContent
+        })]
+      })
+    })
+  });
 };
-var ProBreadcrumb = (props) => {
-  const value = (0, import_react.useContext)(import_RouteContext.RouteContext);
-  return /* @__PURE__ */ import_react.default.createElement(
-    "div",
-    {
-      style: {
-        height: "100%",
-        display: "flex",
-        alignItems: "center"
-      }
+
+/**
+ * 配置与面包屑相同，只是增加了自动根据路由计算面包屑的功能。此功能必须要在 ProLayout 中使用。
+ *
+ * @param props
+ * @returns
+ */
+var ProBreadcrumb = exports.ProBreadcrumb = function ProBreadcrumb(props) {
+  var value = (0, _react.useContext)(_RouteContext.RouteContext);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    style: {
+      height: '100%',
+      display: 'flex',
+      alignItems: 'center'
     },
-    /* @__PURE__ */ import_react.default.createElement(
-      import_antd.Breadcrumb,
-      __spreadValues(__spreadValues(__spreadValues({}, value == null ? void 0 : value.breadcrumb), value == null ? void 0 : value.breadcrumbProps), props)
-    )
-  );
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Breadcrumb, (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, value === null || value === void 0 ? void 0 : value.breadcrumb), value === null || value === void 0 ? void 0 : value.breadcrumbProps), props))
+  });
 };
-var memoRenderPageHeader = (props) => {
-  var _b;
-  const _a = props, {
-    title,
-    content,
-    pageHeaderRender,
-    header,
-    prefixedClassName,
-    extraContent,
-    childrenContentStyle,
-    style,
-    prefixCls,
-    hashId,
-    value,
-    breadcrumbRender
-  } = _a, restProps = __objRest(_a, [
-    "title",
-    "content",
-    "pageHeaderRender",
-    "header",
-    "prefixedClassName",
-    "extraContent",
-    "childrenContentStyle",
-    "style",
-    "prefixCls",
-    "hashId",
-    "value",
-    "breadcrumbRender"
-  ]);
-  const getBreadcrumbRender = () => {
+var memoRenderPageHeader = function memoRenderPageHeader(props) {
+  var _breadcrumb$items;
+  var title = props.title,
+    content = props.content,
+    pageHeaderRender = props.pageHeaderRender,
+    header = props.header,
+    prefixedClassName = props.prefixedClassName,
+    extraContent = props.extraContent,
+    childrenContentStyle = props.childrenContentStyle,
+    style = props.style,
+    prefixCls = props.prefixCls,
+    hashId = props.hashId,
+    value = props.value,
+    breadcrumbRender = props.breadcrumbRender,
+    restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
+  var getBreadcrumbRender = function getBreadcrumbRender() {
     if (!breadcrumbRender) {
-      return void 0;
+      return undefined;
     }
     return breadcrumbRender;
   };
@@ -182,180 +131,168 @@ var memoRenderPageHeader = (props) => {
     return null;
   }
   if (pageHeaderRender) {
-    return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, " ", pageHeaderRender(__spreadValues(__spreadValues({}, props), value)));
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [" ", pageHeaderRender((0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), value))]
+    });
   }
-  let pageHeaderTitle = title;
+  var pageHeaderTitle = title;
   if (!title && title !== false) {
     pageHeaderTitle = value.title;
   }
-  const pageHeaderProps = __spreadValues(__spreadProps(__spreadValues(__spreadProps(__spreadValues({}, value), {
+  var pageHeaderProps = (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, value), {}, {
     title: pageHeaderTitle
-  }), restProps), {
-    footer: renderFooter(__spreadProps(__spreadValues({}, restProps), {
-      hashId,
-      breadcrumbRender,
-      prefixedClassName
+  }, restProps), {}, {
+    footer: renderFooter((0, _objectSpread2.default)((0, _objectSpread2.default)({}, restProps), {}, {
+      hashId: hashId,
+      breadcrumbRender: breadcrumbRender,
+      prefixedClassName: prefixedClassName
     }))
-  }), header);
-  const { breadcrumb } = pageHeaderProps;
-  const noHasBreadCrumb = (!breadcrumb || !(breadcrumb == null ? void 0 : breadcrumb.itemRender) && !((_b = breadcrumb == null ? void 0 : breadcrumb.items) == null ? void 0 : _b.length)) && !breadcrumbRender;
-  if ([
-    "title",
-    "subTitle",
-    "extra",
-    "tags",
-    "footer",
-    "avatar",
-    "backIcon"
-  ].every((item) => !pageHeaderProps[item]) && noHasBreadCrumb && !content && !extraContent) {
+  }, header);
+  var _ref2 = pageHeaderProps,
+    breadcrumb = _ref2.breadcrumb;
+  var noHasBreadCrumb = (!breadcrumb || !(breadcrumb !== null && breadcrumb !== void 0 && breadcrumb.itemRender) && !(breadcrumb !== null && breadcrumb !== void 0 && (_breadcrumb$items = breadcrumb.items) !== null && _breadcrumb$items !== void 0 && _breadcrumb$items.length)) && !breadcrumbRender;
+  if (['title', 'subTitle', 'extra', 'tags', 'footer', 'avatar', 'backIcon'].every(function (item) {
+    return !pageHeaderProps[item];
+  }) && noHasBreadCrumb && !content && !extraContent) {
     return null;
   }
-  return /* @__PURE__ */ import_react.default.createElement(
-    import_PageHeader.PageHeader,
-    __spreadProps(__spreadValues({}, pageHeaderProps), {
-      className: `${prefixedClassName}-warp-page-header ${hashId}`.trim(),
-      breadcrumb: breadcrumbRender === false ? void 0 : __spreadValues(__spreadValues({}, pageHeaderProps.breadcrumb), value.breadcrumbProps),
-      breadcrumbRender: getBreadcrumbRender(),
-      prefixCls
-    }),
-    (header == null ? void 0 : header.children) || renderPageHeader(content, extraContent, prefixedClassName, hashId)
-  );
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_PageHeader.PageHeader, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, pageHeaderProps), {}, {
+    className: "".concat(prefixedClassName, "-warp-page-header ").concat(hashId).trim(),
+    breadcrumb: breadcrumbRender === false ? undefined : (0, _objectSpread2.default)((0, _objectSpread2.default)({}, pageHeaderProps.breadcrumb), value.breadcrumbProps),
+    breadcrumbRender: getBreadcrumbRender(),
+    prefixCls: prefixCls,
+    children: (header === null || header === void 0 ? void 0 : header.children) || renderPageHeader(content, extraContent, prefixedClassName, hashId)
+  }));
 };
-var PageContainerBase = (props) => {
-  var _b, _c, _d;
-  const _a = props, {
-    children,
-    loading = false,
-    className,
-    style,
-    footer,
-    affixProps,
-    token: propsToken,
-    fixedHeader,
-    breadcrumbRender,
-    footerToolBarProps,
-    childrenContentStyle
-  } = _a, restProps = __objRest(_a, [
-    "children",
-    "loading",
-    "className",
-    "style",
-    "footer",
-    "affixProps",
-    "token",
-    "fixedHeader",
-    "breadcrumbRender",
-    "footerToolBarProps",
-    "childrenContentStyle"
-  ]);
-  const value = (0, import_react.useContext)(import_RouteContext.RouteContext);
-  (0, import_react.useEffect)(() => {
-    var _a2;
-    if (!value || !(value == null ? void 0 : value.setHasPageContainer)) {
-      return () => {
-      };
+var PageContainerBase = function PageContainerBase(props) {
+  var _restProps$header2, _token$layout;
+  var children = props.children,
+    _props$loading = props.loading,
+    loading = _props$loading === void 0 ? false : _props$loading,
+    className = props.className,
+    style = props.style,
+    footer = props.footer,
+    affixProps = props.affixProps,
+    propsToken = props.token,
+    fixedHeader = props.fixedHeader,
+    breadcrumbRender = props.breadcrumbRender,
+    footerToolBarProps = props.footerToolBarProps,
+    childrenContentStyle = props.childrenContentStyle,
+    restProps = (0, _objectWithoutProperties2.default)(props, _excluded2);
+  var value = (0, _react.useContext)(_RouteContext.RouteContext);
+  /** 告诉 props 是否存在 footerBar */
+  (0, _react.useEffect)(function () {
+    var _value$setHasPageCont;
+    if (!value || !(value !== null && value !== void 0 && value.setHasPageContainer)) {
+      return function () {};
     }
-    (_a2 = value == null ? void 0 : value.setHasPageContainer) == null ? void 0 : _a2.call(value, (num) => num + 1);
-    return () => {
-      var _a3;
-      (_a3 = value == null ? void 0 : value.setHasPageContainer) == null ? void 0 : _a3.call(value, (num) => num - 1);
+    value === null || value === void 0 || (_value$setHasPageCont = value.setHasPageContainer) === null || _value$setHasPageCont === void 0 || _value$setHasPageCont.call(value, function (num) {
+      return num + 1;
+    });
+    return function () {
+      var _value$setHasPageCont2;
+      value === null || value === void 0 || (_value$setHasPageCont2 = value.setHasPageContainer) === null || _value$setHasPageCont2 === void 0 || _value$setHasPageCont2.call(value, function (num) {
+        return num - 1;
+      });
     };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
-  const { token } = (0, import_react.useContext)(import_provider.ProProvider);
-  const { getPrefixCls } = (0, import_react.useContext)(import_antd.ConfigProvider.ConfigContext);
-  const prefixCls = props.prefixCls || getPrefixCls("pro");
-  const basePageContainer = `${prefixCls}-page-container`;
-  const { wrapSSR, hashId } = (0, import_style.useStyle)(basePageContainer, propsToken);
-  const stylish = (0, import_stylish.useStylish)(
-    `${basePageContainer}.${basePageContainer}-stylish`,
-    {
-      stylish: props.stylish
-    }
-  );
-  const memoBreadcrumbRender = (0, import_react.useMemo)(() => {
-    var _a2;
-    if (breadcrumbRender == false)
-      return false;
-    return breadcrumbRender || ((_a2 = restProps == null ? void 0 : restProps.header) == null ? void 0 : _a2.breadcrumbRender);
-  }, [breadcrumbRender, (_b = restProps == null ? void 0 : restProps.header) == null ? void 0 : _b.breadcrumbRender]);
-  const pageHeaderDom = memoRenderPageHeader(__spreadProps(__spreadValues({}, restProps), {
+  var _useContext = (0, _react.useContext)(_provider.ProProvider),
+    token = _useContext.token;
+  var _useContext2 = (0, _react.useContext)(_antd.ConfigProvider.ConfigContext),
+    getPrefixCls = _useContext2.getPrefixCls;
+  var prefixCls = props.prefixCls || getPrefixCls('pro');
+  var basePageContainer = "".concat(prefixCls, "-page-container");
+  var _useStyle = (0, _style.useStyle)(basePageContainer, propsToken),
+    wrapSSR = _useStyle.wrapSSR,
+    hashId = _useStyle.hashId;
+  var stylish = (0, _stylish.useStylish)("".concat(basePageContainer, ".").concat(basePageContainer, "-stylish"), {
+    stylish: props.stylish
+  });
+  var memoBreadcrumbRender = (0, _react.useMemo)(function () {
+    var _restProps$header;
+    if (breadcrumbRender == false) return false;
+    return breadcrumbRender || (restProps === null || restProps === void 0 || (_restProps$header = restProps.header) === null || _restProps$header === void 0 ? void 0 : _restProps$header.breadcrumbRender);
+  }, [breadcrumbRender, restProps === null || restProps === void 0 || (_restProps$header2 = restProps.header) === null || _restProps$header2 === void 0 ? void 0 : _restProps$header2.breadcrumbRender]);
+  var pageHeaderDom = memoRenderPageHeader((0, _objectSpread2.default)((0, _objectSpread2.default)({}, restProps), {}, {
     breadcrumbRender: memoBreadcrumbRender,
     ghost: true,
-    hashId,
-    prefixCls: void 0,
+    hashId: hashId,
+    prefixCls: undefined,
     prefixedClassName: basePageContainer,
-    value
+    value: value
   }));
-  const loadingDom = (0, import_react.useMemo)(() => {
-    if (import_react.default.isValidElement(loading)) {
+  var loadingDom = (0, _react.useMemo)(function () {
+    // 当loading时一个合法的ReactNode时，说明用户使用了自定义loading,直接返回改自定义loading
+    if ( /*#__PURE__*/_react.default.isValidElement(loading)) {
       return loading;
     }
-    if (typeof loading === "boolean" && !loading) {
+    // 当传递过来的是布尔值，并且为false时，说明不需要显示loading,返回null
+    if (typeof loading === 'boolean' && !loading) {
       return null;
     }
-    const spinProps = genLoading(loading);
-    return spinProps.spinning ? /* @__PURE__ */ import_react.default.createElement(import_PageLoading.PageLoading, __spreadValues({}, spinProps)) : null;
+    // 如非上述两种情况，那么要么用户传了一个true,要么用户传了loading配置，使用genLoading生成loading配置后返回PageLoading
+    var spinProps = genLoading(loading);
+    // 如果传的是loading配置，但spinning传的是false，也不需要显示loading
+    return spinProps.spinning ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_PageLoading.PageLoading, (0, _objectSpread2.default)({}, spinProps)) : null;
   }, [loading]);
-  const content = (0, import_react.useMemo)(() => {
-    return children ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(
-      "div",
-      {
-        className: (0, import_classnames.default)(
-          hashId,
-          `${basePageContainer}-children-container`,
-          {
-            [`${basePageContainer}-children-container-no-header`]: !pageHeaderDom
-          }
-        ),
-        style: childrenContentStyle
-      },
-      children
-    )) : null;
+  var content = (0, _react.useMemo)(function () {
+    return children ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: (0, _classnames.default)(hashId, "".concat(basePageContainer, "-children-container"), (0, _defineProperty2.default)({}, "".concat(basePageContainer, "-children-container-no-header"), !pageHeaderDom)),
+        style: childrenContentStyle,
+        children: children
+      })
+    }) : null;
   }, [children, basePageContainer, childrenContentStyle, hashId]);
-  const renderContentDom = (0, import_react.useMemo)(() => {
-    const dom = loadingDom || content;
+  var renderContentDom = (0, _react.useMemo)(function () {
+    // 只要loadingDom非空我们就渲染loadingDom,否则渲染内容
+    var dom = loadingDom || content;
     if (props.waterMarkProps || value.waterMarkProps) {
-      const waterMarkProps = __spreadValues(__spreadValues({}, value.waterMarkProps), props.waterMarkProps);
-      return /* @__PURE__ */ import_react.default.createElement(import_antd.Watermark, __spreadValues({}, waterMarkProps), dom);
+      var waterMarkProps = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, value.waterMarkProps), props.waterMarkProps);
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Watermark, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, waterMarkProps), {}, {
+        children: dom
+      }));
     }
     return dom;
   }, [props.waterMarkProps, value.waterMarkProps, loadingDom, content]);
-  const containerClassName = (0, import_classnames.default)(basePageContainer, hashId, className, {
-    [`${basePageContainer}-with-footer`]: footer,
-    [`${basePageContainer}-with-affix`]: fixedHeader && pageHeaderDom,
-    [`${basePageContainer}-stylish`]: !!restProps.stylish
-  });
-  return wrapSSR(
-    stylish.wrapSSR(
-      /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { style, className: containerClassName }, fixedHeader && pageHeaderDom ? (
-        // 在 hasHeader 且 fixedHeader 的情况下，才需要设置高度
-        /* @__PURE__ */ import_react.default.createElement(
-          import_antd.Affix,
-          __spreadProps(__spreadValues({
-            offsetTop: value.hasHeader && value.fixedHeader ? (_d = (_c = token.layout) == null ? void 0 : _c.header) == null ? void 0 : _d.heightLayoutHeader : 1
-          }, affixProps), {
-            className: `${basePageContainer}-affix ${hashId}`.trim()
-          }),
-          /* @__PURE__ */ import_react.default.createElement("div", { className: `${basePageContainer}-warp ${hashId}`.trim() }, pageHeaderDom)
-        )
-      ) : pageHeaderDom, renderContentDom && /* @__PURE__ */ import_react.default.createElement(import_GridContent.GridContent, null, renderContentDom)), footer && /* @__PURE__ */ import_react.default.createElement(
-        import_FooterToolbar.FooterToolbar,
-        __spreadValues({
-          stylish: restProps.footerStylish,
-          prefixCls
-        }, footerToolBarProps),
-        footer
-      ))
-    )
-  );
+  var containerClassName = (0, _classnames.default)(basePageContainer, hashId, className, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, "".concat(basePageContainer, "-with-footer"), footer), "".concat(basePageContainer, "-with-affix"), fixedHeader && pageHeaderDom), "".concat(basePageContainer, "-stylish"), !!restProps.stylish));
+  return wrapSSR(stylish.wrapSSR( /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      style: style,
+      className: containerClassName,
+      children: [fixedHeader && pageHeaderDom ?
+      /*#__PURE__*/
+      // 在 hasHeader 且 fixedHeader 的情况下，才需要设置高度
+      (0, _jsxRuntime.jsx)(_antd.Affix, (0, _objectSpread2.default)((0, _objectSpread2.default)({
+        offsetTop: value.hasHeader && value.fixedHeader ? (_token$layout = token.layout) === null || _token$layout === void 0 || (_token$layout = _token$layout.header) === null || _token$layout === void 0 ? void 0 : _token$layout.heightLayoutHeader : 1
+      }, affixProps), {}, {
+        className: "".concat(basePageContainer, "-affix ").concat(hashId).trim(),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: "".concat(basePageContainer, "-warp ").concat(hashId).trim(),
+          children: pageHeaderDom
+        })
+      })) : pageHeaderDom, renderContentDom && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridContent.GridContent, {
+        children: renderContentDom
+      })]
+    }), footer && /*#__PURE__*/(0, _jsxRuntime.jsx)(_FooterToolbar.FooterToolbar, (0, _objectSpread2.default)((0, _objectSpread2.default)({
+      stylish: restProps.footerStylish,
+      prefixCls: prefixCls
+    }, footerToolBarProps), {}, {
+      children: footer
+    }))]
+  })));
 };
-var PageContainer = (props) => {
-  return /* @__PURE__ */ import_react.default.createElement(import_provider.ProConfigProvider, { needDeps: true }, /* @__PURE__ */ import_react.default.createElement(PageContainerBase, __spreadValues({}, props)));
+var PageContainer = exports.PageContainer = function PageContainer(props) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_provider.ProConfigProvider, {
+    needDeps: true,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(PageContainerBase, (0, _objectSpread2.default)({}, props))
+  });
 };
-var ProPageHeader = (props) => {
-  const value = (0, import_react.useContext)(import_RouteContext.RouteContext);
-  return memoRenderPageHeader(__spreadProps(__spreadValues({}, props), {
-    hashId: "",
-    value
+var ProPageHeader = exports.ProPageHeader = function ProPageHeader(props) {
+  var value = (0, _react.useContext)(_RouteContext.RouteContext);
+  return memoRenderPageHeader((0, _objectSpread2.default)((0, _objectSpread2.default)({}, props), {}, {
+    hashId: '',
+    value: value
   }));
-};
+};