@ant-design/pro-components 2.0.0-experimental.23 → 2.0.0-experimental.26

package/dist/components.js

@@ -33213,6 +33213,9 @@ var localeValues = {
   }
 };
 /* harmony default export */ var es_locale_zh_CN = (localeValues);
+// EXTERNAL MODULE: ./node_modules/classnames/index.js
+var classnames = __webpack_require__(8266);
+var classnames_default = /*#__PURE__*/__webpack_require__.n(classnames);
 // EXTERNAL MODULE: external "React"
 var external_React_ = __webpack_require__(1024);
 var external_React_default = /*#__PURE__*/__webpack_require__.n(external_React_);
@@ -35959,6 +35962,7 @@ var useSWR = withArgs(useSWRHandler);
 
 
 
+
 
 
 function get(source, path, defaultValue) {
@@ -36148,7 +36152,7 @@ var ConfigProviderWrap = function ConfigProviderWrap(_ref) {
 
       if (proProvide.isDeps) return provide;
       return (0,jsx_runtime.jsx)("div", {
-        className: "ant-pro",
+        className: classnames_default()('ant-pro'),
         children: provide
       });
     }
@@ -36183,9 +36187,6 @@ function useIntl() {
 }
 var ProProvider = es_ConfigContext;
 /* harmony default export */ var es = (es_ConfigContext);
-// EXTERNAL MODULE: ./node_modules/classnames/index.js
-var classnames = __webpack_require__(8266);
-var classnames_default = /*#__PURE__*/__webpack_require__.n(classnames);
 ;// CONCATENATED MODULE: ./node_modules/@babel/runtime/helpers/esm/typeof.js
 function typeof_typeof(obj) {
   "@babel/helpers - typeof";
@@ -39201,8 +39202,9 @@ function useStyle(componentName, styleFn) {
       path: [componentName]
     }, function () {
       return styleFn(objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, token), {}, {
+        hashId: hashId,
         antCls: '.' + getPrefixCls(),
-        proComponentsCls: proComponentsCls
+        proComponentsCls: hashId + proComponentsCls
       }));
     }),
     hashId: hashId
@@ -71661,6 +71663,10 @@ var FooterToolbar = function FooterToolbar(props) {
 
     return isMobile ? '100%' : "calc(100% - ".concat(siderWidth, "px)"); // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [value.collapsed, value.hasSiderMenu, value.isMobile, value.siderWidth]);
+  var containerDom = (0,external_React_.useMemo)(function () {
+    // 只读取一次就行了，不然总是的渲染
+    return (getTargetContainer === null || getTargetContainer === void 0 ? void 0 : getTargetContainer()) || document.querySelector('.ant-pro') || document.body;
+  }, []);
 
   var dom = (0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
     children: [(0,jsx_runtime.jsx)("div", {
@@ -71698,7 +71704,7 @@ var FooterToolbar = function FooterToolbar(props) {
     }), dom) : dom
   }));
 
-  var ssrDom = !isBrowser() ? renderDom : /*#__PURE__*/(0,external_ReactDOM_.createPortal)(renderDom, (getTargetContainer === null || getTargetContainer === void 0 ? void 0 : getTargetContainer()) || document.querySelector('.ant-pro') || document.body, baseClassName);
+  var ssrDom = !isBrowser() ? renderDom : /*#__PURE__*/(0,external_ReactDOM_.createPortal)(renderDom, containerDom, baseClassName);
   return wrapSSR(ssrDom);
 };
 
@@ -71827,7 +71833,7 @@ var getLayoutDesignToken = function getLayoutDesignToken(designTokens, antdToken
     }, finalDesignTokens.sider),
     pageContainer: objectSpread2_objectSpread2({
       colorBgPageContainer: 'transparent',
-      marginBlockPageContainerContent: 16,
+      marginBlockPageContainerContent: 24,
       marginInlinePageContainerContent: 40,
       colorBgPageContainerFixed: '#fff'
     }, finalDesignTokens.pageContainer)
