@ant-design/pro-components 2.0.0-experimental.21 → 2.0.0-experimental.24

package/dist/components.js

@@ -71580,7 +71580,7 @@ var genFooterToolBarStyle = function genFooterToolBarStyle(token) {
     lineHeight: '64px',
 
     /* A way to reset the style of the component. */
-    backgroundColor: token.probgLayout || 'rgba(255, 255, 255, 0.58)',
+    backgroundColor: 'rgba(255, 255, 255, 0.58)',
     borderTop: "1px solid ".concat(token.colorSplit),
     '-webkit-backdrop-filter': 'blur(8px)',
     backdropFilter: 'blur(8px)',
@@ -71827,7 +71827,7 @@ var getLayoutDesignToken = function getLayoutDesignToken(designTokens, antdToken
     }, finalDesignTokens.sider),
     pageContainer: objectSpread2_objectSpread2({
       colorBgPageContainer: 'transparent',
-      marginBlockPageContainerContent: 24,
+      marginBlockPageContainerContent: 16,
       marginInlinePageContainerContent: 40,
       colorBgPageContainerFixed: '#fff'
     }, finalDesignTokens.pageContainer)
@@ -72358,11 +72358,11 @@ var genPageContainerStyle = function genPageContainerStyle(token) {
   return defineProperty_defineProperty({}, token.componentCls, {
     position: 'relative',
     '&-layout-has-margin': {
-      marginBlock: -24,
-      marginInline: -24
+      marginBlock: -(token.marginBlockPageContainerContent - 8),
+      marginInline: -token.marginInlinePageContainerContent
     },
     '&-children-content': {
-      marginBlock: token.marginBlockPageContainerContent,
+      marginBlock: token.marginBlockPageContainerContent - 8,
       marginInline: token.marginInlinePageContainerContent
     },
     '&-affix': defineProperty_defineProperty({}, "".concat(token.antCls, "-affix"), defineProperty_defineProperty({}, "".concat(token.componentCls, "-warp"), {
@@ -72622,8 +72622,11 @@ var PageContainer = function PageContainer(props) {
 
   var value = (0,external_React_.useContext)(RouteContext);
 
-  var _useContext = (0,external_React_.useContext)(external_antd_.ConfigProvider.ConfigContext),
-      getPrefixCls = _useContext.getPrefixCls;
+  var _useContext = (0,external_React_.useContext)(ProLayoutContext),
+      pageContainer = _useContext.pageContainer;
+
+  var _useContext2 = (0,external_React_.useContext)(external_antd_.ConfigProvider.ConfigContext),
+      getPrefixCls = _useContext2.getPrefixCls;
 
   var prefixCls = props.prefixCls || getPrefixCls('pro');
   var basePageContainer = "".concat(prefixCls, "-page-container");
@@ -72639,12 +72642,12 @@ var PageContainer = function PageContainer(props) {
         children: children
       }), value.hasFooterToolbar && (0,jsx_runtime.jsx)("div", {
         style: {
-          height: 48,
-          marginBlockStart: 24
+          height: 64,
+          marginBlockStart: pageContainer.marginBlockPageContainerContent
         }
       })]
     }) : null;
-  }, [children, basePageContainer, value.hasFooterToolbar]);
+  }, [children, basePageContainer, value.hasFooterToolbar, pageContainer.marginBlockPageContainerContent]);
   var memoBreadcrumbRender = (0,external_React_.useMemo)(function () {
     var _restProps$header;
 
@@ -72763,9 +72766,12 @@ var style_genFooterToolBarStyle = function genFooterToolBarStyle(token) {
     paddingBlock: 0,
     paddingInline: 16,
     textAlign: 'center',
-    '&-links': {
+    '&-list': {
       marginBlockEnd: 8,
       color: token.colorTextSecondary,
+      '&-link': {
+        color: token.colorTextSecondary
+      },
       '*:not(:last-child)': {
         marginInlineEnd: 8,
         '&:hover': {
@@ -72817,9 +72823,10 @@ var GlobalFooter = function GlobalFooter(_ref) {
     className: classnames_default()(baseClassName, hashId, className),
     style: style,
     children: [links && (0,jsx_runtime.jsx)("div", {
-      className: "".concat(baseClassName, "-links"),
+      className: "".concat(baseClassName, "-list"),
       children: links.map(function (link) {
         return (0,jsx_runtime.jsx)("a", {
+          className: "".concat(baseClassName, "-list-link"),
           title: link.key,
           target: link.blankTarget ? '_blank' : '_self',
           href: link.href,
@@ -74584,8 +74591,7 @@ var SiderMenu = function SiderMenu(props) {
   });
 
   var _useContext = (0,external_React_.useContext)(ProLayoutContext),
-      sider = _useContext.sider,
-      header = _useContext.header;
+      sider = _useContext.sider;
 
   return (0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
     children: [fixSiderbar && !isMobile && !hideMenuWhenCollapsedClassName && (0,jsx_runtime.jsx)("div", {
@@ -74595,9 +74601,7 @@ var SiderMenu = function SiderMenu(props) {
         flex: "0 0 ".concat(collapsed ? collapsedWidth : siderWidth, "px"),
         maxWidth: collapsed ? collapsedWidth : siderWidth,
         minWidth: collapsed ? collapsedWidth : siderWidth,
-        transition: 'all 0.2s ease 0s',
-        height: "calc(100% - ".concat(header.heightLayoutHeader, "px)"),
-        marginBlockStart: "".concat(header.heightLayoutHeader, "px")
+        transition: 'all 0.2s ease 0s'
       }, style)
     }), (0,jsx_runtime.jsxs)(Sider, {
       collapsible: true,
@@ -75434,6 +75438,9 @@ var darkreader = __webpack_require__(897);
   'app.setting.themecolor.daybreak': 'Daybreak Blue',
   'app.setting.themecolor.geekblue': 'Geek Blue',
   'app.setting.themecolor.purple': 'Golden Purple',
+  'app.setting.sidermenutype': 'SideMenu Type',
+  'app.setting.sidermenutype-sub': 'Classic',
+  'app.setting.sidermenutype-group': 'Grouping',
   'app.setting.navigationmode': 'Navigation Mode',
   'app.setting.regionalsettings': 'Regional Settings',
   'app.setting.regionalsettings.header': 'Header',
@@ -75563,6 +75570,9 @@ var darkreader = __webpack_require__(897);
   'app.setting.themecolor.geekblue': '极客蓝',
   'app.setting.themecolor.purple': '酱紫',
   'app.setting.navigationmode': '导航模式',
+  'app.setting.sidermenutype': '侧边菜单类型',
+  'app.setting.sidermenutype-sub': '经典模式',
+  'app.setting.sidermenutype-group': '分组模式',
   'app.setting.regionalsettings': '内容区域',
   'app.setting.regionalsettings.header': '顶栏',
   'app.setting.regionalsettings.menu': '菜单',
@@ -75670,17 +75680,20 @@ var BlockCheckbox = function BlockCheckbox(_ref) {
     var domList = (list || []).map(function (item) {
       return (0,jsx_runtime.jsx)(external_antd_.Tooltip, {
         title: item.title,
-        children: (0,jsx_runtime.jsx)("div", {
+        children: (0,jsx_runtime.jsxs)("div", {
           className: classnames_default()("".concat(baseClassName, "-item"), "".concat(baseClassName, "-item-").concat(item.key), "".concat(baseClassName, "-").concat(configType, "-item")),
           onClick: function onClick() {
             return onChange(item.key);
           },
-          children: (0,jsx_runtime.jsx)(icons_CheckOutlined, {
+          children: [(0,jsx_runtime.jsx)(icons_CheckOutlined, {
             className: "".concat(baseClassName, "-selectIcon"),
             style: {
               display: value === item.key ? 'block' : 'none'
             }
-          })
+          }), (item === null || item === void 0 ? void 0 : item.icon) ? (0,jsx_runtime.jsx)("div", {
+            className: "".concat(baseClassName, "-icon"),
+            children: item.icon
+          }) : null]
         })
       }, item.key);
     });
@@ -75693,6 +75706,321 @@ var BlockCheckbox = function BlockCheckbox(_ref) {
 };
 
 
+;// CONCATENATED MODULE: ./packages/layout/es/components/SettingDrawer/icon/group.js
+
+function GroupIcon() {
+  return (0,jsx_runtime.jsxs)("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    xmlnsXlink: "http://www.w3.org/1999/xlink",
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 104 104",
+    children: [(0,jsx_runtime.jsxs)("defs", {
+      children: [(0,jsx_runtime.jsx)("rect", {
+        id: "path-1",
+        width: "90",
+        height: "72",
+        x: "0",
+        y: "0",
+        rx: "10"
+      }), (0,jsx_runtime.jsxs)("filter", {
+        id: "filter-2",
+        width: "152.2%",
+        height: "165.3%",
+        x: "-26.1%",
+        y: "-27.1%",
+        filterUnits: "objectBoundingBox",
+        children: [(0,jsx_runtime.jsx)("feMorphology", {
+          in: "SourceAlpha",
+          radius: "0.25",
+          result: "shadowSpreadOuter1"
+        }), (0,jsx_runtime.jsx)("feOffset", {
+          dy: "1",
+          in: "shadowSpreadOuter1",
+          result: "shadowOffsetOuter1"
+        }), (0,jsx_runtime.jsx)("feGaussianBlur", {
+          in: "shadowOffsetOuter1",
+          result: "shadowBlurOuter1",
+          stdDeviation: "1"
+        }), (0,jsx_runtime.jsx)("feColorMatrix", {
+          in: "shadowBlurOuter1",
+          result: "shadowMatrixOuter1",
+          values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.08 0"
+        }), (0,jsx_runtime.jsx)("feMorphology", {
+          in: "SourceAlpha",
+          radius: "1",
+          result: "shadowSpreadOuter2"
+        }), (0,jsx_runtime.jsx)("feOffset", {
+          dy: "2",
+          in: "shadowSpreadOuter2",
+          result: "shadowOffsetOuter2"
+        }), (0,jsx_runtime.jsx)("feGaussianBlur", {
+          in: "shadowOffsetOuter2",
+          result: "shadowBlurOuter2",
+          stdDeviation: "4"
+        }), (0,jsx_runtime.jsx)("feColorMatrix", {
+          in: "shadowBlurOuter2",
+          result: "shadowMatrixOuter2",
+          values: "0 0 0 0 0.098466735 0 0 0 0 0.0599695403 0 0 0 0 0.0599695403 0 0 0 0.07 0"
+        }), (0,jsx_runtime.jsx)("feMorphology", {
+          in: "SourceAlpha",
+          radius: "2",
+          result: "shadowSpreadOuter3"
+        }), (0,jsx_runtime.jsx)("feOffset", {
+          dy: "4",
+          in: "shadowSpreadOuter3",
+          result: "shadowOffsetOuter3"
+        }), (0,jsx_runtime.jsx)("feGaussianBlur", {
+          in: "shadowOffsetOuter3",
+          result: "shadowBlurOuter3",
+          stdDeviation: "8"
+        }), (0,jsx_runtime.jsx)("feColorMatrix", {
+          in: "shadowBlurOuter3",
+          result: "shadowMatrixOuter3",
+          values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0"
+        }), (0,jsx_runtime.jsxs)("feMerge", {
+          children: [(0,jsx_runtime.jsx)("feMergeNode", {
+            in: "shadowMatrixOuter1"
+          }), (0,jsx_runtime.jsx)("feMergeNode", {
+            in: "shadowMatrixOuter2"
+          }), (0,jsx_runtime.jsx)("feMergeNode", {
+            in: "shadowMatrixOuter3"
+          })]
+        })]
+      })]
+    }), (0,jsx_runtime.jsxs)("g", {
+      fill: "none",
+      fillRule: "evenodd",
+      stroke: "none",
+      strokeWidth: "1",
+      children: [(0,jsx_runtime.jsxs)("g", {
+        children: [(0,jsx_runtime.jsx)("use", {
+          fill: "#000",
+          filter: "url(#filter-2)",
+          xlinkHref: "#path-1"
+        }), (0,jsx_runtime.jsx)("use", {
+          fill: "#F0F2F5",
+          xlinkHref: "#path-1"
+        })]
+      }), (0,jsx_runtime.jsx)("path", {
+        fill: "#FFF",
+        d: "M25 15h65v47c0 5.523-4.477 10-10 10H25V15z"
+      }), (0,jsx_runtime.jsx)("path", {
+        stroke: "#E6EAF0",
+        strokeLinecap: "square",
+        d: "M0.5 15.5L90.5 15.5"
+      }), (0,jsx_runtime.jsx)("rect", {
+        width: "14",
+        height: "3",
+        x: "4",
+        y: "26",
+        fill: "#D7DDE6",
+        rx: "1.5"
+      }), (0,jsx_runtime.jsx)("rect", {
+        width: "9",
+        height: "3",
+        x: "4",
+        y: "32",
+        fill: "#D7DDE6",
+        rx: "1.5"
+      }), (0,jsx_runtime.jsx)("rect", {
+        width: "9",
+        height: "3",
+        x: "4",
+        y: "42",
+        fill: "#E6EAF0",
+        rx: "1.5"
+      }), (0,jsx_runtime.jsx)("rect", {
+        width: "9",
+        height: "3",
+        x: "4",
+        y: "21",
+        fill: "#E6EAF0",
+        rx: "1.5"
+      }), (0,jsx_runtime.jsx)("rect", {
+        width: "9",
+        height: "3",
+        x: "4",
+        y: "53",
+        fill: "#D7DDE6",
+        rx: "1.5"
+      }), (0,jsx_runtime.jsx)("rect", {
+        width: "14",
+        height: "3",
+        x: "4",
+        y: "47",
+        fill: "#D7DDE6",
+        rx: "1.5"
+      }), (0,jsx_runtime.jsx)("path", {
+        stroke: "#E6EAF0",
+        strokeLinecap: "square",
+        d: "M25.5 15.5L25.5 72.5"
+      })]
+    })]
+  });
+}
+;// CONCATENATED MODULE: ./packages/layout/es/components/SettingDrawer/icon/sub.js
+
+function SubIcon() {
+  return (0,jsx_runtime.jsxs)("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    xmlnsXlink: "http://www.w3.org/1999/xlink",
+    width: "1em",
+    height: "1em",
+    viewBox: "0 0 104 104",
+    children: [(0,jsx_runtime.jsxs)("defs", {
+      children: [(0,jsx_runtime.jsx)("rect", {
+        id: "path-1",
+        width: "90",
+        height: "72",
+        x: "0",
+        y: "0",
+        rx: "10"
+      }), (0,jsx_runtime.jsxs)("filter", {
+        id: "filter-2",
+        width: "152.2%",
+        height: "165.3%",
+        x: "-26.1%",
+        y: "-27.1%",
+        filterUnits: "objectBoundingBox",
+        children: [(0,jsx_runtime.jsx)("feMorphology", {
+          in: "SourceAlpha",
+          radius: "0.25",
+          result: "shadowSpreadOuter1"
+        }), (0,jsx_runtime.jsx)("feOffset", {
+          dy: "1",
+          in: "shadowSpreadOuter1",
+          result: "shadowOffsetOuter1"
+        }), (0,jsx_runtime.jsx)("feGaussianBlur", {
+          in: "shadowOffsetOuter1",
+          result: "shadowBlurOuter1",
+          stdDeviation: "1"
+        }), (0,jsx_runtime.jsx)("feColorMatrix", {
+          in: "shadowBlurOuter1",
+          result: "shadowMatrixOuter1",
+          values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.08 0"
+        }), (0,jsx_runtime.jsx)("feMorphology", {
+          in: "SourceAlpha",
+          radius: "1",
+          result: "shadowSpreadOuter2"
+        }), (0,jsx_runtime.jsx)("feOffset", {
+          dy: "2",
+          in: "shadowSpreadOuter2",
+          result: "shadowOffsetOuter2"
+        }), (0,jsx_runtime.jsx)("feGaussianBlur", {
+          in: "shadowOffsetOuter2",
+          result: "shadowBlurOuter2",
+          stdDeviation: "4"
+        }), (0,jsx_runtime.jsx)("feColorMatrix", {
+          in: "shadowBlurOuter2",
+          result: "shadowMatrixOuter2",
+          values: "0 0 0 0 0.098466735 0 0 0 0 0.0599695403 0 0 0 0 0.0599695403 0 0 0 0.07 0"
+        }), (0,jsx_runtime.jsx)("feMorphology", {
+          in: "SourceAlpha",
+          radius: "2",
+          result: "shadowSpreadOuter3"
+        }), (0,jsx_runtime.jsx)("feOffset", {
+          dy: "4",
+          in: "shadowSpreadOuter3",
+          result: "shadowOffsetOuter3"
+        }), (0,jsx_runtime.jsx)("feGaussianBlur", {
+          in: "shadowOffsetOuter3",
+          result: "shadowBlurOuter3",
+          stdDeviation: "8"
+        }), (0,jsx_runtime.jsx)("feColorMatrix", {
+          in: "shadowBlurOuter3",
+          result: "shadowMatrixOuter3",
+          values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0"
+        }), (0,jsx_runtime.jsxs)("feMerge", {
+          children: [(0,jsx_runtime.jsx)("feMergeNode", {
+            in: "shadowMatrixOuter1"
+          }), (0,jsx_runtime.jsx)("feMergeNode", {
+            in: "shadowMatrixOuter2"
+          }), (0,jsx_runtime.jsx)("feMergeNode", {
+            in: "shadowMatrixOuter3"
+          })]
+        })]
+      })]
+    }), (0,jsx_runtime.jsxs)("g", {
+      fill: "none",
+      fillRule: "evenodd",
+      stroke: "none",
+      strokeWidth: "1",
+      children: [(0,jsx_runtime.jsxs)("g", {
+        children: [(0,jsx_runtime.jsx)("use", {
+          fill: "#000",
+          filter: "url(#filter-2)",
+          xlinkHref: "#path-1"
+        }), (0,jsx_runtime.jsx)("use", {
+          fill: "#F0F2F5",
+          xlinkHref: "#path-1"
+        })]
+      }), (0,jsx_runtime.jsx)("path", {
+        fill: "#FFF",
+        d: "M26 0h55c5.523 0 10 4.477 10 10v8H26V0z"
+      }), (0,jsx_runtime.jsx)("path", {
+        fill: "#001529",
+        d: "M10 0h19v72H10C4.477 72 0 67.523 0 62V10C0 4.477 4.477 0 10 0z"
+      }), (0,jsx_runtime.jsx)("rect", {
+        width: "14",
+        height: "3",
+        x: "5",
+        y: "18",
+        fill: "#D7DDE6",
+        opacity: "0.2",
+        rx: "1.5"
+      }), (0,jsx_runtime.jsx)("rect", {
+        width: "14",
+        height: "3",
+        x: "5",
+        y: "42",
+        fill: "#D7DDE6",
+        opacity: "0.2",
+        rx: "1.5"
+      }), (0,jsx_runtime.jsx)("rect", {
+        width: "9",
+        height: "3",
+        x: "9",
+        y: "24",
+        fill: "#D7DDE6",
+        opacity: "0.2",
+        rx: "1.5"
+      }), (0,jsx_runtime.jsx)("rect", {
+        width: "9",
+        height: "3",
+        x: "9",
+        y: "48",
+        fill: "#D7DDE6",
+        opacity: "0.2",
+        rx: "1.5"
+      }), (0,jsx_runtime.jsx)("rect", {
+        width: "9",
+        height: "3",
+        x: "9",
+        y: "36",
+        fill: "#D7DDE6",
+        opacity: "0.2",
+        rx: "1.5"
+      }), (0,jsx_runtime.jsx)("rect", {
+        width: "14",
+        height: "3",
+        x: "9",
+        y: "30",
+        fill: "#D7DDE6",
+        opacity: "0.2",
+        rx: "1.5"
+      }), (0,jsx_runtime.jsx)("rect", {
+        width: "14",
+        height: "3",
+        x: "9",
+        y: "54",
+        fill: "#D7DDE6",
+        opacity: "0.2",
+        rx: "1.5"
+      })]
+    })]
+  });
+}
 ;// CONCATENATED MODULE: ./packages/layout/es/components/SettingDrawer/LayoutChange.js
 
 
@@ -75892,17 +76220,17 @@ var genSettingDrawerStyle = function genSettingDrawerStyle(token) {
         height: '36px',
         marginInlineEnd: '16px',
         overflow: 'hidden',
-        backgroundColor: '#f7f8fa',
         borderRadius: '4px',
         boxShadow: '0 1px 2.5px 0 rgba(0, 0, 0, 0.18)',
         cursor: 'pointer',
+        fontSize: 56,
+        lineHeight: 56,
         '&::before': {
           position: 'absolute',
           insetBlockStart: 0,
           insetInlineStart: 0,
           width: '33%',
           height: '100%',
-          backgroundColor: '#fff',
           content: "''"
         },
         '&::after': {
@@ -75911,7 +76239,6 @@ var genSettingDrawerStyle = function genSettingDrawerStyle(token) {
           insetInlineStart: 0,
           width: '100%',
           height: '25%',
-          backgroundColor: '#fff',
           content: "''"
         },
         '&-realDark': {
@@ -75933,6 +76260,7 @@ var genSettingDrawerStyle = function genSettingDrawerStyle(token) {
           }
         },
         '&-dark,&-side': {
+          backgroundColor: '#f7f8fa',
           '&::before': {
             zIndex: '1',
             backgroundColor: '#001529'
@@ -75942,6 +76270,7 @@ var genSettingDrawerStyle = function genSettingDrawerStyle(token) {
           }
         },
         '&-top': {
+          backgroundColor: '#f7f8fa',
           '&::before': {
             backgroundColor: 'transparent'
           },
@@ -75950,15 +76279,16 @@ var genSettingDrawerStyle = function genSettingDrawerStyle(token) {
           }
         },
         '&-mix': {
+          backgroundColor: '#f7f8fa',
           '&::before': {
-            backgroundColor: 'transparent'
+            backgroundColor: token.colorBgContainer
           },
           '&::after': {
             backgroundColor: '#001529'
           }
         }
       },
-      '&-selectIcon': {
+      '& &-selectIcon': {
         position: 'absolute',
         insetInlineEnd: '6px',
         bottom: '4px',
@@ -75974,7 +76304,7 @@ var genSettingDrawerStyle = function genSettingDrawerStyle(token) {
     '&-theme-color': {
       marginBlockStart: '16px',
       overflow: 'hidden',
-      '&-block': {
+      '& &-block': {
         float: 'left',
         width: '20px',
         height: '20px',
@@ -76077,6 +76407,8 @@ var ThemeColor = function ThemeColor(_ref2) {
 
 
 
+
+
 
 
 
@@ -76307,6 +76639,7 @@ var SettingDrawer = function SettingDrawer(props) {
   var _ref4 = settingState || {},
       navTheme = _ref4.navTheme,
       colorPrimary = _ref4.colorPrimary,
+      siderMenuType = _ref4.siderMenuType,
       layout = _ref4.layout,
       colorWeak = _ref4.colorWeak;
 
@@ -76523,7 +76856,33 @@ var SettingDrawer = function SettingDrawer(props) {
                 return changeSetting('layout', value);
               }
             }, "layout")
-          }), (0,jsx_runtime.jsx)(LayoutSetting, {
+          }), settingState.layout == 'side' || settingState.layout == 'mix' ? (0,jsx_runtime.jsx)(Body, {
+            prefixCls: baseClassName,
+            title: formatMessage({
+              id: 'app.setting.sidermenutype'
+            }),
+            children: (0,jsx_runtime.jsx)(BlockCheckbox, {
+              prefixCls: baseClassName,
+              value: siderMenuType,
+              configType: "siderMenuType",
+              list: [{
+                key: 'sub',
+                icon: (0,jsx_runtime.jsx)(SubIcon, {}),
+                title: formatMessage({
+                  id: 'app.setting.sidermenutype-sub'
+                })
+              }, {
+                key: 'group',
+                icon: (0,jsx_runtime.jsx)(GroupIcon, {}),
+                title: formatMessage({
+                  id: 'app.setting.sidermenutype-group'
+                })
+              }],
+              onChange: function onChange(value) {
+                return changeSetting('siderMenuType', value);
+              }
+            }, "siderMenuType")
+          }) : null, (0,jsx_runtime.jsx)(LayoutSetting, {
             settings: settingState,
             changeSetting: changeSetting
           }), (0,jsx_runtime.jsx)(external_antd_.Divider, {}), (0,jsx_runtime.jsx)(Body, {
@@ -79084,6 +79443,7 @@ var genProLayoutStyle = function genProLayoutStyle(token) {
       fontFamily: token.fontFamily
     }
   }, token.proComponentsCls, (_token$proComponentsC = {}, defineProperty_defineProperty(_token$proComponentsC, "& ".concat(token.componentCls), (_$concat12 = {}, defineProperty_defineProperty(_$concat12, "& ".concat(token.antCls, "-layout"), {
+    display: 'flex',
     backgroundColor: 'transparent'
   }), defineProperty_defineProperty(_$concat12, "".concat(token.componentCls, "-content"), {
     display: 'flex',
@@ -79091,9 +79451,6 @@ var genProLayoutStyle = function genProLayoutStyle(token) {
     width: '100%',
     backgroundColor: 'transparent',
     position: 'relative',
-    '> *': {
-      width: '100%'
-    },
     '*': {
       boxSizing: 'border-box'
     },
@@ -79540,6 +79897,7 @@ var BaseProLayout = function BaseProLayout(props) {
       disableContentMargin = _ref3$disableContentM === void 0 ? true : _ref3$disableContentM,
       propsSiderWidth = _ref3.siderWidth,
       menu = _ref3.menu,
+      siderMenuType = _ref3.siderMenuType,
       propsIsChildrenLayout = _ref3.isChildrenLayout,
       menuDataRender = _ref3.menuDataRender,
       actionRef = _ref3.actionRef,
@@ -79701,6 +80059,7 @@ var BaseProLayout = function BaseProLayout(props) {
     formatMessage: formatMessage,
     breadcrumb: breadcrumb,
     menu: objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, menu), {}, {
+      type: siderMenuType || (menu === null || menu === void 0 ? void 0 : menu.type),
       loading: menuLoading
     }),
     layout: propsLayout
@@ -79852,11 +80211,12 @@ BaseProLayout.defaultProps = objectSpread2_objectSpread2(objectSpread2_objectSpr
 });
 
 var ProLayout_ProLayout = function ProLayout(props) {
+  var colorPrimary = props.colorPrimary;
   return (0,jsx_runtime.jsx)(external_antd_.ConfigProvider, {
     theme: {
       token: {
         radiusBase: 4,
-        colorPrimary: '#1677FF',
+        colorPrimary: colorPrimary || '#1677FF',
         colorError: '#ff4d4f',
         colorInfo: '#1677FF'
       }
@@ -106492,11 +106852,11 @@ function BaseProList(props) {
 ;// 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.20",
+  "@ant-design/pro-components": "2.0.0-experimental.23",
   "@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.20",
+  "@ant-design/pro-layout": "7.0.0-experimental.23",
   "@ant-design/pro-list": "2.0.0-experimental.15",
   "@ant-design/pro-provider": "2.0.0-experimental.9",
   "@ant-design/pro-skeleton": "2.0.0-experimental.7",