@ant-design/pro-components 2.0.5 → 2.1.0

package/dist/components.js

@@ -32732,7 +32732,7 @@ __webpack_require__.d(token_namespaceObject, {
   "defaultAlgorithm": function() { return defaultAlgorithm; },
   "defaultTheme": function() { return defaultTheme; },
   "token": function() { return token_token; },
-  "useToken": function() { return useToken; }
+  "useToken": function() { return token_useToken; }
 });
 
 ;// CONCATENATED MODULE: ./node_modules/@babel/runtime/helpers/esm/defineProperty.js
@@ -35935,6 +35935,7 @@ var useSWR = withArgs(useSWRHandler);
 ;// CONCATENATED MODULE: ./packages/provider/es/index.js
 
 
+ //@ts-ignore
 
 
 
@@ -35964,6 +35965,11 @@ var useSWR = withArgs(useSWRHandler);
 
 
 
+
+var _ref = external_antd_.theme || {
+  useToken: function useToken() {}
+},
+    useToken = _ref.useToken;
 
 function get(source, path, defaultValue) {
   // a[3].b -> a.3.b
@@ -36113,13 +36119,16 @@ var CacheClean = function CacheClean() {
  */
 
 
-var ConfigProviderWrap = function ConfigProviderWrap(_ref) {
-  var _children = _ref.children,
-      _ref$autoClearCache = _ref.autoClearCache,
-      autoClearCache = _ref$autoClearCache === void 0 ? false : _ref$autoClearCache;
+var ConfigProviderWrap = function ConfigProviderWrap(_ref2) {
+  var _children = _ref2.children,
+      _ref2$autoClearCache = _ref2.autoClearCache,
+      autoClearCache = _ref2$autoClearCache === void 0 ? false : _ref2$autoClearCache;
 
   var _useContext = (0,external_React_.useContext)(external_antd_.ConfigProvider.ConfigContext),
-      locale = _useContext.locale; // 如果 locale 不存在自动注入的 AntdConfigProvider
+      locale = _useContext.locale;
+
+  var _useToken = useToken === null || useToken === void 0 ? void 0 : useToken(),
+      hashId = _useToken.hashId; // 如果 locale 不存在自动注入的 AntdConfigProvider
 
 
   var Provider = locale === undefined ? external_antd_.ConfigProvider : (external_React_default()).Fragment;
@@ -36152,7 +36161,7 @@ var ConfigProviderWrap = function ConfigProviderWrap(_ref) {
 
       if (proProvide.isDeps) return provide;
       return (0,jsx_runtime.jsx)("div", {
-        className: classnames_default()('ant-pro'),
+        className: classnames_default()('ant-pro', hashId),
         children: provide
       });
     }
@@ -39092,7 +39101,7 @@ var token_token = {
   token: defaultTheme,
   hashId: ''
 };
-var useToken = function useToken() {
+var token_useToken = function useToken() {
   var _useState = (0,external_React_.useState)(token_token),
       _useState2 = slicedToArray_slicedToArray(_useState, 1),
       stateToken = _useState2[0];
@@ -39202,9 +39211,8 @@ function useStyle(componentName, styleFn) {
       path: [componentName]
     }, function () {
       return styleFn(objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, token), {}, {
-        hashId: hashId,
         antCls: '.' + getPrefixCls(),
-        proComponentsCls: hashId + proComponentsCls
+        proComponentsCls: proComponentsCls
       }));
     }),
     hashId: hashId
@@ -43267,8 +43275,31 @@ var transformKeySubmitValue = function transformKeySubmitValue(values, dataForma
       var itemValue = tempValues[entityKey];
       var transformFunction = (0,utils_get["default"])(dataFormatMap, key);
 
+      var _transformArray = function _transformArray(transformFn) {
+        if (!Array.isArray(transformFn)) return entityKey;
+        transformFunction.forEach(function (fn, idx) {
+          if (typeof fn === 'function') {
+            itemValue[idx] = fn(itemValue, entityKey, tempValues);
+          }
+
+          if (typeof_typeof(fn) === 'object' && !Array.isArray(fn)) {
+            Object.keys(fn).forEach(function (curK) {
+              if (typeof fn[curK] === 'function') {
+                var res = fn[curK](tempValues[entityKey][idx][curK], entityKey, tempValues);
+                itemValue[idx][curK] = typeof_typeof(res) === 'object' ? res[curK] : res;
+              }
+            });
+          }
+
+          if (typeof_typeof(fn) === 'object' && Array.isArray(fn)) {
+            _transformArray(fn);
+          }
+        });
+        return entityKey;
+      };
+
       var transform = function transform() {
-        var tempKey = typeof transformFunction === 'function' ? transformFunction === null || transformFunction === void 0 ? void 0 : transformFunction(itemValue, entityKey, tempValues) : entityKey; // { [key:string]:any } 数组也能通过编译
+        var tempKey = typeof transformFunction === 'function' ? transformFunction === null || transformFunction === void 0 ? void 0 : transformFunction(itemValue, entityKey, tempValues) : _transformArray(transformFunction); // { [key:string]:any } 数组也能通过编译
 
         if (Array.isArray(tempKey)) {
           result = (0,set/* default */.Z)(result, tempKey, itemValue);
@@ -45911,6 +45942,7 @@ var Card = /*#__PURE__*/external_React_default().forwardRef(function (props, ref
 
 
   var responsiveArray = ['xxl', 'xl', 'lg', 'md', 'sm', 'xs']; // 修改组合传给antd tabs的参数
+  // @ts-ignore
 
   var ModifyTabItemsContant = tabs === null || tabs === void 0 ? void 0 : (_tabs$items = tabs.items) === null || _tabs$items === void 0 ? void 0 : _tabs$items.map(function (item) {
     return objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, item), {}, {
@@ -46082,6 +46114,7 @@ var Card = /*#__PURE__*/external_React_default().forwardRef(function (props, ref
       children: (0,jsx_runtime.jsx)(external_antd_.Tabs, objectSpread2_objectSpread2(objectSpread2_objectSpread2({
         onChange: tabs.onChange
       }, tabs), {}, {
+        // @ts-ignore
         items: ModifyTabItemsContant,
         children: loading ? loadingDOM : children
       }))
@@ -60543,7 +60576,7 @@ var FieldMoney = function FieldMoney(_ref2, ref) {
 
   if (type === 'edit' || type === 'update') {
     var getFormateValue = function getFormateValue(value) {
-      var reg = new RegExp("\\B(?=(\\d{".concat(3 + (precision - DefaultPrecisionCont), "})+(?!\\d))"), 'g');
+      var reg = new RegExp("\\B(?=(\\d{".concat(3 + Math.max(precision - DefaultPrecisionCont, 0), "})+(?!\\d))"), 'g');
 
       var _String$split = String(value).split('.'),
           _String$split2 = slicedToArray_slicedToArray(_String$split, 2),
@@ -60552,7 +60585,7 @@ var FieldMoney = function FieldMoney(_ref2, ref) {
 
       var resInt = intS.replace(reg, ',');
       var resFloat = '';
-      if (floatS) resFloat = ".".concat(floatS.slice(0, precision === undefined ? DefaultPrecisionCont : precision));
+      if (floatS && precision > 0) resFloat = ".".concat(floatS.slice(0, precision === undefined ? DefaultPrecisionCont : precision));
       return "".concat(resInt).concat(resFloat);
     };
 
@@ -68951,7 +68984,7 @@ var Actions_Actions = function Actions(props) {
 var QueryFilter_style_genProStyle = function genProStyle(token) {
   var _token$componentCls;
 
-  return defineProperty_defineProperty({}, token.proComponentsCls, defineProperty_defineProperty({}, token.componentCls, (_token$componentCls = {
+  return defineProperty_defineProperty({}, token.componentCls, (_token$componentCls = {
     padding: 24
   }, defineProperty_defineProperty(_token$componentCls, "&".concat(token.antCls, "-form-horizontal"), {
     paddingInline: 0
@@ -68974,7 +69007,7 @@ var QueryFilter_style_genProStyle = function genProStyle(token) {
   }), defineProperty_defineProperty(_token$componentCls, '&-collapse-button', {
     display: 'flex',
     alignItems: 'center'
-  }), _token$componentCls)));
+  }), _token$componentCls));
 };
 
 function QueryFilter_style_useStyle(prefixCls) {
@@ -78243,10 +78276,10 @@ var FooterToolbar = function FooterToolbar(props) {
 
   var dom = (0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
     children: [(0,jsx_runtime.jsx)("div", {
-      className: "".concat(baseClassName, "-left"),
+      className: "".concat(baseClassName, "-left ").concat(hashId),
       children: extra
     }), (0,jsx_runtime.jsx)("div", {
-      className: "".concat(baseClassName, "-right"),
+      className: "".concat(baseClassName, "-right ").concat(hashId),
       children: children
     })]
   });
@@ -78347,7 +78380,7 @@ var GridContent = function GridContent(props) {
     className: classnames_default()(className, hashId, propsClassName, defineProperty_defineProperty({}, "".concat(className, "-wide"), isWide)),
     style: style,
     children: (0,jsx_runtime.jsx)("div", {
-      className: "".concat(prefixCls, "-grid-content-children"),
+      className: "".concat(prefixCls, "-grid-content-children ").concat(hashId),
       children: children
     })
   }));
@@ -78416,10 +78449,13 @@ var defaultToken = getLayoutDesignToken({}, {});
 var ProLayoutContext = /*#__PURE__*/external_React_default().createContext(defaultToken);
 var ProLayoutProvider = function ProLayoutProvider(props) {
   var _useToken = useStyle_useToken(),
-      token = _useToken.token;
+      token = _useToken.token,
+      hashId = _useToken.hashId;
 
   return (0,jsx_runtime.jsx)(ProLayoutContext.Provider, {
-    value: objectSpread2_objectSpread2({}, getLayoutDesignToken((props === null || props === void 0 ? void 0 : props.token) || {}, token)),
+    value: objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, getLayoutDesignToken((props === null || props === void 0 ? void 0 : props.token) || {}, token)), {}, {
+      hashId: hashId
+    }),
     children: props.children
   });
 };
@@ -78618,6 +78654,7 @@ var getBackIcon = function getBackIcon(props) {
 
 var renderTitle = function renderTitle(prefixCls, props) {
   var direction = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'ltr';
+  var hashId = arguments.length > 3 ? arguments[3] : undefined;
   var title = props.title,
       avatar = props.avatar,
       subTitle = props.subTitle,
@@ -78635,25 +78672,25 @@ var renderTitle = function renderTitle(prefixCls, props) {
   var backIconDom = renderBack(prefixCls, backIcon, onBack);
   var hasTitle = backIconDom || avatar || hasHeading;
   return (0,jsx_runtime.jsxs)("div", {
-    className: headingPrefixCls,
+    className: headingPrefixCls + ' ' + hashId,
     children: [hasTitle && (0,jsx_runtime.jsxs)("div", {
-      className: "".concat(headingPrefixCls, "-left"),
+      className: "".concat(headingPrefixCls, "-left ").concat(hashId),
       children: [backIconDom, avatar && (0,jsx_runtime.jsx)(external_antd_.Avatar, objectSpread2_objectSpread2({
-        className: classnames_default()("".concat(headingPrefixCls, "-avatar"), avatar.className)
+        className: classnames_default()("".concat(headingPrefixCls, "-avatar"), hashId, avatar.className)
       }, avatar)), title && (0,jsx_runtime.jsx)("span", {
-        className: "".concat(headingPrefixCls, "-title"),
+        className: "".concat(headingPrefixCls, "-title ").concat(hashId),
         title: typeof title === 'string' ? title : undefined,
         children: title
       }), subTitle && (0,jsx_runtime.jsx)("span", {
-        className: "".concat(headingPrefixCls, "-sub-title"),
+        className: "".concat(headingPrefixCls, "-sub-title ").concat(hashId),
         title: typeof subTitle === 'string' ? subTitle : undefined,
         children: subTitle
       }), tags && (0,jsx_runtime.jsx)("span", {
-        className: "".concat(headingPrefixCls, "-tags"),
+        className: "".concat(headingPrefixCls, "-tags ").concat(hashId),
         children: tags
       })]
     }), extra && (0,jsx_runtime.jsx)("span", {
-      className: "".concat(headingPrefixCls, "-extra"),
+      className: "".concat(headingPrefixCls, "-extra ").concat(hashId),
       children: (0,jsx_runtime.jsx)(external_antd_.Space, {
         children: extra
       })
@@ -78661,10 +78698,10 @@ var renderTitle = function renderTitle(prefixCls, props) {
   });
 };
 
-var renderFooter = function renderFooter(prefixCls, footer) {
+var renderFooter = function renderFooter(prefixCls, footer, hashId) {
   if (footer) {
     return (0,jsx_runtime.jsx)("div", {
-      className: "".concat(prefixCls, "-footer"),
+      className: "".concat(prefixCls, "-footer ").concat(hashId),
       children: footer
     });
   }
@@ -78672,9 +78709,9 @@ var renderFooter = function renderFooter(prefixCls, footer) {
   return null;
 };
 
-var renderChildren = function renderChildren(prefixCls, children) {
+var renderChildren = function renderChildren(prefixCls, children, hashId) {
   return (0,jsx_runtime.jsx)("div", {
-    className: "".concat(prefixCls, "-content"),
+    className: "".concat(prefixCls, "-content ").concat(hashId),
     children: children
   });
 };
@@ -78736,9 +78773,9 @@ 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);
+  var title = renderTitle(prefixCls, props, direction, hashId);
+  var childDom = children && renderChildren(prefixCls, children, hashId);
+  var footerDom = renderFooter(prefixCls, footer, hashId);
 
   if (!breadcrumbDom && !title && !footerDom && !childDom) {
     return null;
@@ -79010,7 +79047,7 @@ function PageContainer_style_useStyle(prefixCls) {
 
 
 
-var PageContainer_excluded = ["title", "content", "pageHeaderRender", "header", "prefixedClassName", "extraContent", "style", "prefixCls", "value", "breadcrumbRender"],
+var PageContainer_excluded = ["title", "content", "pageHeaderRender", "header", "prefixedClassName", "extraContent", "style", "prefixCls", "hashId", "value", "breadcrumbRender"],
     PageContainer_excluded2 = ["children", "loading", "className", "style", "footer", "affixProps", "fixedHeader", "breadcrumbRender"];
 
 
@@ -79045,13 +79082,14 @@ var PageContainer_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 (0,jsx_runtime.jsx)(external_antd_.Tabs, objectSpread2_objectSpread2({
-      className: "".concat(prefixedClassName, "-tabs"),
+    return (0,jsx_runtime.jsx)(external_antd_.Tabs, objectSpread2_objectSpread2(objectSpread2_objectSpread2({
+      className: "".concat(prefixedClassName, "-tabs ").concat(hashId),
       activeKey: tabActiveKey,
       onChange: function onChange(key) {
         if (onTabChange) {
@@ -79059,6 +79097,7 @@ var PageContainer_renderFooter = function renderFooter(_ref) {
         }
       },
       tabBarExtraContent: tabBarExtraContent,
+      // @ts-ignore
       items: tabList === null || tabList === void 0 ? void 0 : tabList.map(function (item, index) {
         var _item$key;
 
@@ -79068,28 +79107,34 @@ var PageContainer_renderFooter = function renderFooter(_ref) {
           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));
+    }, tabProps), {}, {
+      children: tabList === null || tabList === void 0 ? void 0 : tabList.map(function (item, index) {
+        return (0,jsx_runtime.jsx)(external_antd_.Tabs.TabPane, objectSpread2_objectSpread2({
+          tab: item.tab
+        }, item), item.key || index);
+      })
+    }));
   }
 
   return null;
 };
 
-var renderPageHeader = function renderPageHeader(content, extraContent, prefixedClassName) {
+var renderPageHeader = function renderPageHeader(content, extraContent, prefixedClassName, hashId) {
   if (!content && !extraContent) {
     return null;
   }
 
   return (0,jsx_runtime.jsx)("div", {
-    className: "".concat(prefixedClassName, "-detail"),
+    className: "".concat(prefixedClassName, "-detail ").concat(hashId),
     children: (0,jsx_runtime.jsx)("div", {
-      className: "".concat(prefixedClassName, "-main"),
+      className: "".concat(prefixedClassName, "-main ").concat(hashId),
       children: (0,jsx_runtime.jsxs)("div", {
-        className: "".concat(prefixedClassName, "-row"),
+        className: "".concat(prefixedClassName, "-row ").concat(hashId),
         children: [content && (0,jsx_runtime.jsx)("div", {
-          className: "".concat(prefixedClassName, "-content"),
+          className: "".concat(prefixedClassName, "-content ").concat(hashId),
           children: content
         }), extraContent && (0,jsx_runtime.jsx)("div", {
-          className: "".concat(prefixedClassName, "-extraContent"),
+          className: "".concat(prefixedClassName, "-extraContent ").concat(hashId),
           children: extraContent
         })]
       })
@@ -79127,6 +79172,7 @@ var memoRenderPageHeader = function memoRenderPageHeader(props) {
       extraContent = props.extraContent,
       style = props.style,
       prefixCls = props.prefixCls,
+      hashId = props.hashId,
       value = props.value,
       breadcrumbRender = props.breadcrumbRender,
       restProps = objectWithoutProperties_objectWithoutProperties(props, PageContainer_excluded);
@@ -79159,6 +79205,7 @@ var memoRenderPageHeader = function memoRenderPageHeader(props) {
     title: pageHeaderTitle
   }, restProps), {}, {
     footer: PageContainer_renderFooter(objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, restProps), {}, {
+      hashId: hashId,
       breadcrumbRender: breadcrumbRender,
       prefixedClassName: prefixedClassName
     }))
@@ -79174,11 +79221,11 @@ var memoRenderPageHeader = function memoRenderPageHeader(props) {
   }
 
   return (0,jsx_runtime.jsx)(PageHeader, objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, pageHeaderProps), {}, {
-    className: "".concat(prefixedClassName, "-warp-page-header"),
+    className: "".concat(prefixedClassName, "-warp-page-header ").concat(hashId),
     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)
+    children: (header === null || header === void 0 ? void 0 : header.children) || renderPageHeader(content, extraContent, prefixedClassName, hashId)
   }));
 };
 
@@ -79236,6 +79283,7 @@ var PageContainer = function PageContainer(props) {
   var pageHeaderDom = memoRenderPageHeader(objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, restProps), {}, {
     breadcrumbRender: memoBreadcrumbRender,
     ghost: true,
+    hashId: hashId,
     prefixCls: undefined,
     prefixedClassName: basePageContainer,
     value: value
@@ -79259,7 +79307,7 @@ var PageContainer = function PageContainer(props) {
   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")),
+        className: classnames_default()("".concat(basePageContainer, "-children-content ").concat(hashId)),
         children: children
       }), value.hasFooterToolbar && (0,jsx_runtime.jsx)("div", {
         style: {
@@ -79268,7 +79316,7 @@ var PageContainer = function PageContainer(props) {
         }
       })]
     }) : null;
-  }, [children, basePageContainer, value.hasFooterToolbar, pageContainer.marginBlockPageContainerContent]);
+  }, [children, basePageContainer, hashId, value.hasFooterToolbar, pageContainer.marginBlockPageContainerContent]);
   var renderContentDom = (0,external_React_.useMemo)(function () {
     // 只要loadingDom非空我们就渲染loadingDom,否则渲染内容
     var dom = loadingDom || content;
@@ -79293,7 +79341,7 @@ var PageContainer = function PageContainer(props) {
       (0,jsx_runtime.jsx)(external_antd_.Affix, objectSpread2_objectSpread2(objectSpread2_objectSpread2({
         offsetTop: value.hasHeader && value.fixedHeader ? token.header.heightLayoutHeader : 0
       }, affixProps), {}, {
-        className: "".concat(basePageContainer, "-affix"),
+        className: "".concat(basePageContainer, "-affix ").concat(hashId),
         children: pageHeaderDom
       })) : pageHeaderDom, renderContentDom && (0,jsx_runtime.jsx)(GridContent, {
         children: renderContentDom
@@ -79308,6 +79356,7 @@ var PageContainer = function PageContainer(props) {
 var ProPageHeader = function ProPageHeader(props) {
   var value = (0,external_React_.useContext)(RouteContext);
   return memoRenderPageHeader(objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, props), {}, {
+    hashId: '',
     value: value
   }));
 };
@@ -79421,10 +79470,10 @@ var GlobalFooter = function GlobalFooter(_ref) {
     className: classnames_default()(baseClassName, hashId, className),
     style: style,
     children: [links && (0,jsx_runtime.jsx)("div", {
-      className: "".concat(baseClassName, "-list"),
+      className: "".concat(baseClassName, "-list ").concat(hashId),
       children: links.map(function (link) {
         return (0,jsx_runtime.jsx)("a", {
-          className: "".concat(baseClassName, "-list-link"),
+          className: "".concat(baseClassName, "-list-link ").concat(hashId),
           title: link.key,
           target: link.blankTarget ? '_blank' : '_self',
           href: link.href,
@@ -79433,7 +79482,7 @@ var GlobalFooter = function GlobalFooter(_ref) {
         }, link.key);
       })
     }), copyright && (0,jsx_runtime.jsx)("div", {
-      className: "".concat(baseClassName, "-copyright"),
+      className: "".concat(baseClassName, "-copyright ").concat(hashId),
       children: copyright
     })]
   }));
@@ -79698,14 +79747,15 @@ var AppsLogo = function AppsLogo() {
 
 var DefaultContent = function DefaultContent(props) {
   var appList = props.appList,
-      baseClassName = props.baseClassName;
+      baseClassName = props.baseClassName,
+      hashId = props.hashId;
   return (0,jsx_runtime.jsx)("div", {
-    className: "".concat(baseClassName, "-content"),
+    className: "".concat(baseClassName, "-content ").concat(hashId),
     children: (0,jsx_runtime.jsx)("ul", {
-      className: "".concat(baseClassName, "-content-list"),
+      className: "".concat(baseClassName, "-content-list ").concat(hashId),
       children: appList === null || appList === void 0 ? void 0 : appList.map(function (app, index) {
         return (0,jsx_runtime.jsx)("li", {
-          className: "".concat(baseClassName, "-content-list-item"),
+          className: "".concat(baseClassName, "-content-list-item ").concat(hashId),
           children: (0,jsx_runtime.jsxs)("a", {
             href: app.url,
             target: app.target,
@@ -79765,14 +79815,15 @@ var renderLogo = function renderLogo(logo, title) {
 };
 var SimpleContent = function SimpleContent(props) {
   var appList = props.appList,
-      baseClassName = props.baseClassName;
+      baseClassName = props.baseClassName,
+      hashId = props.hashId;
   return (0,jsx_runtime.jsx)("div", {
-    className: "".concat(baseClassName, "-content"),
+    className: "".concat(baseClassName, "-content ").concat(hashId),
     children: (0,jsx_runtime.jsx)("ul", {
-      className: "".concat(baseClassName, "-content-list"),
+      className: "".concat(baseClassName, "-content-list ").concat(hashId),
       children: appList === null || appList === void 0 ? void 0 : appList.map(function (app, index) {
         return (0,jsx_runtime.jsx)("li", {
-          className: "".concat(baseClassName, "-content-list-item"),
+          className: "".concat(baseClassName, "-content-list-item ").concat(hashId),
           children: (0,jsx_runtime.jsxs)("a", {
             href: app.url,
             target: app.target,
@@ -79902,7 +79953,7 @@ var genAppsLogoComponentsSimpleListStyle = function genAppsLogoComponentsSimpleL
               fontSize: 22,
               lineHeight: '40px',
               textAlign: 'center',
-              backgroundColor: token.colorPrimaryBgHover,
+              backgroundImage: 'linear-gradient(180deg, #E8F0FB 0%, #F6F8FC 100%)',
               borderRadius: token.radiusBase
             },
             '& > img': {
@@ -80035,7 +80086,8 @@ var AppsLogoComponents = function AppsLogoComponents(props) {
   var baseClassName = "".concat(prefixCls, "-layout-apps");
 
   var _useStyle = AppsLogoComponents_style_useStyle(baseClassName),
-      wrapSSR = _useStyle.wrapSSR;
+      wrapSSR = _useStyle.wrapSSR,
+      hashId = _useStyle.hashId;
 
   var _useState = (0,external_React_.useState)(false),
       _useState2 = slicedToArray_slicedToArray(_useState, 2),
@@ -80049,16 +80101,18 @@ var AppsLogoComponents = function AppsLogoComponents(props) {
 
     if (isSimple) {
       return (0,jsx_runtime.jsx)(SimpleContent, {
+        hashId: hashId,
         appList: appList,
         baseClassName: "".concat(baseClassName, "-simple")
       });
     }
 
     return (0,jsx_runtime.jsx)(DefaultContent, {
+      hashId: hashId,
       appList: appList,
       baseClassName: "".concat(baseClassName, "-default")
     });
-  }, [appList, baseClassName]);
+  }, [appList, baseClassName, hashId]);
   if (!(props === null || props === void 0 ? void 0 : (_props$appList = props.appList) === null || _props$appList === void 0 ? void 0 : _props$appList.length)) return null;
   return wrapSSR((0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
     children: [(0,jsx_runtime.jsx)("div", {
@@ -80069,7 +80123,7 @@ var AppsLogoComponents = function AppsLogoComponents(props) {
       zIndex: 9999,
       arrowPointAtCenter: true,
       onVisibleChange: setVisible,
-      overlayClassName: "".concat(baseClassName, "-popover"),
+      overlayClassName: "".concat(baseClassName, "-popover ").concat(hashId),
       content: popoverContent,
       getPopupContainer: function getPopupContainer() {
         return ref.current || document.body;
@@ -80078,7 +80132,7 @@ var AppsLogoComponents = function AppsLogoComponents(props) {
         onClick: function onClick(e) {
           e.stopPropagation();
         },
-        className: classnames_default()("".concat(baseClassName, "-icon"), defineProperty_defineProperty({}, "".concat(baseClassName, "-icon-active"), visible)),
+        className: classnames_default()("".concat(baseClassName, "-icon"), hashId, defineProperty_defineProperty({}, "".concat(baseClassName, "-icon-active"), visible)),
         children: (0,jsx_runtime.jsx)(AppsLogo, {})
       })
     })]
@@ -80419,10 +80473,10 @@ var MenuCounter = createContainer(useMenuCounter);
 var genProLayoutBaseMenuStyle = function genProLayoutBaseMenuStyle(token) {
   var _collapsed, _collapsed2, _$concat2, _$concat4;
 
-  return defineProperty_defineProperty({}, token.proComponentsCls, defineProperty_defineProperty({}, "& ".concat(token.componentCls), (_$concat4 = {
+  return defineProperty_defineProperty({}, "".concat(token.componentCls), (_$concat4 = {
     background: 'transparent',
     border: 'none'
-  }, defineProperty_defineProperty(_$concat4, "&-collapsed", (_collapsed = {}, defineProperty_defineProperty(_collapsed, "".concat(token.antCls, "-menu-item, \n        ").concat(token.antCls, "-menu-item-group > ").concat(token.antCls, "-menu-item-group-list > ").concat(token.antCls, "-menu-item, \n        ").concat(token.antCls, "-menu-item-group > ").concat(token.antCls, "-menu-item-group-list > ").concat(token.antCls, "-menu-submenu > ").concat(token.antCls, "-menu-submenu-title, \n        ").concat(token.antCls, "-menu-submenu > ").concat(token.antCls, "-menu-submenu-title"), {
+  }, defineProperty_defineProperty(_$concat4, "& &-collapsed", (_collapsed = {}, defineProperty_defineProperty(_collapsed, "".concat(token.antCls, "-menu-item, \n        ").concat(token.antCls, "-menu-item-group > ").concat(token.antCls, "-menu-item-group-list > ").concat(token.antCls, "-menu-item, \n        ").concat(token.antCls, "-menu-item-group > ").concat(token.antCls, "-menu-item-group-list > ").concat(token.antCls, "-menu-submenu > ").concat(token.antCls, "-menu-submenu-title, \n        ").concat(token.antCls, "-menu-submenu > ").concat(token.antCls, "-menu-submenu-title"), {
     paddingInline: '0 !important',
     height: 'auto !important',
     marginBlock: '8px !important'
@@ -80431,7 +80485,7 @@ var genProLayoutBaseMenuStyle = function genProLayoutBaseMenuStyle(token) {
     borderRadius: token.radiusBase
   }), defineProperty_defineProperty(_collapsed, "".concat(token.componentCls, "-group"), defineProperty_defineProperty({}, "".concat(token.antCls, "-menu-item-group-title"), {
     paddingInline: 0
-  })), _collapsed)), defineProperty_defineProperty(_$concat4, '&-item-title', defineProperty_defineProperty({
+  })), _collapsed)), defineProperty_defineProperty(_$concat4, '& &-item-title', defineProperty_defineProperty({
     display: 'flex',
     flexDirection: 'row',
     alignItems: 'center',
@@ -80479,7 +80533,7 @@ var genProLayoutBaseMenuStyle = function genProLayoutBaseMenuStyle(token) {
     color: token.colorTextSecondary,
     fontSize: 12,
     lineHeight: 20
-  }), _$concat4)));
+  }), _$concat4));
 };
 
 function menu_useStyle(prefixCls) {
@@ -80524,6 +80578,7 @@ var IconFont = create({
 
 var getIcon = function getIcon(icon) {
   var iconPrefixes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'icon-';
+  var className = arguments.length > 2 ? arguments[2] : undefined;
 
   if (typeof icon === 'string' && icon !== '') {
     if (isUrl(icon) || isImg(icon)) {
@@ -80532,7 +80587,7 @@ var getIcon = function getIcon(icon) {
           return (0,jsx_runtime.jsx)("img", {
             src: icon,
             alt: "icon",
-            className: "ant-pro-sider-menu-icon"
+            className: className
           });
         }
       });
@@ -80592,13 +80647,13 @@ var MenuUtil = /*#__PURE__*/_createClass(function MenuUtil(props) {
     var menuType = isGroup && level === 0 ? 'group' : undefined;
 
     if (Array.isArray(children) && children.length > 0) {
-      var _classNames, _designToken$sider;
+      var _this$props2, _this$props3, _classNames, _this$props4, _this$props5, _designToken$sider;
       /** Menu 第一级可以有icon，或者 isGroup 时第二级别也要有 */
 
 
       var shouldHasIcon = level === 0 || isGroup && level === 1; //  get defaultTitle by menuItemRender
 
-      var iconDom = getIcon(item.icon, iconPrefixes);
+      var iconDom = getIcon(item.icon, iconPrefixes, "".concat(baseClassName, "-icon ").concat((_this$props2 = _this.props) === null || _this$props2 === void 0 ? void 0 : _this$props2.hashId));
       /**
        * 如果没有icon在收起的时候用首字母代替
        */
@@ -80607,12 +80662,12 @@ var MenuUtil = /*#__PURE__*/_createClass(function MenuUtil(props) {
 
       var defaultTitle = (0,jsx_runtime.jsxs)("div", {
         title: name,
-        className: classnames_default()("".concat(baseClassName, "-item-title"), (_classNames = {}, defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-item-title-collapsed"), collapsed), defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-item-collapsed-show-title"), (menu === null || menu === void 0 ? void 0 : menu.collapsedShowTitle) && collapsed), _classNames)),
+        className: classnames_default()("".concat(baseClassName, "-item-title"), (_this$props3 = _this.props) === null || _this$props3 === void 0 ? void 0 : _this$props3.hashId, (_classNames = {}, defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-item-title-collapsed"), collapsed), defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-item-collapsed-show-title"), (menu === null || menu === void 0 ? void 0 : menu.collapsedShowTitle) && collapsed), _classNames)),
         children: [menuType === 'group' && collapsed ? null : shouldHasIcon && iconDom ? (0,jsx_runtime.jsx)("span", {
-          className: "anticon ".concat(baseClassName, "-item-icon"),
+          className: "anticon ".concat(baseClassName, "-item-icon ").concat((_this$props4 = _this.props) === null || _this$props4 === void 0 ? void 0 : _this$props4.hashId),
           children: iconDom
         }) : defaultIcon, (0,jsx_runtime.jsx)("span", {
-          className: classnames_default()("".concat(baseClassName, "-item-text"), defineProperty_defineProperty({}, "".concat(baseClassName, "-item-text-has-icon"), menuType !== 'group' && shouldHasIcon && (iconDom || defaultIcon))),
+          className: classnames_default()("".concat(baseClassName, "-item-text"), (_this$props5 = _this.props) === null || _this$props5 === void 0 ? void 0 : _this$props5.hashId, defineProperty_defineProperty({}, "".concat(baseClassName, "-item-text-has-icon"), menuType !== 'group' && shouldHasIcon && (iconDom || defaultIcon))),
           children: name
         })]
       }); // subMenu only title render
@@ -80664,9 +80719,9 @@ var MenuUtil = /*#__PURE__*/_createClass(function MenuUtil(props) {
   this.getIntlName = function (item) {
     var name = item.name,
         locale = item.locale;
-    var _this$props2 = _this.props,
-        menu = _this$props2.menu,
-        formatMessage = _this$props2.formatMessage;
+    var _this$props6 = _this.props,
+        menu = _this$props6.menu,
+        formatMessage = _this$props6.formatMessage;
 
     if (locale && (menu === null || menu === void 0 ? void 0 : menu.locale) !== false) {
       return formatMessage === null || formatMessage === void 0 ? void 0 : formatMessage({
@@ -80679,40 +80734,40 @@ var MenuUtil = /*#__PURE__*/_createClass(function MenuUtil(props) {
   };
 
   this.getMenuItemPath = function (item, level) {
-    var _classNames3;
+    var _this$props9, _this$props10, _classNames3, _this$props11, _this$props12;
 
     var itemPath = _this.conversionPath(item.path || '/');
 
-    var _this$props3 = _this.props,
-        _this$props3$location = _this$props3.location,
-        location = _this$props3$location === void 0 ? {
+    var _this$props7 = _this.props,
+        _this$props7$location = _this$props7.location,
+        location = _this$props7$location === void 0 ? {
       pathname: '/'
-    } : _this$props3$location,
-        isMobile = _this$props3.isMobile,
-        onCollapse = _this$props3.onCollapse,
-        menuItemRender = _this$props3.menuItemRender,
-        iconPrefixes = _this$props3.iconPrefixes; // if local is true formatMessage all name。
+    } : _this$props7$location,
+        isMobile = _this$props7.isMobile,
+        onCollapse = _this$props7.onCollapse,
+        menuItemRender = _this$props7.menuItemRender,
+        iconPrefixes = _this$props7.iconPrefixes; // if local is true formatMessage all name。
 
     var name = _this.getIntlName(item);
 
-    var _this$props4 = _this.props,
-        baseClassName = _this$props4.baseClassName,
-        menu = _this$props4.menu,
-        collapsed = _this$props4.collapsed;
+    var _this$props8 = _this.props,
+        baseClassName = _this$props8.baseClassName,
+        menu = _this$props8.menu,
+        collapsed = _this$props8.collapsed;
     var isGroup = (menu === null || menu === void 0 ? void 0 : menu.type) === 'group';
     /** Menu 第一级可以有icon，或者 isGroup 时第二级别也要有 */
 
     var hasIcon = level === 0 || isGroup && level === 1;
-    var icon = !hasIcon ? null : getIcon(item.icon, iconPrefixes);
+    var icon = !hasIcon ? null : getIcon(item.icon, iconPrefixes, "".concat(baseClassName, "-icon ").concat((_this$props9 = _this.props) === null || _this$props9 === void 0 ? void 0 : _this$props9.hashId));
     var defaultIcon = collapsed && hasIcon ? getMenuTitleSymbol(name) : null;
 
     var defaultItem = (0,jsx_runtime.jsxs)("div", {
-      className: classnames_default()("".concat(baseClassName, "-item-title"), (_classNames3 = {}, defineProperty_defineProperty(_classNames3, "".concat(baseClassName, "-item-title-collapsed"), collapsed), defineProperty_defineProperty(_classNames3, "".concat(baseClassName, "-item-collapsed-show-title"), (menu === null || menu === void 0 ? void 0 : menu.collapsedShowTitle) && collapsed), _classNames3)),
+      className: classnames_default()("".concat(baseClassName, "-item-title"), (_this$props10 = _this.props) === null || _this$props10 === void 0 ? void 0 : _this$props10.hashId, (_classNames3 = {}, defineProperty_defineProperty(_classNames3, "".concat(baseClassName, "-item-title-collapsed"), collapsed), defineProperty_defineProperty(_classNames3, "".concat(baseClassName, "-item-collapsed-show-title"), (menu === null || menu === void 0 ? void 0 : menu.collapsedShowTitle) && collapsed), _classNames3)),
       children: [icon ? (0,jsx_runtime.jsx)("span", {
-        className: "anticon ".concat(baseClassName, "-item-icon"),
+        className: "anticon ".concat(baseClassName, "-item-icon ").concat((_this$props11 = _this.props) === null || _this$props11 === void 0 ? void 0 : _this$props11.hashId),
         children: icon
       }) : defaultIcon, (0,jsx_runtime.jsx)("span", {
-        className: classnames_default()("".concat(baseClassName, "-item-text"), defineProperty_defineProperty({}, "".concat(baseClassName, "-item-text-has-icon"), hasIcon && (icon || defaultIcon))),
+        className: classnames_default()("".concat(baseClassName, "-item-text"), (_this$props12 = _this.props) === null || _this$props12 === void 0 ? void 0 : _this$props12.hashId, defineProperty_defineProperty({}, "".concat(baseClassName, "-item-text-has-icon"), hasIcon && (icon || defaultIcon))),
         children: name
       })]
     });
@@ -80720,7 +80775,7 @@ var MenuUtil = /*#__PURE__*/_createClass(function MenuUtil(props) {
     var isHttpUrl = isUrl(itemPath); // Is it a http link
 
     if (isHttpUrl) {
-      var _classNames5;
+      var _this$props13, _classNames5, _this$props14, _this$props15;
 
       defaultItem = (0,jsx_runtime.jsxs)("span", {
         title: name,
@@ -80729,12 +80784,12 @@ var MenuUtil = /*#__PURE__*/_createClass(function MenuUtil(props) {
 
           (_window = window) === null || _window === void 0 ? void 0 : (_window$open = _window.open) === null || _window$open === void 0 ? void 0 : _window$open.call(_window, itemPath, '_blank');
         },
-        className: classnames_default()("".concat(baseClassName, "-item-title"), (_classNames5 = {}, defineProperty_defineProperty(_classNames5, "".concat(baseClassName, "-item-title-collapsed"), collapsed), defineProperty_defineProperty(_classNames5, "".concat(baseClassName, "-item-link"), true), defineProperty_defineProperty(_classNames5, "".concat(baseClassName, "-item-collapsed-show-title"), (menu === null || menu === void 0 ? void 0 : menu.collapsedShowTitle) && collapsed), _classNames5)),
+        className: classnames_default()("".concat(baseClassName, "-item-title"), (_this$props13 = _this.props) === null || _this$props13 === void 0 ? void 0 : _this$props13.hashId, (_classNames5 = {}, defineProperty_defineProperty(_classNames5, "".concat(baseClassName, "-item-title-collapsed"), collapsed), defineProperty_defineProperty(_classNames5, "".concat(baseClassName, "-item-link"), true), defineProperty_defineProperty(_classNames5, "".concat(baseClassName, "-item-collapsed-show-title"), (menu === null || menu === void 0 ? void 0 : menu.collapsedShowTitle) && collapsed), _classNames5)),
         children: [icon ? (0,jsx_runtime.jsx)("span", {
-          className: "anticon ".concat(baseClassName, "-item-icon"),
+          className: "anticon ".concat(baseClassName, "-item-icon ").concat((_this$props14 = _this.props) === null || _this$props14 === void 0 ? void 0 : _this$props14.hashId),
           children: icon
         }) : defaultIcon, (0,jsx_runtime.jsx)("span", {
-          className: classnames_default()("".concat(baseClassName, "-item-text"), defineProperty_defineProperty({}, "".concat(baseClassName, "-item-text-has-icon"), hasIcon && (icon || defaultIcon))),
+          className: classnames_default()("".concat(baseClassName, "-item-text"), (_this$props15 = _this.props) === null || _this$props15 === void 0 ? void 0 : _this$props15.hashId, defineProperty_defineProperty({}, "".concat(baseClassName, "-item-text-has-icon"), hasIcon && (icon || defaultIcon))),
           children: name
         })]
       });
@@ -80891,17 +80946,19 @@ var BaseMenu = function BaseMenu(props) {
     return getOpenKeysProps(openKeys, props);
   }, // eslint-disable-next-line react-hooks/exhaustive-deps
   [openKeys && openKeys.join(','), props.layout, props.collapsed]);
+
+  var _useStyle = menu_useStyle(baseClassName),
+      wrapSSR = _useStyle.wrapSSR,
+      hashId = _useStyle.hashId;
+
   var menuUtils = (0,external_React_.useMemo)(function () {
     return new MenuUtil(objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, props), {}, {
       token: designToken,
       menuRenderType: menuRenderType,
-      baseClassName: baseClassName
+      baseClassName: baseClassName,
+      hashId: hashId
     }));
-  }, [designToken, baseClassName, menuRenderType, props]);
-
-  var _useStyle = menu_useStyle(baseClassName),
-      wrapSSR = _useStyle.wrapSSR,
-      hashId = _useStyle.hashId;
+  }, [props, designToken, menuRenderType, baseClassName, hashId]);
 
   if (menu === null || menu === void 0 ? void 0 : menu.loading) {
     return (0,jsx_runtime.jsx)("div", {
@@ -80964,6 +81021,7 @@ var BaseMenu = function BaseMenu(props) {
 
 
 
+
 var Sider = external_antd_.Layout.Sider;
 /**
  * 渲染 title 和 logo
@@ -81043,6 +81101,10 @@ var SiderMenu = function SiderMenu(props) {
       actionsRender = props.actionsRender,
       onOpenChange = props.onOpenChange,
       logoStyle = props.logoStyle;
+
+  var _useToken = useStyle_useToken(),
+      hashId = _useToken.hashId;
+
   var showSiderExtraDom = (0,external_React_.useMemo)(function () {
     if (isMobile) return false;
     if (layout === 'mix') return false;
@@ -81053,7 +81115,7 @@ var SiderMenu = function SiderMenu(props) {
   var _MenuCounter$useConta = MenuCounter.useContainer(),
       flatMenuKeys = _MenuCounter$useConta.flatMenuKeys;
 
-  var siderClassName = classnames_default()("".concat(baseClassName), (_classNames = {}, defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-fixed"), fixSiderbar), defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-collapsed"), props.collapsed), defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-layout-").concat(layout), layout && !isMobile), defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-light"), theme !== 'dark'), defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-mix"), layout === 'mix' && !isMobile), _classNames));
+  var siderClassName = classnames_default()("".concat(baseClassName), hashId, (_classNames = {}, defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-fixed"), fixSiderbar), defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-collapsed"), props.collapsed), defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-layout-").concat(layout), layout && !isMobile), defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-light"), theme !== 'dark'), defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-mix"), layout === 'mix' && !isMobile), _classNames));
   var headerDom = renderLogoAndTitle(props);
   var extraDom = menuExtraRender && menuExtraRender(props);
   var menuDom = (0,external_React_.useMemo)(function () {
@@ -81064,9 +81126,9 @@ var SiderMenu = function SiderMenu(props) {
       style: {
         width: '100%'
       },
-      className: "".concat(baseClassName, "-menu")
+      className: "".concat(baseClassName, "-menu ").concat(hashId)
     }));
-  }, [baseClassName, flatMenuKeys, menuContentRender, onOpenChange, props]);
+  }, [baseClassName, flatMenuKeys, hashId, menuContentRender, onOpenChange, props]);
   var linksMenuItems = (links || []).map(function (node, index) {
     return {
       className: "".concat(baseClassName, "-link"),
@@ -81094,10 +81156,10 @@ var SiderMenu = function SiderMenu(props) {
       align: "center",
       size: 4,
       direction: collapsed ? 'vertical' : 'horizontal',
-      className: classnames_default()(["".concat(baseClassName, "-actions-list"), collapsed && "".concat(baseClassName, "-actions-list-collapsed")]),
+      className: classnames_default()(["".concat(baseClassName, "-actions-list"), collapsed && "".concat(baseClassName, "-actions-list-collapsed"), hashId]),
       children: actionsRender === null || actionsRender === void 0 ? void 0 : actionsRender(props).map(function (item, index) {
         return (0,jsx_runtime.jsx)("div", {
-          className: "".concat(baseClassName, "-actions-list-item"),
+          className: "".concat(baseClassName, "-actions-list-item ").concat(hashId),
           children: item
         }, index);
       })
@@ -81130,10 +81192,10 @@ var SiderMenu = function SiderMenu(props) {
   var actionAreaDom = (0,external_React_.useMemo)(function () {
     if (!avatarDom && !actionsDom) return null;
     return (0,jsx_runtime.jsxs)("div", {
-      className: classnames_default()("".concat(baseClassName, "-actions"), collapsed && "".concat(baseClassName, "-actions-collapsed")),
+      className: classnames_default()("".concat(baseClassName, "-actions"), hashId, collapsed && "".concat(baseClassName, "-actions-collapsed")),
       children: [avatarDom, actionsDom]
     });
-  }, [actionsDom, avatarDom, baseClassName, collapsed]);
+  }, [actionsDom, avatarDom, baseClassName, collapsed, hashId]);
   var collapsedWidth = 60;
   /* Using the useMemo hook to create a CSS class that will hide the menu when the menu is collapsed. */
 
@@ -81151,13 +81213,13 @@ var SiderMenu = function SiderMenu(props) {
 
   var menuDomItems = (0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
     children: [headerDom && (0,jsx_runtime.jsxs)("div", {
-      className: classnames_default()([classnames_default()("".concat(baseClassName, "-logo"), defineProperty_defineProperty({}, "".concat(baseClassName, "-logo-collapsed"), collapsed))]),
+      className: classnames_default()([classnames_default()("".concat(baseClassName, "-logo"), hashId, defineProperty_defineProperty({}, "".concat(baseClassName, "-logo-collapsed"), collapsed))]),
       onClick: showSiderExtraDom ? onMenuHeaderClick : undefined,
       id: "logo",
       style: logoStyle,
       children: [headerDom, appsDom]
     }), extraDom && (0,jsx_runtime.jsx)("div", {
-      className: classnames_default()(["".concat(baseClassName, "-extra"), !headerDom && "".concat(baseClassName, "-extra-no-logo")]),
+      className: classnames_default()(["".concat(baseClassName, "-extra"), !headerDom && "".concat(baseClassName, "-extra-no-logo"), hashId]),
       children: extraDom
     }), (0,jsx_runtime.jsx)("div", {
       style: {
@@ -81167,10 +81229,10 @@ var SiderMenu = function SiderMenu(props) {
       },
       children: menuRenderDom
     }), links ? (0,jsx_runtime.jsx)("div", {
-      className: "".concat(baseClassName, "-links"),
+      className: "".concat(baseClassName, "-links ").concat(hashId),
       children: (0,jsx_runtime.jsx)(external_antd_.Menu, {
         inlineIndent: 16,
-        className: "".concat(baseClassName, "-link-menu"),
+        className: "".concat(baseClassName, "-link-menu ").concat(hashId),
         selectedKeys: [],
         openKeys: [],
         theme: "light",
@@ -81179,11 +81241,11 @@ var SiderMenu = function SiderMenu(props) {
       })
     }) : null, showSiderExtraDom && (0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
       children: [actionAreaDom, rightContentRender ? (0,jsx_runtime.jsx)("div", {
-        className: classnames_default()("".concat(baseClassName, "-actions"), defineProperty_defineProperty({}, "".concat(baseClassName, "-actions-collapsed"), collapsed)),
+        className: classnames_default()("".concat(baseClassName, "-actions"), hashId, defineProperty_defineProperty({}, "".concat(baseClassName, "-actions-collapsed"), collapsed)),
         children: rightContentRender === null || rightContentRender === void 0 ? void 0 : rightContentRender(props)
       }) : null]
     }), menuFooterDom && (0,jsx_runtime.jsx)("div", {
-      className: classnames_default()(["".concat(baseClassName, "-footer"), defineProperty_defineProperty({}, "".concat(baseClassName, "-footer-collapsed"), collapsed)]),
+      className: classnames_default()(["".concat(baseClassName, "-footer"), hashId, defineProperty_defineProperty({}, "".concat(baseClassName, "-footer-collapsed"), collapsed)]),
       children: menuFooterDom
     })]
   });
@@ -81214,9 +81276,12 @@ var SiderMenu = function SiderMenu(props) {
       style: style,
       theme: theme,
       width: siderWidth,
-      className: classnames_default()(siderClassName, hideMenuWhenCollapsedClassName),
-      children: [(0,jsx_runtime.jsx)(external_antd_.ConfigProvider, {
+      className: classnames_default()(siderClassName, hashId, hideMenuWhenCollapsedClassName),
+      children: [(0,jsx_runtime.jsx)(external_antd_.ConfigProvider // @ts-ignore
+      , {
+        // @ts-ignore
         theme: {
+          hashed: false,
           override: {
             Menu: {
               radiusItem: 4,
@@ -81234,7 +81299,7 @@ var SiderMenu = function SiderMenu(props) {
           }
         },
         children: hideMenuWhenCollapsedClassName ? (0,jsx_runtime.jsx)("div", {
-          className: "".concat(baseClassName, "-hide-when-collapsed"),
+          className: "".concat(baseClassName, "-hide-when-collapsed ").concat(hashId),
           style: {
             height: '100%',
             width: '100%',
@@ -81394,11 +81459,11 @@ var RightContent = function RightContent(_ref) {
         }
 
         return (0,jsx_runtime.jsx)("div", {
-          className: classnames_default()("".concat(prefixCls, "-header-actions-item"), defineProperty_defineProperty({}, "".concat(prefixCls, "-header-actions-hover"), !hideHover)),
+          className: classnames_default()("".concat(prefixCls, "-header-actions-item ").concat(hashId), defineProperty_defineProperty({}, "".concat(prefixCls, "-header-actions-hover"), !hideHover)),
           children: dom
         }, index);
       }), avatarDom && (0,jsx_runtime.jsx)("span", {
-        className: "".concat(prefixCls, "-header-actions-avatar"),
+        className: "".concat(prefixCls, "-header-actions-avatar ").concat(hashId),
         children: (0,jsx_runtime.jsx)("div", {
           children: avatarDom
         })
@@ -81429,7 +81494,7 @@ var RightContent = function RightContent(_ref) {
     };
   }(), 160);
   return (0,jsx_runtime.jsx)("div", {
-    className: "".concat(prefixCls, "-right-content"),
+    className: "".concat(prefixCls, "-right-content ").concat(hashId),
     style: {
       minWidth: rightSize,
       height: '100%'
@@ -81585,7 +81650,9 @@ var TopNavHeader = function TopNavHeader(props) {
   var contentDom = (0,external_React_.useMemo)(function () {
     var _process$env$NODE_ENV, _props$menuProps;
 
-    var defaultDom = (0,jsx_runtime.jsx)(external_antd_.ConfigProvider, {
+    var defaultDom = (0,jsx_runtime.jsx)(external_antd_.ConfigProvider // @ts-ignore
+    , {
+      // @ts-ignore
       theme: {
         hashed: ((_process$env$NODE_ENV = "production") === null || _process$env$NODE_ENV === void 0 ? void 0 : _process$env$NODE_ENV.toLowerCase()) !== 'test',
         override: {
@@ -81608,7 +81675,7 @@ var TopNavHeader = function TopNavHeader(props) {
       children: (0,jsx_runtime.jsx)(BaseMenu, objectSpread2_objectSpread2(objectSpread2_objectSpread2(objectSpread2_objectSpread2({
         theme: "light"
       }, props), {}, {
-        className: "".concat(prefixCls, "-base-menu")
+        className: "".concat(prefixCls, "-base-menu ").concat(hashId)
       }, props.menuProps), {}, {
         style: objectSpread2_objectSpread2({
           width: '100%'
@@ -81624,18 +81691,18 @@ var TopNavHeader = function TopNavHeader(props) {
     }
 
     return defaultDom;
-  }, [header.colorBgMenuItemHover, header.colorBgMenuItemSelected, header.colorTextMenu, header.colorTextMenuActive, header.colorTextMenuSelected, headerContentRender, prefixCls, props]);
+  }, [hashId, header.colorBgMenuItemHover, header.colorBgMenuItemSelected, header.colorTextMenu, header.colorTextMenuActive, header.colorTextMenuSelected, headerContentRender, prefixCls, props]);
   return wrapSSR((0,jsx_runtime.jsx)("div", {
     className: classnames_default()(prefixCls, hashId, propsClassName, defineProperty_defineProperty({}, "".concat(prefixCls, "-light"), true)),
     style: style,
     children: (0,jsx_runtime.jsxs)("div", {
       ref: ref,
-      className: classnames_default()("".concat(prefixCls, "-main"), defineProperty_defineProperty({}, "".concat(prefixCls, "-wide"), contentWidth === 'Fixed')),
+      className: classnames_default()("".concat(prefixCls, "-main"), hashId, defineProperty_defineProperty({}, "".concat(prefixCls, "-wide"), contentWidth === 'Fixed')),
       children: [headerDom && (0,jsx_runtime.jsxs)("div", {
-        className: classnames_default()("".concat(prefixCls, "-main-left")),
+        className: classnames_default()("".concat(prefixCls, "-main-left ").concat(hashId)),
         onClick: onMenuHeaderClick,
         children: [(0,jsx_runtime.jsx)(AppsLogoComponents, objectSpread2_objectSpread2({}, props)), (0,jsx_runtime.jsx)("div", {
-          className: "".concat(prefixCls, "-logo"),
+          className: "".concat(prefixCls, "-logo ").concat(hashId),
           id: "logo",
           children: headerDom
         }, "logo")]
@@ -81643,7 +81710,7 @@ var TopNavHeader = function TopNavHeader(props) {
         style: {
           flex: 1
         },
-        className: "".concat(prefixCls, "-menu"),
+        className: "".concat(prefixCls, "-menu ").concat(hashId),
         children: contentDom
       }), (rightContentRender || actionsRender || props.avatarProps) && (0,jsx_runtime.jsx)(RightContent, objectSpread2_objectSpread2(objectSpread2_objectSpread2({
         rightContentRender: rightContentRender
@@ -81805,7 +81872,7 @@ var GlobalHeader = function GlobalHeader(props) {
     }));
   }
 
-  var logoClassNames = classnames_default()("".concat(baseClassName, "-logo"), (_classNames2 = {}, defineProperty_defineProperty(_classNames2, "".concat(baseClassName, "-logo-rtl"), direction === 'rtl'), defineProperty_defineProperty(_classNames2, "".concat(baseClassName, "-logo-mix"), layout === 'mix'), defineProperty_defineProperty(_classNames2, "".concat(baseClassName, "-logo-mobile"), isMobile), _classNames2));
+  var logoClassNames = classnames_default()("".concat(baseClassName, "-logo"), hashId, (_classNames2 = {}, defineProperty_defineProperty(_classNames2, "".concat(baseClassName, "-logo-rtl"), direction === 'rtl'), defineProperty_defineProperty(_classNames2, "".concat(baseClassName, "-logo-mix"), layout === 'mix'), defineProperty_defineProperty(_classNames2, "".concat(baseClassName, "-logo-mobile"), isMobile), _classNames2));
 
   var logoDom = (0,jsx_runtime.jsx)("span", {
     className: logoClassNames,
@@ -81818,7 +81885,7 @@ var GlobalHeader = function GlobalHeader(props) {
     className: className,
     style: objectSpread2_objectSpread2({}, style),
     children: [isMobile && GlobalHeader_renderLogo(menuHeaderRender, logoDom), isMobile && (0,jsx_runtime.jsx)("span", {
-      className: "".concat(baseClassName, "-collapsed-button"),
+      className: "".concat(baseClassName, "-collapsed-button ").concat(hashId),
       onClick: function onClick() {
         onCollapse === null || onCollapse === void 0 ? void 0 : onCollapse(!collapsed);
       },
@@ -81858,7 +81925,7 @@ var GlobalHeader = function GlobalHeader(props) {
 var Header = external_antd_.Layout.Header;
 
 var DefaultHeader = function DefaultHeader(props) {
-  var _classNames;
+  var _classNames, _process$env$NODE_ENV;
 
   var isMobile = props.isMobile,
       fixedHeader = props.fixedHeader,
@@ -81915,8 +81982,11 @@ var DefaultHeader = function DefaultHeader(props) {
   var className = classnames_default()(propsClassName, hashId, baseClassName, (_classNames = {}, defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-fixed-header"), needFixedHeader), defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-mix"), layout === 'mix'), defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-fixed-header-action"), !collapsed), defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-top-menu"), isTop), defineProperty_defineProperty(_classNames, "".concat(baseClassName, "-header"), true), _classNames));
   if (layout === 'side' && !isMobile) return null;
   return wrapSSR((0,jsx_runtime.jsx)(jsx_runtime.Fragment, {
-    children: (0,jsx_runtime.jsxs)(external_antd_.ConfigProvider, {
+    children: (0,jsx_runtime.jsxs)(external_antd_.ConfigProvider // @ts-ignore
+    , {
+      // @ts-ignore
       theme: {
+        hashed: ((_process$env$NODE_ENV = "production") === null || _process$env$NODE_ENV === void 0 ? void 0 : _process$env$NODE_ENV.toLowerCase()) !== 'test',
         override: {
           Layout: {
             colorBgHeader: 'transparent',
@@ -82272,24 +82342,25 @@ var BlockCheckbox = function BlockCheckbox(_ref) {
       configType = _ref.configType,
       onChange = _ref.onChange,
       list = _ref.list,
-      prefixCls = _ref.prefixCls;
+      prefixCls = _ref.prefixCls,
+      hashId = _ref.hashId;
   var baseClassName = "".concat(prefixCls, "-block-checkbox");
   var dom = (0,external_React_.useMemo)(function () {
     var domList = (list || []).map(function (item) {
       return (0,jsx_runtime.jsx)(external_antd_.Tooltip, {
         title: item.title,
         children: (0,jsx_runtime.jsxs)("div", {
-          className: classnames_default()("".concat(baseClassName, "-item"), "".concat(baseClassName, "-item-").concat(item.key), "".concat(baseClassName, "-").concat(configType, "-item")),
+          className: classnames_default()(hashId, "".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, {
-            className: "".concat(baseClassName, "-selectIcon"),
+            className: "".concat(baseClassName, "-selectIcon ").concat(hashId),
             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"),
+            className: "".concat(baseClassName, "-icon ").concat(hashId),
             children: item.icon
           }) : null]
         })
@@ -82298,7 +82369,7 @@ var BlockCheckbox = function BlockCheckbox(_ref) {
     return domList; // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [value, list === null || list === void 0 ? void 0 : list.length, onChange]);
   return (0,jsx_runtime.jsx)("div", {
-    className: baseClassName,
+    className: classnames_default()(baseClassName, hashId),
     children: dom
   });
 };
@@ -82647,7 +82718,8 @@ var renderLayoutSettingItem = function renderLayoutSettingItem(item) {
 var LayoutSetting = function LayoutSetting(_ref) {
   var _ref$settings = _ref.settings,
       settings = _ref$settings === void 0 ? {} : _ref$settings,
-      changeSetting = _ref.changeSetting;
+      changeSetting = _ref.changeSetting,
+      hashId = _ref.hashId;
   var formatMessage = getFormatMessage();
 
   var _ref2 = settings || defaultSettings,
@@ -82667,7 +82739,7 @@ var LayoutSetting = function LayoutSetting(_ref) {
       action: (0,jsx_runtime.jsxs)(external_antd_.Select, {
         value: contentWidth || 'Fixed',
         size: "small",
-        className: "content-width",
+        className: "content-width ".concat(hashId),
         onSelect: function onSelect(value) {
           changeSetting('contentWidth', value);
         },
@@ -82747,7 +82819,8 @@ var LayoutSetting = function LayoutSetting(_ref) {
 var RegionalSetting = function RegionalSetting(_ref) {
   var _ref$settings = _ref.settings,
       settings = _ref$settings === void 0 ? {} : _ref$settings,
-      changeSetting = _ref.changeSetting;
+      changeSetting = _ref.changeSetting,
+      hashId = _ref.hashId;
   var formatMessage = getFormatMessage();
   var regionalSetting = ['header', 'footer', 'menu', 'menuHeader'];
   return (0,jsx_runtime.jsx)(external_antd_.List, {
@@ -82760,7 +82833,7 @@ var RegionalSetting = function RegionalSetting(_ref) {
         }),
         action: (0,jsx_runtime.jsx)(external_antd_.Switch, {
           size: "small",
-          className: "regional-".concat(key),
+          className: "regional-".concat(key, " ").concat(hashId),
           checked: settings["".concat(key, "Render")] || settings["".concat(key, "Render")] === undefined,
           onChange: function onChange(checked) {
             return changeSetting("".concat(key, "Render"), checked === true ? undefined : false);
@@ -82802,12 +82875,14 @@ var genSettingDrawerStyle = function genSettingDrawerStyle(token) {
   }), defineProperty_defineProperty(_ref, token.componentCls, {
     '&-content': {
       position: 'relative',
-      minHeight: '100%'
+      minHeight: '100%',
+      color: token.colorText
     },
     '&-body-title': {
       marginBlockEnd: '12px',
       fontSize: '14px',
-      lineHeight: '22px'
+      lineHeight: '22px',
+      color: token.colorTextHeading
     },
     '&-block-checkbox': {
       display: 'flex',
@@ -82954,15 +83029,16 @@ var ThemeColor = function ThemeColor(_ref2) {
       colorList = _ref2.colorList,
       onChange = _ref2.onChange,
       prefixCls = _ref2.prefixCls,
-      formatMessage = _ref2.formatMessage;
+      formatMessage = _ref2.formatMessage,
+      hashId = _ref2.hashId;
 
   if (!colorList || (colorList === null || colorList === void 0 ? void 0 : colorList.length) < 1) {
     return null;
   }
 
-  var baseClassName = prefixCls + '-theme-color';
+  var baseClassName = "".concat(prefixCls, "-theme-color");
   return (0,jsx_runtime.jsx)("div", {
-    className: baseClassName,
+    className: "".concat(baseClassName, " ").concat(hashId),
     children: colorList === null || colorList === void 0 ? void 0 : colorList.map(function (_ref3) {
       var key = _ref3.key,
           color = _ref3.color;
@@ -82972,7 +83048,7 @@ var ThemeColor = function ThemeColor(_ref2) {
           id: "app.setting.themecolor.".concat(key)
         }),
         children: (0,jsx_runtime.jsx)(Tag, {
-          className: "".concat(baseClassName, "-block"),
+          className: "".concat(baseClassName, "-block ").concat(hashId),
           color: color,
           check: value === color,
           onClick: function onClick() {
@@ -83012,6 +83088,7 @@ var ThemeColor = function ThemeColor(_ref2) {
 
 var Body = function Body(_ref) {
   var children = _ref.children,
+      hashId = _ref.hashId,
       prefixCls = _ref.prefixCls,
       title = _ref.title;
   return (0,jsx_runtime.jsxs)("div", {
@@ -83019,7 +83096,7 @@ var Body = function Body(_ref) {
       marginBlockEnd: 24
     },
     children: [(0,jsx_runtime.jsx)("h3", {
-      className: "".concat(prefixCls, "-body-title"),
+      className: "".concat(prefixCls, "-body-title ").concat(hashId),
       children: title
     }), children]
   });
@@ -83377,14 +83454,16 @@ var SettingDrawer = function SettingDrawer(props) {
         zIndex: 999
       },
       children: (0,jsx_runtime.jsxs)("div", {
-        className: "".concat(baseClassName, "-drawer-content"),
+        className: "".concat(baseClassName, "-drawer-content ").concat(hashId),
         children: [(0,jsx_runtime.jsx)(Body, {
           title: formatMessage({
             id: 'app.setting.pagestyle',
             defaultMessage: 'Page style setting'
           }),
+          hashId: hashId,
           prefixCls: baseClassName,
           children: (0,jsx_runtime.jsx)(BlockCheckbox, {
+            hashId: hashId,
             prefixCls: baseClassName,
             list: [{
               key: 'light',
@@ -83410,12 +83489,14 @@ var SettingDrawer = function SettingDrawer(props) {
             }
           }, "navTheme")
         }), colorList !== false && (0,jsx_runtime.jsx)(Body, {
+          hashId: hashId,
           title: formatMessage({
             id: 'app.setting.themecolor',
             defaultMessage: 'Theme color'
           }),
           prefixCls: baseClassName,
           children: (0,jsx_runtime.jsx)(ThemeColor, {
+            hashId: hashId,
             prefixCls: baseClassName,
             colorList: colorList,
             value: genStringToTheme(colorPrimary),
@@ -83426,6 +83507,7 @@ var SettingDrawer = function SettingDrawer(props) {
           })
         }), !themeOnly && (0,jsx_runtime.jsxs)(jsx_runtime.Fragment, {
           children: [(0,jsx_runtime.jsx)(external_antd_.Divider, {}), (0,jsx_runtime.jsx)(Body, {
+            hashId: hashId,
             prefixCls: baseClassName,
             title: formatMessage({
               id: 'app.setting.navigationmode'
@@ -83433,6 +83515,7 @@ var SettingDrawer = function SettingDrawer(props) {
             children: (0,jsx_runtime.jsx)(BlockCheckbox, {
               prefixCls: baseClassName,
               value: layout,
+              hashId: hashId,
               configType: "layout",
               list: [{
                 key: 'side',
@@ -83455,6 +83538,7 @@ var SettingDrawer = function SettingDrawer(props) {
               }
             }, "layout")
           }), settingState.layout == 'side' || settingState.layout == 'mix' ? (0,jsx_runtime.jsx)(Body, {
+            hashId: hashId,
             prefixCls: baseClassName,
             title: formatMessage({
               id: 'app.setting.sidermenutype'
@@ -83462,6 +83546,7 @@ var SettingDrawer = function SettingDrawer(props) {
             children: (0,jsx_runtime.jsx)(BlockCheckbox, {
               prefixCls: baseClassName,
               value: siderMenuType,
+              hashId: hashId,
               configType: "siderMenuType",
               list: [{
                 key: 'sub',
@@ -83481,18 +83566,22 @@ var SettingDrawer = function SettingDrawer(props) {
               }
             }, "siderMenuType")
           }) : null, (0,jsx_runtime.jsx)(LayoutSetting, {
+            hashId: hashId,
             settings: settingState,
             changeSetting: changeSetting
           }), (0,jsx_runtime.jsx)(external_antd_.Divider, {}), (0,jsx_runtime.jsx)(Body, {
+            hashId: hashId,
             prefixCls: baseClassName,
             title: formatMessage({
               id: 'app.setting.regionalsettings'
             }),
             children: (0,jsx_runtime.jsx)(RegionalSetting, {
+              hashId: hashId,
               settings: settingState,
               changeSetting: changeSetting
             })
           }), (0,jsx_runtime.jsx)(external_antd_.Divider, {}), (0,jsx_runtime.jsx)(Body, {
+            hashId: hashId,
             prefixCls: baseClassName,
             title: formatMessage({
               id: 'app.setting.othersettings'
@@ -85925,7 +86014,7 @@ var SiderMenuWrapper = function SiderMenuWrapper(props) {
  */
 
 var compatibleStyle = function compatibleStyle(token) {
-  var _$concat$concat, _$concat5, _$concat6, _$concat9, _token$componentCls, _$concat$concat2, _$concat11, _ref;
+  var _$concat$concat, _$concat5, _$concat6, _$concat8, _$concat9, _token$componentCls, _$concat$concat2, _$concat11, _ref;
 
   if (external_antd_.version.startsWith('5')) {
     return {};
@@ -85942,7 +86031,8 @@ var compatibleStyle = function compatibleStyle(token) {
   }, defineProperty_defineProperty(_$concat6, "".concat(token.antCls, "-menu-sub"), {
     color: token.sider.colorTextMenu
   }), defineProperty_defineProperty(_$concat6, "& ".concat(token.antCls, "-layout"), {
-    backgroundColor: 'transparent'
+    backgroundColor: 'transparent',
+    width: '100%'
   }), defineProperty_defineProperty(_$concat6, "".concat(token.antCls, "-menu-submenu-expand-icon, ").concat(token.antCls, "-menu-submenu-arrow"), {
     color: 'inherit'
   }), defineProperty_defineProperty(_$concat6, "&".concat(token.antCls, "-menu"), defineProperty_defineProperty({
@@ -85997,12 +86087,16 @@ var compatibleStyle = function compatibleStyle(token) {
     color: token.header.colorTextMenu
   }, "".concat(token.antCls, "-menu-item a"), {
     color: 'inherit'
-  })), defineProperty_defineProperty(_$concat9, "&".concat(token.antCls, "-menu-light"), defineProperty_defineProperty({}, "".concat(token.antCls, "-menu-item:hover, \n            ").concat(token.antCls, "-menu-item-active,\n            ").concat(token.antCls, "-menu-submenu-active, \n            ").concat(token.antCls, "-menu-submenu-title:hover"), defineProperty_defineProperty({
+  })), defineProperty_defineProperty(_$concat9, "&".concat(token.antCls, "-menu-light"), (_$concat8 = {}, defineProperty_defineProperty(_$concat8, "".concat(token.antCls, "-menu-item:hover, \n            ").concat(token.antCls, "-menu-item-active,\n            ").concat(token.antCls, "-menu-submenu-active, \n            ").concat(token.antCls, "-menu-submenu-title:hover"), defineProperty_defineProperty({
     color: token.header.colorTextMenuActive,
     borderRadius: token.radiusBase
   }, "".concat(token.antCls, "-menu-submenu-arrow"), {
     color: token.header.colorTextMenuActive
-  }))), _$concat9)), _token$componentCls)), defineProperty_defineProperty(_ref, "".concat(token.antCls, "-menu-sub").concat(token.antCls, "-menu-inline"), {
+  })), defineProperty_defineProperty(_$concat8, "".concat(token.antCls, "-menu-item-selected"), {
+    color: token.header.colorTextMenuActive,
+    fontWeight: 'bold',
+    borderRadius: token.radiusBase
+  }), _$concat8)), _$concat9)), _token$componentCls)), defineProperty_defineProperty(_ref, "".concat(token.antCls, "-menu-sub").concat(token.antCls, "-menu-inline"), {
     backgroundColor: 'transparent!important'
   }), defineProperty_defineProperty(_ref, "".concat(token.antCls, "-menu-submenu-popup"), (_$concat11 = {
     backgroundColor: 'rgba(255, 255, 255, 0.42)',
@@ -86014,13 +86108,16 @@ var compatibleStyle = function compatibleStyle(token) {
   }, "".concat(token.antCls, "-menu-item:active, \n        ").concat(token.antCls, "-menu-submenu-title:active"), {
     backgroundColor: 'transparent!important'
   })), defineProperty_defineProperty(_$concat11, "".concat(token.antCls, "-menu-item-selected"), {
-    color: token.sider.colorTextMenuSelected
+    color: token.sider.colorTextMenuSelected,
+    fontWeight: 'bold'
   }), defineProperty_defineProperty(_$concat11, "".concat(token.antCls, "-menu-submenu-selected"), {
-    color: token.sider.colorTextMenuSelected
+    color: token.sider.colorTextMenuSelected,
+    fontWeight: 'bold'
   }), defineProperty_defineProperty(_$concat11, "".concat(token.antCls, "-menu:not(").concat(token.antCls, "-menu-horizontal)"), (_$concat$concat2 = {}, defineProperty_defineProperty(_$concat$concat2, "".concat(token.antCls, "-menu-item-selected"), {
     backgroundColor: 'rgba(0, 0, 0, 0.04)',
     borderRadius: token.radiusBase,
-    color: token.sider.colorTextMenuSelected
+    color: token.sider.colorTextMenuSelected,
+    fontWeight: 'bold'
   }), defineProperty_defineProperty(_$concat$concat2, "".concat(token.antCls, "-menu-item:hover, \n          ").concat(token.antCls, "-menu-item-active,\n          ").concat(token.antCls, "-menu-submenu-title:hover"), defineProperty_defineProperty({
     color: token.sider.colorTextMenuActive,
     borderRadius: token.radiusBase
@@ -86040,9 +86137,12 @@ var genProLayoutStyle = function genProLayoutStyle(token) {
       marginInline: 0,
       fontFamily: token.fontFamily
     }
-  }, token.proComponentsCls, (_token$proComponentsC = {}, defineProperty_defineProperty(_token$proComponentsC, "& ".concat(token.componentCls), (_$concat12 = {}, defineProperty_defineProperty(_$concat12, "& ".concat(token.antCls, "-layout"), {
+  }, token.proComponentsCls, (_token$proComponentsC = {}, defineProperty_defineProperty(_token$proComponentsC, "".concat(token.antCls, "-layout"), {
+    backgroundColor: 'transparent !important'
+  }), defineProperty_defineProperty(_token$proComponentsC, "& ".concat(token.componentCls), (_$concat12 = {}, defineProperty_defineProperty(_$concat12, "& ".concat(token.antCls, "-layout"), {
     display: 'flex',
-    backgroundColor: 'transparent'
+    backgroundColor: 'transparent',
+    width: '100%'
   }), defineProperty_defineProperty(_$concat12, "".concat(token.componentCls, "-content"), {
     display: 'flex',
     flexDirection: 'column',
@@ -86057,6 +86157,12 @@ var genProLayoutStyle = function genProLayoutStyle(token) {
     '&-has-page-container': {
       margin: 0
     }
+  }), defineProperty_defineProperty(_$concat12, "".concat(token.componentCls, "-container"), {
+    width: '100%',
+    display: 'flex',
+    flexDirection: 'column',
+    minWidth: 0,
+    minHeight: 0
   }), defineProperty_defineProperty(_$concat12, "".concat(token.componentCls, "-bg-list"), {
     pointerEvents: 'none',
     position: 'fixed',
@@ -86291,11 +86397,14 @@ var useCurrentMenuLayoutProps = function useCurrentMenuLayoutProps(currentMenu)
 var WrapContent = function WrapContent(props) {
   var _classNames;
 
+  var _useToken = useStyle_useToken(),
+      hashId = _useToken.hashId;
+
   var style = props.style,
       prefixCls = props.prefixCls,
       children = props.children,
       hasPageContainer = props.hasPageContainer;
-  var contentClassName = classnames_default()("".concat(prefixCls, "-content"), (_classNames = {}, defineProperty_defineProperty(_classNames, "".concat(prefixCls, "-has-header"), props.hasHeader), defineProperty_defineProperty(_classNames, "".concat(prefixCls, "-content-has-page-container"), hasPageContainer), _classNames));
+  var contentClassName = classnames_default()("".concat(prefixCls, "-content"), hashId, (_classNames = {}, defineProperty_defineProperty(_classNames, "".concat(prefixCls, "-has-header"), props.hasHeader), defineProperty_defineProperty(_classNames, "".concat(prefixCls, "-content-has-page-container"), hasPageContainer), _classNames));
   var ErrorComponent = props.ErrorBoundary || ErrorBoundary;
   return props.ErrorBoundary === false ? (0,jsx_runtime.jsx)(external_antd_.Layout.Content, {
     className: contentClassName,
@@ -86789,7 +86898,7 @@ var BaseProLayout = function BaseProLayout(props) {
           }, style),
           children: [siderMenuDom, (0,jsx_runtime.jsxs)("div", {
             style: genLayoutStyle,
-            className: context.getPrefixCls('layout'),
+            className: "".concat(proLayoutClassName, "-container"),
             children: [headerDom, (0,jsx_runtime.jsx)(WrapContent, objectSpread2_objectSpread2(objectSpread2_objectSpread2({
               hasPageContainer: hasPageContainer,
               isChildrenLayout: isChildrenLayout
@@ -86813,9 +86922,14 @@ BaseProLayout.defaultProps = objectSpread2_objectSpread2(objectSpread2_objectSpr
 });
 
 var ProLayout_ProLayout = function ProLayout(props) {
+  var _process$env$NODE_ENV;
+
   var colorPrimary = props.colorPrimary;
-  return (0,jsx_runtime.jsx)(external_antd_.ConfigProvider, {
+  return (0,jsx_runtime.jsx)(external_antd_.ConfigProvider // @ts-ignore
+  , {
+    // @ts-ignore
     theme: {
+      hashed: ((_process$env$NODE_ENV = "production") === null || _process$env$NODE_ENV === void 0 ? void 0 : _process$env$NODE_ENV.toLowerCase()) !== 'test',
       token: {
         radiusBase: 4,
         colorPrimary: colorPrimary || '#1677FF',
@@ -91220,6 +91334,7 @@ function ColumnSetting(props) {
 
 
 
+
 var HeaderMenu = function HeaderMenu(props) {
   var _props$items = props.items,
       items = _props$items === void 0 ? [] : _props$items,
@@ -91260,7 +91375,9 @@ var HeaderMenu = function HeaderMenu(props) {
   }
 
   if (type === 'tab') {
-    return (0,jsx_runtime.jsx)(external_antd_.Tabs, {
+    return (0,jsx_runtime.jsx)(external_antd_.Tabs //@ts-ignore
+    , {
+      //@ts-ignore
       items: items.map(function (item) {
         var _item$key;
 
@@ -91271,7 +91388,13 @@ var HeaderMenu = function HeaderMenu(props) {
       activeKey: activeItem.key,
       onTabClick: function onTabClick(key) {
         return setActiveKey(key);
-      }
+      },
+      children: items === null || items === void 0 ? void 0 : items.map(function (item, index) {
+        return /*#__PURE__*/(0,external_React_.createElement)(external_antd_.Tabs.TabPane, objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, item), {}, {
+          key: item.key || index,
+          tab: item.label
+        }));
+      })
     });
   }
 
@@ -91429,6 +91552,7 @@ function ListToolBar_style_useStyle(prefixCls) {
 
 
 
+
 /**
  * 获取配置区域 DOM Item
  *
@@ -91468,6 +91592,8 @@ function getSettingItem(setting) {
 }
 
 var ListToolBarTabBar = function ListToolBarTabBar(_ref) {
+  var _tabs$items;
+
   var prefixCls = _ref.prefixCls,
       _ref$tabs = _ref.tabs,
       tabs = _ref$tabs === void 0 ? {} : _ref$tabs,
@@ -91478,6 +91604,7 @@ var ListToolBarTabBar = function ListToolBarTabBar(_ref) {
     className: "".concat(prefixCls, "-extra-line"),
     children: tabs.items && tabs.items.length ? (0,jsx_runtime.jsx)(external_antd_.Tabs, {
       activeKey: tabs.activeKey,
+      //@ts-ignore
       items: tabs.items.map(function (item, index) {
         var _item$key;
 
@@ -91488,7 +91615,13 @@ var ListToolBarTabBar = function ListToolBarTabBar(_ref) {
         });
       }),
       onChange: tabs.onChange,
-      tabBarExtraContent: filtersNode
+      tabBarExtraContent: filtersNode,
+      children: (_tabs$items = tabs.items) === null || _tabs$items === void 0 ? void 0 : _tabs$items.map(function (item, index) {
+        return /*#__PURE__*/(0,external_React_.createElement)(external_antd_.Tabs.TabPane, objectSpread2_objectSpread2(objectSpread2_objectSpread2({}, item), {}, {
+          key: item.key || index,
+          tab: item.tab
+        }));
+      })
     }) : filtersNode
   });
 };
@@ -113539,17 +113672,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.17",
-  "@ant-design/pro-components": "2.0.4",
-  "@ant-design/pro-descriptions": "2.0.0-experimental.18",
-  "@ant-design/pro-field": "2.0.0-experimental.17",
-  "@ant-design/pro-form": "2.0.0-experimental.18",
-  "@ant-design/pro-layout": "7.0.0-experimental.29",
-  "@ant-design/pro-list": "2.0.0-experimental.19",
+  "@ant-design/pro-card": "2.0.0-experimental.18",
+  "@ant-design/pro-components": "2.0.5",
+  "@ant-design/pro-descriptions": "2.0.0-experimental.19",
+  "@ant-design/pro-field": "2.0.0-experimental.18",
+  "@ant-design/pro-form": "2.0.0-experimental.19",
+  "@ant-design/pro-layout": "7.0.0-experimental.30",
+  "@ant-design/pro-list": "2.0.0-experimental.20",
   "@ant-design/pro-provider": "2.0.0-experimental.10",
-  "@ant-design/pro-skeleton": "2.0.0-experimental.8",
-  "@ant-design/pro-table": "3.0.0-experimental.19",
-  "@ant-design/pro-utils": "2.0.0-experimental.16"
+  "@ant-design/pro-skeleton": "2.0.0-experimental.9",
+  "@ant-design/pro-table": "3.0.0-experimental.20",
+  "@ant-design/pro-utils": "2.0.0-experimental.17"
 };
 ;// CONCATENATED MODULE: ./packages/components/src/index.tsx