@@ -72157,12 +72163,20 @@ var PageHeader = function PageHeader(props) {
   var className = classnames_default()(prefixCls, props.className, customizeClassName, (_classNames = {
     hashId: hashId
   }, defineProperty_defineProperty(_classNames, "".concat(prefixCls, "-has-breadcrumb"), !!breadcrumbDom), defineProperty_defineProperty(_classNames, "".concat(prefixCls, "-has-footer"), !!footer), defineProperty_defineProperty(_classNames, "".concat(prefixCls, "-ghost"), ghost), defineProperty_defineProperty(_classNames, "".concat(prefixCls, "-rtl"), direction === 'rtl'), defineProperty_defineProperty(_classNames, "".concat(prefixCls, "-compact"), compact), _classNames));
+  var title = renderTitle(prefixCls, props, direction);
+  var childDom = children && renderChildren(prefixCls, children);
+  var footerDom = renderFooter(prefixCls, footer);
+
+  if (!breadcrumbDom && !title && !footerDom && !childDom) {
+    return null;
+  }
+
   return wrapSSR((0,jsx_runtime.jsx)(rc_resize_observer_es, {
     onResize: onResize,
     children: (0,jsx_runtime.jsxs)("div", {
       className: className,
       style: style,
-      children: [breadcrumbDom, renderTitle(prefixCls, props, direction), children && renderChildren(prefixCls, children), renderFooter(prefixCls, footer)]
+      children: [breadcrumbDom, title, childDom, footerDom]
     })
   }));
 };
