@oceanbase/ui 0.2.11 → 0.2.13

package/es/BackgroundTaskManager/index.js

@@ -16,14 +16,14 @@ import { REFRESH_FREQUENCY } from "./constants";
 import { RefreshMan } from "./RefreshMan";
 
 // antd Notification组件支持的api种类
-export var NotificationApi;
-(function (NotificationApi) {
+export var NotificationApi = /*#__PURE__*/function (NotificationApi) {
   NotificationApi["success"] = "success";
   NotificationApi["error"] = "error";
   NotificationApi["info"] = "info";
   NotificationApi["warning"] = "warning";
   NotificationApi["open"] = "open";
-})(NotificationApi || (NotificationApi = {}));
+  return NotificationApi;
+}({});
 export var BackgroundTaskManagerConstants = {
   REFRESH_FREQUENCY: REFRESH_FREQUENCY,
   NotificationApi: NotificationApi

package/es/BasicLayout/index.js

@@ -1,5 +1,5 @@
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-var _excluded = ["children", "location", "banner", "iconUrl", "logoUrl", "simpleLogoUrl", "topHeader", "menus", "defaultCollapsed", "defaultSelectedKeys", "defaultOpenKeys", "sideHeader", "subSideMenuProps", "subSideMenus", "className"];
+var _excluded = ["children", "location", "banner", "iconUrl", "logoUrl", "simpleLogoUrl", "topHeader", "menus", "defaultCollapsed", "defaultSelectedKeys", "defaultOpenKeys", "sideHeader", "subSideMenuProps", "subSideMenus", "prefixCls", "className"];
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
@@ -16,24 +16,25 @@ import { CaretRightFilled, LeftOutlined, RightOutlined } from '@oceanbase/icons'
 import { setAlpha } from '@ant-design/pro-components';
 import { token } from '@oceanbase/design';
 import { isNullValue } from '@oceanbase/util';
-import { Divider, Layout, Menu, Tooltip } from '@oceanbase/design';
-import classnames from 'classnames';
+import { ConfigProvider, Divider, Layout, Menu, Tooltip } from '@oceanbase/design';
+import classNames from 'classnames';
 import { some } from 'lodash';
 import { pathToRegexp } from 'path-to-regexp';
-import React, { useEffect, useState } from 'react';
+import React, { useContext, useEffect, useState } from 'react';
 import LocaleWrapper from "../locale/LocaleWrapper";
 import { getPrefix, isEnglish, urlToList } from "../_util";
 import useHistory from "../_util/useHistory";
 import Header from "./Header";
-import "./index.less";
 import zhCN from "./locale/zh-CN";
+import useStyle from "./style";
+import "./index.less";
 var Content = Layout.Content,
   Sider = Layout.Sider;
 var SubMenu = Menu.SubMenu,
   Item = Menu.Item;
 var prefix = getPrefix('layout');
 var BasicLayout = function BasicLayout(_ref) {
-  var _classnames2;
+  var _classNames2;
   var children = _ref.children,
     _ref$location = _ref.location,
     _ref$location2 = _ref$location === void 0 ? {} : _ref$location,
@@ -54,8 +55,16 @@ var BasicLayout = function BasicLayout(_ref) {
     sideHeader = _ref.sideHeader,
     subSideMenuProps = _ref.subSideMenuProps,
     subSideMenus = _ref.subSideMenus,
+    customizePrefixCls = _ref.prefixCls,
     className = _ref.className,
     restProps = _objectWithoutProperties(_ref, _excluded);
+  var _useContext = useContext(ConfigProvider.ConfigContext),
+    getPrefixCls = _useContext.getPrefixCls;
+  var prefixCls = getPrefixCls('basic-layout', customizePrefixCls);
+  var _useStyle = useStyle(prefixCls),
+    wrapSSR = _useStyle.wrapSSR,
+    hashId = _useStyle.hashId;
+  var basicLayoutCls = classNames(className, hashId);
   var history = useHistory();
   // 侧边栏导航是否收起
   var _useState = useState(defaultCollapsed),
@@ -237,10 +246,10 @@ var BasicLayout = function BasicLayout(_ref) {
   } else if (!subSideMenus && !menus) {
     siderWidth = 0;
   }
-  return /*#__PURE__*/React.createElement(React.Fragment, null, banner && /*#__PURE__*/React.createElement("div", {
+  return wrapSSR( /*#__PURE__*/React.createElement(React.Fragment, null, banner && /*#__PURE__*/React.createElement("div", {
     className: "".concat(prefix, "-banner-wrapper")
   }, banner), /*#__PURE__*/React.createElement(Layout, _extends({
-    className: classnames(prefix, className, _defineProperty({}, "".concat(prefix, "-with-banner"), banner))
+    className: classNames(prefix, className, basicLayoutCls, _defineProperty({}, "".concat(prefix, "-with-banner"), banner))
   }, restProps), /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Header, _extends({
     pathname: pathname,
     iconUrl: iconUrl,
@@ -254,7 +263,7 @@ var BasicLayout = function BasicLayout(_ref) {
   }, (subSideMenus || menus) && /*#__PURE__*/React.createElement(Sider, {
     theme: "light",
     width: siderWidth,
-    className: classnames("".concat(prefix, "-sider"), (_classnames2 = {}, _defineProperty(_classnames2, "".concat(prefix, "-sider-collapsed"), collapsed), _defineProperty(_classnames2, "".concat(prefix, "-sider-has-sub-sider"), subSideMenus), _classnames2))
+    className: classNames("".concat(prefix, "-sider"), (_classNames2 = {}, _defineProperty(_classNames2, "".concat(prefix, "-sider-collapsed"), collapsed), _defineProperty(_classNames2, "".concat(prefix, "-sider-has-sub-sider"), subSideMenus), _classNames2))
   }, /*#__PURE__*/React.createElement("div", {
     className: "".concat(prefix, "-sider-wrapper")
   }, subSideMenus && /*#__PURE__*/React.createElement("div", {
@@ -300,11 +309,11 @@ var BasicLayout = function BasicLayout(_ref) {
       setOpenKeys([]);
     }
   }, collapsed ? /*#__PURE__*/React.createElement(RightOutlined, null) : /*#__PURE__*/React.createElement(LeftOutlined, null)))))), /*#__PURE__*/React.createElement(Content, {
-    className: classnames("".concat(prefix, "-content"), "".concat(prefix, "-content-").concat(siderWidth)),
+    className: classNames("".concat(prefix, "-content"), "".concat(prefix, "-content-").concat(siderWidth)),
     style: {
       marginLeft: siderWidth
     }
-  }, children))))));
+  }, children)))))));
 };
 export default LocaleWrapper({
   componentName: 'BasicLayout',

package/es/BasicLayout/index.less

@@ -371,10 +371,6 @@
   }
 }
 