@@ -72353,62 +72367,57 @@ var _map = [576, 768, 992, 1200].map(function (bp) {
     xl = _map2[3];
 
 var genPageContainerStyle = function genPageContainerStyle(token) {
-  var _extraContent;
+  var _extraContent, _token$componentCls;
 
-  return defineProperty_defineProperty({}, token.componentCls, {
+  return defineProperty_defineProperty({}, token.componentCls, (_token$componentCls = {
     position: 'relative',
     '&-layout-has-margin': {
-      marginBlock: -(token.marginBlockPageContainerContent - 8),
+      marginBlock: token.marginBlockPageContainerContent,
       marginInline: -token.marginInlinePageContainerContent
     },
     '&-children-content': {
-      marginBlock: token.marginBlockPageContainerContent - 8,
+      marginBlock: token.marginBlockPageContainerContent,
       marginInline: token.marginInlinePageContainerContent
     },
     '&-affix': defineProperty_defineProperty({}, "".concat(token.antCls, "-affix"), defineProperty_defineProperty({}, "".concat(token.componentCls, "-warp"), {
       backgroundColor: token.colorBgPageContainerFixed,
       boxShadow: '0 2px 8px #f0f1f2'
-    })),
-    '&-warp': defineProperty_defineProperty({
-      backgroundColor: token.colorBgPageContainer
-    }, '& &-page-header', {
-      paddingInlineStart: 40,
-      paddingInlineEnd: 40
-    }),
-    '&-detail': defineProperty_defineProperty({
-      display: 'flex'
-    }, sm, {
-      display: 'block'
-    }),
-    '&-main': {
-      width: '100%'
-    },
-    '&-row': defineProperty_defineProperty({
-      display: 'flex',
-      width: '100%'
-    }, md, {
-      display: 'block'
-    }),
-    '&-content': {
-      flex: 'auto',
-      width: '100%'
-    },
-    '&-extraContent': (_extraContent = {
-      flex: '0 1 auto',
-      minWidth: '242px',
-      marginInlineStart: 88,
-      textAlign: 'end'
-    }, defineProperty_defineProperty(_extraContent, sm, {
-      marginInlineStart: 0
-    }), defineProperty_defineProperty(_extraContent, md, {
-      marginInlineStart: 0,
-      textAlign: 'start'
-    }), defineProperty_defineProperty(_extraContent, lg, {
-      marginInlineStart: 20
-    }), defineProperty_defineProperty(_extraContent, xl, {
-      marginInlineStart: 44
-    }), _extraContent)
-  });
+    }))
+  }, defineProperty_defineProperty(_token$componentCls, '& &-warp-page-header', defineProperty_defineProperty({
+    marginBlock: token.marginBlockPageContainerContent / 2,
+    paddingInlineStart: 40,
+    paddingInlineEnd: 40
+  }, "& ~ ".concat(token.proComponentsCls, "-grid-content"), defineProperty_defineProperty({}, "".concat(token.proComponentsCls, "-page-container-children-content"), {
+    marginBlock: token.marginBlockPageContainerContent / 3
+  }))), defineProperty_defineProperty(_token$componentCls, '&-detail', defineProperty_defineProperty({
+    display: 'flex'
+  }, sm, {
+    display: 'block'
+  })), defineProperty_defineProperty(_token$componentCls, '&-main', {
+    width: '100%'
+  }), defineProperty_defineProperty(_token$componentCls, '&-row', defineProperty_defineProperty({
+    display: 'flex',
+    width: '100%'
+  }, md, {
+    display: 'block'
+  })), defineProperty_defineProperty(_token$componentCls, '&-content', {
+    flex: 'auto',
+    width: '100%'
+  }), defineProperty_defineProperty(_token$componentCls, '&-extraContent', (_extraContent = {
+    flex: '0 1 auto',
+    minWidth: '242px',
+    marginInlineStart: 88,
+    textAlign: 'end'
+  }, defineProperty_defineProperty(_extraContent, sm, {
+    marginInlineStart: 0
+  }), defineProperty_defineProperty(_extraContent, md, {
+    marginInlineStart: 0,
+    textAlign: 'start'
+  }), defineProperty_defineProperty(_extraContent, lg, {
+    marginInlineStart: 20
+  }), defineProperty_defineProperty(_extraContent, xl, {
+    marginInlineStart: 44
+  }), _extraContent)), _token$componentCls));
 };
 
 function PageContainer_style_useStyle(prefixCls) {
@@ -72428,7 +72437,7 @@ function PageContainer_style_useStyle(prefixCls) {
 
 
 
-var PageContainer_excluded = ["title", "content", "pageHeaderRender", "header", "prefixedClassName", "extraContent", "style", "prefixCls", "breadcrumbRender"],
+var PageContainer_excluded = ["title", "content", "pageHeaderRender", "header", "prefixedClassName", "extraContent", "style", "prefixCls", "value", "breadcrumbRender"],
     PageContainer_excluded2 = ["children", "loading", "className", "style", "footer", "affixProps", "fixedHeader", "breadcrumbRender"];
 
 
@@ -72444,6 +72453,7 @@ var PageContainer_excluded = ["title", "content", "pageHeaderRender", "header",
 
 
 
+
 function genLoading(spinProps) {
   if (typeof_typeof(spinProps) === 'object') {
     return spinProps;
@@ -72536,11 +72546,9 @@ var ProBreadcrumb = function ProBreadcrumb(props) {
   });
 };
 
-var ProPageHeader = function ProPageHeader(props) {
+var memoRenderPageHeader = function memoRenderPageHeader(props) {
   var _breadcrumb$routes;
 
-  var value = (0,external_React_.useContext)(RouteContext);
-
   var title = props.title,
       content = props.content,
       pageHeaderRender = props.pageHeaderRender,
@@ -72549,16 +72557,17 @@ var ProPageHeader = function ProPageHeader(props) {
       extraContent = props.extraContent,
       style = props.style,
       prefixCls = props.prefixCls,
+      value = props.value,
       breadcrumbRender = props.breadcrumbRender,
       restProps = objectWithoutProperties_objectWithoutProperties(props, PageContainer_excluded);
 
-  var getBreadcrumbRender = (0,external_React_.useMemo)(function () {
+  var getBreadcrumbRender = function getBreadcrumbRender() {
     if (!breadcrumbRender) {
       return undefined;
     }
 
     return breadcrumbRender;
-  }, [breadcrumbRender]);
+  };
 
   if (pageHeaderRender === false) {
     return null;
@@ -72594,16 +72603,13 @@ var ProPageHeader = function ProPageHeader(props) {
     return null;
   }
 
-  return (0,jsx_runtime.jsx)("div", {
-    className: "".concat(prefixedClassName, "-warp"),
-    children: (0,jsx_runtime.jsx)(PageHeader, objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, pageHeaderProps), {}, {
-      className: "".concat(prefixedClassName, "-warp-page-header"),
-      breadcrumb: breadcrumbRender === false ? undefined : objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, pageHeaderProps.breadcrumb), value.breadcrumbProps),
-      breadcrumbRender: getBreadcrumbRender,
-      prefixCls: prefixCls,
-      children: (header === null || header === void 0 ? void 0 : header.children) || renderPageHeader(content, extraContent, prefixedClassName)
-    }))
-  });
+  return (0,jsx_runtime.jsx)(PageHeader, objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, pageHeaderProps), {}, {
+    className: "".concat(prefixedClassName, "-warp-page-header"),
+    breadcrumb: breadcrumbRender === false ? undefined : objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, pageHeaderProps.breadcrumb), value.breadcrumbProps),
+    breadcrumbRender: getBreadcrumbRender(),
+    prefixCls: prefixCls,
+    children: (header === null || header === void 0 ? void 0 : header.children) || renderPageHeader(content, extraContent, prefixedClassName)
+  }));
 };
 
 var PageContainer = function PageContainer(props) {
@@ -72635,33 +72641,19 @@ var PageContainer = function PageContainer(props) {
       wrapSSR = _useStyle.wrapSSR,
       hashId = _useStyle.hashId;
 
-  var content = (0,external_React_.useMemo)(function () {
-    return children ? (0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
-      children: [(0,jsx_runtime.jsx)("div", {
-        className: "".concat(basePageContainer, "-children-content"),
-        children: children
-      }), value.hasFooterToolbar && (0,jsx_runtime.jsx)("div", {
-        style: {
-          height: 64,
-          marginBlockStart: pageContainer.marginBlockPageContainerContent
-        }
-      })]
-    }) : null;
-  }, [children, basePageContainer, value.hasFooterToolbar, pageContainer.marginBlockPageContainerContent]);
   var memoBreadcrumbRender = (0,external_React_.useMemo)(function () {
     var _restProps$header;
 
     if (breadcrumbRender == false) return false;
     return breadcrumbRender || (restProps === null || restProps === void 0 ? void 0 : (_restProps$header = restProps.header) === null || _restProps$header === void 0 ? void 0 : _restProps$header.breadcrumbRender);
   }, [breadcrumbRender, restProps === null || restProps === void 0 ? void 0 : (_restProps$header2 = restProps.header) === null || _restProps$header2 === void 0 ? void 0 : _restProps$header2.breadcrumbRender]);
-
-  var pageHeaderDom = (0,jsx_runtime.jsx)(ProPageHeader, objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, restProps), {}, {
+  var pageHeaderDom = memoRenderPageHeader(objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, restProps), {}, {
     breadcrumbRender: memoBreadcrumbRender,
     ghost: true,
     prefixCls: undefined,
-    prefixedClassName: basePageContainer
+    prefixedClassName: basePageContainer,
+    value: value
   }));
-
   var loadingDom = (0,external_React_.useMemo)(function () {
     // 当loading时一个合法的ReactNode时，说明用户使用了自定义loading,直接返回改自定义loading
     if ( /*#__PURE__*/external_React_default().isValidElement(loading)) {
@@ -72678,6 +72670,19 @@ var PageContainer = function PageContainer(props) {
 
     return spinProps.spinning ? (0,jsx_runtime.jsx)(PageLoading, objectSpread2_objectSpread2({}, spinProps)) : null;
   }, [loading]);
+  var content = (0,external_React_.useMemo)(function () {
+    return children ? (0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
+      children: [(0,jsx_runtime.jsx)("div", {
+        className: classnames_default()("".concat(basePageContainer, "-children-content")),
+        children: children
+      }), value.hasFooterToolbar && (0,jsx_runtime.jsx)("div", {
+        style: {
+          height: 64,
+          marginBlockStart: pageContainer.marginBlockPageContainerContent
+        }
+      })]
+    }) : null;
+  }, [children, basePageContainer, value.hasFooterToolbar, pageContainer.marginBlockPageContainerContent]);
   var renderContentDom = (0,external_React_.useMemo)(function () {
     // 只要loadingDom非空我们就渲染loadingDom,否则渲染内容
     var dom = loadingDom || content;
@@ -72692,9 +72697,9 @@ var PageContainer = function PageContainer(props) {
 
     return dom;
   }, [props.waterMarkProps, value.waterMarkProps, loadingDom, content]);
-  var containerClassName = classnames_default()(basePageContainer, hashId, className, (_classNames = {}, defineProperty_defineProperty(_classNames, "".concat(basePageContainer, "-layout-has-margin"), value.disableContentMargin !== undefined && !value.disableContentMargin), defineProperty_defineProperty(_classNames, "".concat(basePageContainer, "-ghost"), true), defineProperty_defineProperty(_classNames, "".concat(basePageContainer, "-with-footer"), footer), defineProperty_defineProperty(_classNames, "".concat(basePageContainer, "-with-affix"), fixedHeader && pageHeaderDom), _classNames));
+  var containerClassName = classnames_default()(basePageContainer, hashId, className, (_classNames = {}, defineProperty_defineProperty(_classNames, "".concat(basePageContainer, "-ghost"), true), defineProperty_defineProperty(_classNames, "".concat(basePageContainer, "-with-footer"), footer), defineProperty_defineProperty(_classNames, "".concat(basePageContainer, "-with-affix"), fixedHeader && pageHeaderDom), _classNames));
   var token = (0,external_React_.useContext)(ProLayoutContext);
-  return wrapSSR((0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
+  return wrapSSR((0,jsx_runtime.jsxs)(ConfigProviderWrap, {
     children: [(0,jsx_runtime.jsxs)("div", {
       style: style,
       className: containerClassName,
@@ -72714,6 +72719,13 @@ var PageContainer = function PageContainer(props) {
   }));
 };
 
+var ProPageHeader = function ProPageHeader(props) {
+  var value = (0,external_React_.useContext)(RouteContext);
+  return memoRenderPageHeader(objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, props), {}, {
+    value: value
+  }));
+};
+
 
 ;// CONCATENATED MODULE: ./node_modules/@ant-design/icons-svg/es/asn/CopyrightOutlined.js
 // This icon file is generated automatically.
@@ -76224,6 +76236,7 @@ var genSettingDrawerStyle = function genSettingDrawerStyle(token) {
         boxShadow: '0 1px 2.5px 0 rgba(0, 0, 0, 0.18)',
         cursor: 'pointer',
         fontSize: 56,
+        lineHeight: '56px',
         '&::before': {
           position: 'absolute',
           insetBlockStart: 0,
@@ -79689,13 +79702,10 @@ var useCurrentMenuLayoutProps = function useCurrentMenuLayoutProps(currentMenu)
 
 
 var WrapContent = function WrapContent(props) {
-  var _classNames;
-
   var style = props.style,
       prefixCls = props.prefixCls,
-      children = props.children,
-      disableContentMargin = props.disableContentMargin;
-  var contentClassName = classnames_default()("".concat(prefixCls, "-content"), (_classNames = {}, defineProperty_defineProperty(_classNames, "".concat(prefixCls, "-has-header"), props.hasHeader), defineProperty_defineProperty(_classNames, "".concat(prefixCls, "-content-has-margin"), !disableContentMargin), _classNames));
+      children = props.children;
+  var contentClassName = classnames_default()("".concat(prefixCls, "-content"), defineProperty_defineProperty({}, "".concat(prefixCls, "-has-header"), props.hasHeader));
   var ErrorComponent = props.ErrorBoundary || ErrorBoundary;
   return props.ErrorBoundary === false ? (0,jsx_runtime.jsx)(external_antd_.Layout.Content, {
     className: contentClassName,
@@ -79892,8 +79902,6 @@ var BaseProLayout = function BaseProLayout(props) {
       route = _ref3.route,
       defaultCollapsed = _ref3.defaultCollapsed,
       style = _ref3.style,
-      _ref3$disableContentM = _ref3.disableContentMargin,
-      disableContentMargin = _ref3$disableContentM === void 0 ? true : _ref3$disableContentM,
       propsSiderWidth = _ref3.siderWidth,
       menu = _ref3.menu,
       siderMenuType = _ref3.siderMenuType,
@@ -80164,7 +80172,6 @@ var BaseProLayout = function BaseProLayout(props) {
         hasHeader: !!headerDom,
         siderWidth: leftSiderWidth,
         hasFooter: !!footerDom,
-        disableContentMargin: disableContentMargin,
         hasFooterToolbar: hasFooterToolbar,
         setHasFooterToolbar: setHasFooterToolbar,
         pageTitleInfo: pageTitleInfo,
@@ -80187,7 +80194,6 @@ var BaseProLayout = function BaseProLayout(props) {
             style: genLayoutStyle,
             className: context.getPrefixCls('layout'),
             children: [headerDom, (0,jsx_runtime.jsx)(WrapContent, objectSpread2_objectSpread2(objectSpread2_objectSpread2({
-              disableContentMargin: disableContentMargin,
               autoClearCache: false,
               isChildrenLayout: isChildrenLayout
             }, rest), {}, {
@@ -106850,17 +106856,17 @@ function BaseProList(props) {
 /* harmony default export */ var list_es = ((/* unused pure expression or super */ null && (ProList)));
 ;// CONCATENATED MODULE: ./packages/components/src/version.ts
 var version_version = {
-  "@ant-design/pro-card": "2.0.0-experimental.14",
-  "@ant-design/pro-components": "2.0.0-experimental.22",
-  "@ant-design/pro-descriptions": "2.0.0-experimental.14",
-  "@ant-design/pro-field": "2.0.0-experimental.14",
-  "@ant-design/pro-form": "2.0.0-experimental.14",
-  "@ant-design/pro-layout": "7.0.0-experimental.22",
-  "@ant-design/pro-list": "2.0.0-experimental.15",
-  "@ant-design/pro-provider": "2.0.0-experimental.9",
+  "@ant-design/pro-card": "2.0.0-experimental.15",
+  "@ant-design/pro-components": "2.0.0-experimental.25",
+  "@ant-design/pro-descriptions": "2.0.0-experimental.15",
+  "@ant-design/pro-field": "2.0.0-experimental.15",
+  "@ant-design/pro-form": "2.0.0-experimental.15",
+  "@ant-design/pro-layout": "7.0.0-experimental.25",
+  "@ant-design/pro-list": "2.0.0-experimental.16",
+  "@ant-design/pro-provider": "2.0.0-experimental.10",
   "@ant-design/pro-skeleton": "2.0.0-experimental.7",
-  "@ant-design/pro-table": "3.0.0-experimental.15",
-  "@ant-design/pro-utils": "2.0.0-experimental.14"
+  "@ant-design/pro-table": "3.0.0-experimental.16",
+  "@ant-design/pro-utils": "2.0.0-experimental.15"
 };
 ;// CONCATENATED MODULE: ./packages/components/src/index.tsx