-.@{prefixCls}-pro-footer-bar {
-  width: calc(100% - 192px - 24px);
-}
-
 @media (min-width: @maxWidth) {
   .@{prefixCls}-pro-footer-bar {
     right: calc((100% - @maxWidth) / 2 + 24px);

package/es/BasicLayout/style/index.d.ts

@@ -0,0 +1,5 @@
+import type { FullToken, GenerateStyle } from 'antd/es/theme/internal';
+export declare type BasicLayoutToken = FullToken<any>;
+export declare const genBasicLayoutStyle: GenerateStyle<BasicLayoutToken>;
+declare const _default: (prefixCls: string) => any;
+export default _default;

package/es/BasicLayout/style/index.js

@@ -0,0 +1,21 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+import { genComponentStyleHook } from "../../_util/genComponentStyleHook";
+export var genBasicLayoutStyle = function genBasicLayoutStyle(token) {
+  var _ref;
+  var proComponentsCls = token.proComponentsCls;
+  return _ref = {}, _defineProperty(_ref, "".concat(proComponentsCls, "-page-container"), {
+    // 48px is the height of BasicLayout header
+    minHeight: 'calc(100vh - 48px)'
+  }), _defineProperty(_ref, "".concat(proComponentsCls, "-footer-bar"), {
+    width: "calc(100% - 192px - 24px)"
+  }), _ref;
+};
+export default (function (prefixCls) {
+  var useStyle = genComponentStyleHook('BasicLayout', function (token) {
+    return [genBasicLayoutStyle(token)];
+  });
+  return useStyle(prefixCls);
+});

package/es/Highlight/index.d.ts

@@ -29,7 +29,7 @@ export declare const THEME_DARK = "dark";
 export declare const THEME_LIGHT = "light";
 declare const ThemeTypes: ["dark", "light"];
 export declare type ThemeType = (typeof ThemeTypes)[number];
-declare const supportedLanguages: ("ruby" | "javascript" | "typescript" | "css" | "groovy" | "java" | "python" | "bash" | "json" | "cpp" | "http" | "markdown" | "nginx" | "sql" | "xml" | "dockerfile" | "go" | "yaml" | "solidity" | "tsx" | "jsx")[];
+declare const supportedLanguages: ("ruby" | "json" | "javascript" | "typescript" | "css" | "groovy" | "java" | "python" | "bash" | "cpp" | "http" | "markdown" | "nginx" | "sql" | "xml" | "dockerfile" | "go" | "yaml" | "solidity" | "tsx" | "jsx")[];
 export declare type LanguageType = (typeof supportedLanguages)[number] | 'html';
 export interface HighlightProps extends LocaleWrapperProps {
     /**

package/es/Highlight/index.js

@@ -15,7 +15,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
  * 高亮能力基于highlight.js 的语法解析能力 https://highlightjs.org/
  * 听说过的还算有名的语言放在langugaes中了，需要新增语言时在languages文件夹中添加并import使用，加入到 languageMap中
  * 如果没有在 https://github.com/highlightjs/highlight.js/tree/master/src/languages 中查找是否支持，然后添加
- * 优先支持蚂蚁主流语言，没有import在代码中使用的不会打包
+ * 优先支持主流语言，没有 import 在代码中使用的不会打包
  */
 import hljs from 'highlight.js/lib/core';
 import React, { useEffect, useState } from 'react';
@@ -231,7 +231,6 @@ var Highlight = function Highlight(props) {
     className: classNames("".concat(prefixCls), className, themeClass)
   }), copyable && /*#__PURE__*/React.createElement(CopyButton, null), /*#__PURE__*/React.createElement("table", {
     style: {
-      padding: '0',
       height: height
     },
     className: classNames("".concat(theme === THEME_DARK ? "".concat(prefixCls, "-dark") : "".concat(prefixCls, "-light")))

package/es/Lottie/index.d.ts

@@ -1,10 +1,15 @@
-import type { AnimationConfig } from 'lottie-web';
+import type { AnimationConfig, AnimationItem } from 'lottie-web';
 import React from 'react';
-interface LottieProps extends Omit<AnimationConfig, 'container'> {
+export interface LottieProps extends Omit<AnimationConfig, 'container'> {
     path: string;
+    mode?: 'default' | 'icon';
+    loop?: boolean;
     speed?: number;
-    mode?: 'normal' | 'icon';
+    className?: string;
     style?: React.CSSProperties;
 }
-declare const Lottie: React.FC<LottieProps>;
+export interface LottieRef {
+    animation: AnimationItem;
+}
+declare const Lottie: React.ForwardRefExoticComponent<LottieProps & React.RefAttributes<LottieRef>>;
 export default Lottie;

package/es/Lottie/index.js

@@ -1,37 +1,65 @@
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-var _excluded = ["mode", "speed", "style"];
+var _excluded = ["mode", "loop", "speed", "className", "style"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-import classNames from 'classnames';
 import lottie from 'lottie-web';
-import React, { useEffect, useRef } from 'react';
-var Lottie = function Lottie(_ref) {
-  var mode = _ref.mode,
+import React, { useState, useEffect, useRef, useImperativeHandle } from 'react';
+import { useUpdateEffect } from 'ahooks';
+import classNames from 'classnames';
+var Lottie = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+  var _ref$mode = _ref.mode,
+    mode = _ref$mode === void 0 ? 'default' : _ref$mode,
+    _ref$loop = _ref.loop,
+    loop = _ref$loop === void 0 ? true : _ref$loop,
     _ref$speed = _ref.speed,
     speed = _ref$speed === void 0 ? 1 : _ref$speed,
+    className = _ref.className,
     style = _ref.style,
     restProps = _objectWithoutProperties(_ref, _excluded);
-  var ref = useRef();
+  var _useState = useState(),
+    _useState2 = _slicedToArray(_useState, 2),
+    animation = _useState2[0],
+    setAnimation = _useState2[1];
+  var containerRef = useRef();
   useEffect(function () {
-    // ref: https://github.com/airbnb/lottie-web/blob/master/index.d.ts#L81
-    var animation = lottie.loadAnimation(_objectSpread({
-      container: ref.current,
-      renderer: 'svg',
-      loop: false,
-      autoplay: true
-    }, restProps));
-    // ref: https://github.com/airbnb/lottie-web/blob/master/index.d.ts#L6
-    animation.setSpeed(speed);
+    if (!animation) {
+      // ref: https://github.com/airbnb/lottie-web/blob/master/index.d.ts#L129
+      var newAnimation = lottie.loadAnimation(_objectSpread({
+        container: containerRef.current,
+        renderer: 'svg',
+        loop: loop
+      }, restProps));
+      setAnimation(newAnimation);
+    }
   }, []);
-  return /*#__PURE__*/React.createElement("span", {
-    ref: ref,
-    className: classNames('ob-lottie', _defineProperty({}, 'anticon', mode === 'icon')),
-    style: style
+  useUpdateEffect(function () {
+    if (animation) {
+      animation.setLoop(loop);
+      animation.setSpeed(speed);
+    }
+  }, [loop, speed]);
+  useImperativeHandle(ref, function () {
+    return {
+      animation: animation
+    };
+  });
+  return /*#__PURE__*/React.createElement("div", {
+    ref: containerRef,
+    className: classNames(className, _defineProperty({}, 'anticon', mode === 'icon')),
+    style: _objectSpread({
+      display: 'inline-block'
+    }, style)
   });
-};
+});
 export default Lottie;

package/es/NavMenu/index.js

@@ -29,26 +29,33 @@ export default (function (props) {
   var history = useHistory();
   var preProcess = useCallback(function (list) {
     var pathname = location.pathname;
-    for (var i = 0; i < list.length; i++) {
-      var _list$i = list[i],
-        link = _list$i.link,
-        openNewTab = _list$i.openNewTab,
-        href = _list$i.href,
-        key = _list$i.key,
-        children = _list$i.children;
-      var linkList = isArray(link) ? link : [link];
-      var match = linkList.some(function (lk) {
-        return pathToRegexp(lk).test(pathname);
-      });
-      if (match) {
-        if (openNewTab || href) return false;
-        setSelectedKeys([key]);
-        setMenus(list);
-        return;
-      }
-      if (!!(children !== null && children !== void 0 && children.length)) {
-        preProcess(children);
+    try {
+      for (var i = 0; i < list.length; i++) {
+        var _list$i = list[i],
+          link = _list$i.link,
+          openNewTab = _list$i.openNewTab,
+          href = _list$i.href,
+          key = _list$i.key,
+          children = _list$i.children;
+        var linkList = isArray(link) ? link : [link];
+        var match = linkList.some(function (lk) {
+          return (
+            // pathToRegexp 不支持 http/https 协议解析，需要去掉协议头
+            pathToRegexp(lk.replace(/^https?:\/\//, '')).test(pathname)
+          );
+        });
+        if (match) {
+          if (openNewTab || href) return false;
+          setSelectedKeys([key]);
+          setMenus(list);
+          return;
+        }
+        if (!!(children !== null && children !== void 0 && children.length)) {
+          preProcess(children);
+        }
       }
+    } catch (error) {
+      console.log('error', error);
     }
   }, [location]);
   useEffect(function () {

package/es/PageContainer/ItemRender.d.ts

@@ -1,7 +1,8 @@
+import React from 'react';
 declare const _default: ({ route, params, routes, paths }: {
     route: any;
     params: any;
     routes: any;
     paths: any;
-}) => import("react").JSX.Element;
+}) => React.JSX.Element;
 export default _default;

package/es/PageContainer/ItemRender.js

@@ -1,3 +1,4 @@
+import React from 'react';
 import useHistory from "../_util/useHistory";
 export default (function (_ref) {
   var route = _ref.route,

package/es/PageContainer/index.js

@@ -10,11 +10,10 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import { SyncOutlined } from '@oceanbase/icons';
 import { PageContainer as AntPageContainer } from '@ant-design/pro-components';
-import { Space } from '@oceanbase/design';
 import classNames from 'classnames';
 import { isObject } from 'lodash';
 import React, { useContext } from 'react';
-import { ConfigProvider, Tooltip } from '@oceanbase/design';
+import { ConfigProvider, Space, Tooltip } from '@oceanbase/design';
 import LocaleWrapper from "../locale/LocaleWrapper";
 import ItemRender from "./ItemRender";
 import zhCN from "./locale/zh-CN";

package/es/PageContainer/style/index.js

@@ -8,6 +8,7 @@ export var genPageContainerStyle = function genPageContainerStyle(token) {
   var antCls = token.antCls,
     proComponentsCls = token.proComponentsCls,
     componentCls = token.componentCls,
+    colorBgLayout = token.colorBgLayout,
     colorBgBase = token.colorBgBase,
     borderRadius = token.borderRadius,
     boxShadowSecondary = token.boxShadowSecondary,
@@ -18,8 +19,8 @@ export var genPageContainerStyle = function genPageContainerStyle(token) {
   var height = controlHeightLG;
   var lineHeight = "".concat(controlHeightLG, "px");
   return _ref = {}, _defineProperty(_ref, "".concat(componentCls), (_$concat3 = {
-    // 48px is the height of BasicLayout header
-    minHeight: 'calc(100vh - 48px)'
+    minHeight: '100vh',
+    backgroundColor: colorBgLayout
   }, _defineProperty(_$concat3, "".concat(proComponentsCls, "-grid-content"), {
     minHeight: 'auto'
   }), _defineProperty(_$concat3, "".concat(antCls, "-page-header"), (_$concat2 = {}, _defineProperty(_$concat2, "".concat(antCls, "-page-header-breadcrumb"), {
@@ -54,6 +55,7 @@ export var genPageContainerStyle = function genPageContainerStyle(token) {
   })), _defineProperty(_ref, "".concat(componentCls, "-with-footer "), {
     paddingBottom: 64
   }), _defineProperty(_ref, "".concat(proComponentsCls, "-footer-bar"), (_$concat5 = {
+    width: '100%',
     backgroundColor: colorBgBase,
     borderRadius: borderRadius,
     boxShadow: boxShadowSecondary,

package/es/SideTip/index.less

@@ -75,7 +75,7 @@
     user-select: none;
 
     &.@{prefix}-button-primary {
-      background-color: #1677ff;
+      background-color: #006aff;
     }
 
     &.@{prefix}-button-small {
@@ -95,7 +95,7 @@
       position: absolute;
       width: 56px;
       height: 56px;
-      color: #1677ff;
+      color: #006aff;
       font-size: 56px;
       inset-block-start: 0;
       inset-inline-end: 0;

package/es/_util/useHistory.js

@@ -1,9 +1,13 @@
-import { useHistory,
+import {
+// react-router-dom v5
+// @ts-ignore
+
 // react-router-dom v6
 // @ts-ignore
 useNavigate } from 'react-router-dom';
 export default (function () {
   return {
-    push: useHistory ? useHistory().push : useNavigate ? useNavigate() : null
+    // push: useHistory ? useHistory().push : useNavigate ? useNavigate() : null,
+    push: useNavigate ? useNavigate() : null
   };
 });

package/es/index.less

@@ -1,15 +1 @@
 @import './variable.less';
-
-html,
-body {
-  height: 100%;
-  margin: 0;
-  padding: 0;
-  background-color: @colorBgLayout;
-}
-
-#root {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-}