@oceanbase/design 1.0.0-alpha.3 → 1.0.0-alpha.5

package/es/static-function/index.js

@@ -5,17 +5,20 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 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(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { useContext } from 'react';
 import { App, message as antMessage, Modal as AntModal, notification as antNotification } from 'antd';
 import formatToken from 'antd/lib/theme/util/alias';
+import ConfigProvider from "../config-provider";
+import useModalStyle from "../modal/style";
 import theme from "../theme";
 import defaultTheme from "../theme/default";
 var defaultAlgorithm = theme.defaultAlgorithm,
   defaultSeed = theme.defaultSeed,
   useToken = theme.useToken;
 
-// 设置默认 token
+// set default token
 var mapToken = _objectSpread(_objectSpread(_objectSpread({}, defaultAlgorithm(defaultSeed)), defaultTheme.token), {}, {
-  // 需要覆盖部分 Alias Token 的值
+  // need to override some Alias Token values
   override: {
     boxShadow: (_defaultTheme$token = defaultTheme.token) === null || _defaultTheme$token === void 0 ? void 0 : _defaultTheme$token.boxShadow,
     boxShadowSecondary: (_defaultTheme$token2 = defaultTheme.token) === null || _defaultTheme$token2 === void 0 ? void 0 : _defaultTheme$token2.boxShadowSecondary,
@@ -27,10 +30,16 @@ var message = antMessage;
 var notification = antNotification;
 var modal = AntModal;
 export default (function () {
-  // 自动注入 useToken，避免每次使用都要声明一遍，比较繁琐
+  // automatically inject useToken, avoid declaring it every time
   token = useToken().token;
+  var _useContext = useContext(ConfigProvider.ConfigContext),
+    getPrefixCls = _useContext.getPrefixCls;
+  var prefixCls = getPrefixCls('modal');
+
+  // register Modal style, ensure static function can also apply style
+  useModalStyle(prefixCls);
   var staticFunction = App.useApp();
-  // 替换 antd 的静态方法，支持消费 ConfigProvider 配置
+  // replace antd's static methods, support consuming ConfigProvider configuration
   message = _objectSpread(_objectSpread({}, staticFunction.message), {}, {
     useMessage: antMessage.useMessage
   });

package/es/table/style/index.js

@@ -2,6 +2,7 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 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(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { unit } from '@ant-design/cssinjs';
 import { genComponentStyleHook } from "../../_util/genComponentStyleHook";
 export var genTableStyle = function genTableStyle(token) {
   var _ref;
@@ -17,7 +18,8 @@ export var genTableStyle = function genTableStyle(token) {
     colorBorderSecondary = token.colorBorderSecondary,
     padding = token.padding,
     marginLG = token.marginLG,
-    marginXS = token.marginXS;
+    marginXS = token.marginXS,
+    calc = token.calc;
   return _ref = {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_ref, "".concat(componentCls, "-wrapper ").concat(componentCls), _defineProperty(_defineProperty(_defineProperty({
     color: colorText,
     backgroundColor: colorBgBase,
@@ -26,9 +28,8 @@ export var genTableStyle = function genTableStyle(token) {
     borderBottom: "1px solid ".concat(colorBorderSecondary),
     borderRadius: 0
   }), "".concat(componentCls, "-thead > tr"), _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, 'th', {
-    // 弱化列标题
     color: colorTextSecondary,
-    fontWeight: 'normal',
+    fontWeight: token.fontWeight,
     backgroundColor: colorBgBase
   }), "th".concat(componentCls, "-column-has-sorters"), {
     backgroundColor: colorBgBase
@@ -47,7 +48,7 @@ export var genTableStyle = function genTableStyle(token) {
   })), "tr > td", {
     transition: "background ".concat(token.motionDurationMid)
   }), "".concat(componentCls, "-placeholder td"), {}), "".concat(componentCls, "-empty-wrapper"), {
-    minHeight: 360 - token.paddingSM * 2,
+    minHeight: calc(360).sub(calc(token.paddingSM).mul(2).equal()).equal(),
     display: 'flex',
     justifyContent: 'center',
     alignItems: 'center'
@@ -62,18 +63,17 @@ export var genTableStyle = function genTableStyle(token) {
   }), "".concat(componentCls, "-empty-wrapper"), {
     minHeight: 'auto'
   })))), "".concat(componentCls, "-wrapper ").concat(componentCls).concat(componentCls, "-middle"), _defineProperty({}, "".concat(componentCls, "-tbody"), _defineProperty({}, "".concat(componentCls, "-empty-wrapper"), {
-    minHeight: 260 - token.paddingXS * 2
+    minHeight: calc(260).sub(calc(token.paddingXS).mul(2).equal()).equal()
   }))), "".concat(componentCls, "-wrapper ").concat(componentCls).concat(componentCls, "-small"), _defineProperty({}, "".concat(componentCls, "-tbody"), _defineProperty({}, "".concat(componentCls, "-empty-wrapper"), {
-    minHeight: 160 - token.paddingXXS * 2
+    minHeight: calc(160).sub(calc(token.paddingXXS).mul(2).equal()).equal()
   }))), "".concat(componentCls, "-wrapper ").concat(componentCls).concat(componentCls, "-bordered"), _defineProperty({}, "".concat(componentCls, "-footer"), {
-    borderRadius: "0px 0px ".concat(token.borderRadiusLG, "px ").concat(token.borderRadiusLG, "px")
+    borderRadius: "0px 0px ".concat(unit(token.borderRadiusLG), " ").concat(unit(token.borderRadiusLG))
   })), "".concat(componentCls, "-wrapper").concat(componentCls, "-inner-bordered ").concat(componentCls, "-bordered"), _defineProperty({}, "".concat(componentCls, "-container"), _defineProperty({
     borderInlineStart: 'none',
     borderTop: 'none'
   }, "".concat(componentCls, "-thead > tr > th, ").concat(componentCls, "-tbody > tr > td"), _defineProperty({}, '&:last-child', {
     borderInlineEnd: 'none'
   })))), "".concat(componentCls, "-wrapper ").concat(componentCls, ":not(").concat(componentCls, "-bordered)"), _defineProperty({}, "".concat(componentCls, "-thead, ").concat(componentCls, "-tbody"), _defineProperty({}, 'td, th', _defineProperty(_defineProperty({}, "&".concat(componentCls, "-row-expand-icon-cell"), {
-    backgroundColor: colorBgBase,
     // 设置 paddingRight 即可
     paddingRight: token.paddingXS
   }), "&".concat(componentCls, "-selection-column, &").concat(componentCls, "-row-expand-icon-cell"), _defineProperty({}, "& + td, & + th", {
@@ -82,26 +82,26 @@ export var genTableStyle = function genTableStyle(token) {
     borderBottomLeftRadius: 0,
     borderBottomRightRadius: 0
   }), "".concat(componentCls, "-wrapper").concat(componentCls, "-expandable"), _defineProperty(_defineProperty({}, "".concat(componentCls), _defineProperty({}, "".concat(componentCls, "-tbody"), _defineProperty(_defineProperty({}, "".concat(componentCls, "-expanded-row > td"), _defineProperty(_defineProperty({}, "& > *:not(".concat(componentCls, "-wrapper):not(").concat(componentCls, "-expanded-row-fixed)"), {
-    marginLeft: token.marginXL + token.lineWidth * 2
+    marginLeft: calc(token.marginXL).add(calc(token.lineWidth).mul(2).equal()).equal()
   }), "& > *".concat(componentCls, "-expanded-row-fixed"), {
-    paddingLeft: token.marginXL + token.lineWidth * 2 + token.padding
+    paddingLeft: calc(token.marginXL).add(calc(token.lineWidth).mul(2).equal()).add(token.padding).equal()
   })), "tr > td > ".concat(componentCls, "-wrapper:only-child ").concat(componentCls), {
-    marginLeft: token.margin + token.lineWidth * 2
+    marginLeft: calc(token.margin).add(calc(token.lineWidth).mul(2).equal()).equal()
   }))), "".concat(componentCls, "-middle, ").concat(componentCls, "-small"), _defineProperty({}, "".concat(componentCls, "-tbody"), _defineProperty({}, "tr > td > ".concat(componentCls, "-wrapper:only-child ").concat(componentCls), {
-    marginLeft: token.margin + token.lineWidth * 2 + token.margin
+    marginLeft: calc(token.margin).add(calc(token.lineWidth).mul(2).equal()).add(token.margin).equal()
   })))), "".concat(componentCls, "-wrapper").concat(componentCls, "-expandable").concat(componentCls, "-selectable"), _defineProperty(_defineProperty({}, "".concat(componentCls), _defineProperty({}, "".concat(componentCls, "-tbody"), _defineProperty(_defineProperty({}, "".concat(componentCls, "-expanded-row > td"), _defineProperty(_defineProperty({}, "& > *:not(".concat(componentCls, "-wrapper):not(").concat(componentCls, "-expanded-row-fixed)"), {
-    marginLeft: token.marginXL + token.marginXL + token.lineWidth * 2
+    marginLeft: calc(token.marginXL).add(token.marginXL).add(calc(token.lineWidth).mul(2).equal()).equal()
   }), "& > *".concat(componentCls, "-expanded-row-fixed"), {
-    paddingLeft: token.marginXL + token.marginXL + token.lineWidth * 2 + token.padding
+    paddingLeft: calc(token.marginXL).add(token.marginXL).add(calc(token.lineWidth).mul(2).equal()).add(token.padding).equal()
   })), "tr > td > ".concat(componentCls, "-wrapper:only-child ").concat(componentCls), {
-    marginLeft: token.margin + token.marginXL + token.lineWidth * 2
+    marginLeft: calc(token.margin).add(token.marginXL).add(calc(token.lineWidth).mul(2).equal()).equal()
   }))), "".concat(componentCls, "-middle, ").concat(componentCls, "-small"), _defineProperty({}, "".concat(componentCls, "-tbody"), _defineProperty({}, "tr > td > ".concat(componentCls, "-wrapper:only-child ").concat(componentCls), {
-    marginLeft: token.margin + token.marginXL + token.lineWidth * 2 + token.margin
+    marginLeft: calc(token.margin).add(token.marginXL).add(calc(token.lineWidth).mul(2).equal()).add(token.margin).equal()
   })))), "".concat(componentCls, "-wrapper ").concat(antCls, "-spin-blur"), _defineProperty({}, "".concat(componentCls, "-tbody"), _defineProperty({}, "".concat(componentCls, "-placeholder"), {
     // hide empty when Table loading
     visibility: 'hidden'
   }))), _defineProperty(_defineProperty(_defineProperty(_ref, "".concat(componentCls, "-wrapper"), _defineProperty({}, "".concat(componentCls, "-pagination"), _defineProperty(_defineProperty({}, "&".concat(antCls, "-pagination"), {
-    padding: "".concat(padding, "px 0"),
+    padding: "".concat(unit(padding), " 0"),
     margin: '0 !important'
   }), "".concat(componentCls, "-batch-operation-bar"), _defineProperty({
     position: 'absolute',
@@ -110,9 +110,9 @@ export var genTableStyle = function genTableStyle(token) {
     marginRight: marginLG
   }, "".concat(componentCls, "-batch-operation-selection"), _defineProperty({
     color: colorTextSecondary,
-    fontWeight: 500
+    fontWeight: token.fontWeightStrong
   }, "".concat(componentCls, "-batch-operation-selection-count"), {
-    margin: "0 ".concat(marginXS, "px"),
+    margin: "0 ".concat(unit(marginXS)),
     color: colorLink
   }))))), "".concat(antCls, "-popover").concat(componentCls, "-batch-operation-selection-popover"), _defineProperty({}, "".concat(antCls, "-popover-inner"), {
     padding: 0

package/es/tabs/style/index.js

@@ -10,9 +10,11 @@ export var genTabsStyle = function genTabsStyle(token) {
     colorInfoBg = token.colorInfoBg,
     colorTextSecondary = token.colorTextSecondary,
     colorFillQuaternary = token.colorFillQuaternary;
-  return _defineProperty({}, componentCls, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "&".concat(componentCls, "-no-divider"), _defineProperty({}, "&".concat(componentCls, "-top, &").concat(componentCls, "-bottom"), _defineProperty({}, "".concat(componentCls, "-nav::before"), {
+  return _defineProperty({}, componentCls, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "&".concat(componentCls, "-no-divider"), _defineProperty({}, "&".concat(componentCls, "-top, &").concat(componentCls, "-bottom"), _defineProperty({}, "".concat(componentCls, "-nav::before"), {
     border: 'none'
-  }))), "".concat(componentCls, "-tab"), _defineProperty(_defineProperty({}, "".concat(componentCls, "-tab-tag"), {
+  }))), "&".concat(componentCls, "-left, &").concat(componentCls, "-right"), _defineProperty({}, "".concat(componentCls, "-tab[data-node-key^=divider-]"), {
+    paddingBlock: 0
+  })), "".concat(componentCls, "-tab"), _defineProperty(_defineProperty({}, "".concat(componentCls, "-tab-tag"), {
     color: colorTextSecondary,
     fontSize: 12,
     borderRadius: 12,

package/es/tag/index.d.ts

@@ -4,6 +4,7 @@ import type { Ellipsis } from '../_util/getEllipsisConfig';
 export * from 'antd/es/tag';
 export interface TagProps extends AntTagProps {
     ellipsis?: Ellipsis;
+    pill?: boolean;
 }
 declare const _default: React.ForwardRefExoticComponent<TagProps & React.RefAttributes<HTMLSpanElement>> & {
     CheckableTag: React.ForwardRefExoticComponent<import("antd/es/tag").CheckableTagProps & React.RefAttributes<HTMLSpanElement>>;

package/es/tag/index.js

@@ -1,5 +1,5 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _excluded = ["children", "prefixCls", "icon", "className", "ellipsis"];
+var _excluded = ["children", "prefixCls", "icon", "className", "ellipsis", "pill"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 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; }
@@ -28,6 +28,7 @@ var Tag = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         title: children
       }
     } : _ref$ellipsis,
+    pill = _ref.pill,
     restProps = _objectWithoutProperties(_ref, _excluded);
   var _useContext = useContext(ConfigProvider.ConfigContext),
     getPrefixCls = _useContext.getPrefixCls;
@@ -35,7 +36,7 @@ var Tag = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _useStyle = useStyle(prefixCls),
     wrapSSR = _useStyle.wrapSSR;
   var ellipsisConfig = getEllipsisConfig(ellipsis, children);
-  var tagCls = classNames(_defineProperty({}, "".concat(prefixCls, "-ellipsis"), !!ellipsisConfig), className);
+  var tagCls = classNames(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-ellipsis"), !!ellipsisConfig), "".concat(prefixCls, "-pill"), pill), className);
   var realIcon = icon ? /*#__PURE__*/_jsx("span", {
     className: "".concat(prefixCls, "-icon"),
     children: icon

package/es/tag/style/index.js

@@ -19,10 +19,12 @@ export var genTagStyle = function genTagStyle(token) {
   var antCls = token.antCls,
     componentCls = token.componentCls,
     iconCls = token.iconCls;
-  return _defineProperty({}, "".concat(componentCls), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
+  return _defineProperty({}, "".concat(componentCls), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
     paddingInline: token.paddingXS,
     fontSize: token.fontSizeSM
-  }, "".concat(componentCls, "-close-icon").concat(iconCls), {
+  }, "&:not(".concat(componentCls, "-pill)"), {
+    fontWeight: token.fontWeightStrong
+  }), "".concat(componentCls, "-close-icon").concat(iconCls), {
     marginInlineStart: token.marginXXS
   }), "".concat(antCls, "-typography"), _defineProperty({}, "".concat(componentCls, "-icon"), {
     marginInlineEnd: token.marginXXS
@@ -37,6 +39,10 @@ export var genTagStyle = function genTagStyle(token) {
     display: 'none'
   }), '&-borderless', {
     borderColor: 'transparent'
+  }), '&-pill', {
+    borderRadius: 100,
+    lineHeight: token.lineHeight,
+    marginInlineEnd: token.marginXXS
   }));
 };
 export default (function (prefixCls) {

package/es/theme/default.js

@@ -14,8 +14,8 @@ var colorTextTertiary = '#8592AD';
 var colorTextQuaternary = '#B6C0D4';
 var colorFill = '#CDD5E4';
 var colorFillSecondary = '#E2E8F3';
-var colorFillTertiary = '#EFF3FA';
-var colorFillQuaternary = '#F7F9FC';
+var colorFillTertiary = '#EBEFF7';
+var colorFillQuaternary = '#F5F7FC';
 var colorBorderSecondary = colorFillSecondary;
 var fontSizeSM = 12;
 var tagColorBorder = colorTextQuaternary;
@@ -77,7 +77,7 @@ var defaultTheme = {
     colorIcon: colorTextSecondary,
     colorBgBase: '#ffffff',
     colorBgContainer: '#ffffff',
-    colorBgLayout: colorFillQuaternary,
+    colorBgLayout: '#FBFCFE',
     colorBorder: colorFill,
     colorBorderSecondary: colorBorderSecondary,
     colorFill: colorFill,
@@ -96,6 +96,12 @@ var defaultTheme = {
     lineWidthFocus: 0
   },
   components: {
+    Alert: {
+      borderRadiusLG: 6
+    },
+    Badge: {
+      statusSize: 8
+    },
     Breadcrumb: {
       fontSize: fontSizeSM,
       fontHeight: 20,

package/es/theme/style/compact.less

@@ -310,12 +310,12 @@
 @colorTextQuaternary: #b6c0d4;
 @colorFill: #cdd5e4;
 @colorFillSecondary: #e2e8f3;
-@colorFillTertiary: #eff3fa;
-@colorFillQuaternary: #f7f9fc;
+@colorFillTertiary: #ebeff7;
+@colorFillQuaternary: #f5f7fc;
 @colorBgSolid: rgb(0,0,0);
 @colorBgSolidHover: rgba(0,0,0,0.75);
 @colorBgSolidActive: rgba(0,0,0,0.95);
-@colorBgLayout: #f7f9fc;
+@colorBgLayout: #fbfcfe;
 @colorBgContainer: #ffffff;
 @colorBgElevated: #ffffff;
 @colorBgSpotlight: #ffffff;
@@ -421,14 +421,14 @@
 @colorFuchsiaBg: #faf0fc;
 @colorFuchsiaText: #580e67;
 @colorIcon: #8592ad;
-@colorBgContainerDisabled: #eff3fa;
+@colorBgContainerDisabled: #ebeff7;
 @boxShadow: 0 6px 16px 0 rgba(54, 69, 99, 0.08), 0 3px 6px -4px rgba(54, 69, 99, 0.12), 0 9px 28px 8px rgba(54, 69, 99, 0.05);
 @boxShadowSecondary: 0 6px 16px 0 rgba(54, 69, 99, 0.08), 0 3px 6px -4px rgba(54, 69, 99, 0.12), 0 9px 28px 8px rgba(54, 69, 99, 0.05);
 @boxShadowTertiary: 0 1px 2px 0 rgba(54, 69, 99, 0.03), 0 1px 6px -1px rgba(54, 69, 99, 0.02), 0 2px 4px 0 rgba(54, 69, 99, 0.02);
 @lineWidthFocus: 3px;
 @colorFillContent: #e2e8f3;
 @colorFillContentHover: #cdd5e4;
-@colorFillAlter: #f7f9fc;
+@colorFillAlter: #f5f7fc;
 @colorBorderBg: #ffffff;
 @colorSplit: rgba(13,63,155,0.12);
 @colorTextPlaceholder: #b6c0d4;
@@ -446,11 +446,11 @@
 @fontSizeIcon: 12px;
 @controlOutlineWidth: 2px;
 @controlInteractiveSize: 14px;
-@controlItemBgHover: #eff3fa;
+@controlItemBgHover: #ebeff7;
 @controlItemBgActive: #e6f4ff;
 @controlItemBgActiveHover: #b0dbff;
 @controlItemBgActiveDisabled: #cdd5e4;
-@controlTmpOutline: #f7f9fc;
+@controlTmpOutline: #f5f7fc;
 @controlOutline: rgba(5,145,255,0.1);
 @opacityLoading: 0.65;
 @linkDecoration: none;

package/es/theme/style/default.less

@@ -310,12 +310,12 @@
 @colorTextQuaternary: #b6c0d4;
 @colorFill: #cdd5e4;
 @colorFillSecondary: #e2e8f3;
-@colorFillTertiary: #eff3fa;
-@colorFillQuaternary: #f7f9fc;
+@colorFillTertiary: #ebeff7;
+@colorFillQuaternary: #f5f7fc;
 @colorBgSolid: rgb(0,0,0);
 @colorBgSolidHover: rgba(0,0,0,0.75);
 @colorBgSolidActive: rgba(0,0,0,0.95);
-@colorBgLayout: #f7f9fc;
+@colorBgLayout: #fbfcfe;
 @colorBgContainer: #ffffff;
 @colorBgElevated: #ffffff;
 @colorBgSpotlight: #ffffff;
@@ -421,14 +421,14 @@
 @colorFuchsiaBg: #faf0fc;
 @colorFuchsiaText: #580e67;
 @colorIcon: #8592ad;
-@colorBgContainerDisabled: #eff3fa;
+@colorBgContainerDisabled: #ebeff7;
 @boxShadow: 0 6px 16px 0 rgba(54, 69, 99, 0.08), 0 3px 6px -4px rgba(54, 69, 99, 0.12), 0 9px 28px 8px rgba(54, 69, 99, 0.05);
 @boxShadowSecondary: 0 6px 16px 0 rgba(54, 69, 99, 0.08), 0 3px 6px -4px rgba(54, 69, 99, 0.12), 0 9px 28px 8px rgba(54, 69, 99, 0.05);
 @boxShadowTertiary: 0 1px 2px 0 rgba(54, 69, 99, 0.03), 0 1px 6px -1px rgba(54, 69, 99, 0.02), 0 2px 4px 0 rgba(54, 69, 99, 0.02);
 @lineWidthFocus: 3px;
 @colorFillContent: #e2e8f3;
 @colorFillContentHover: #cdd5e4;
-@colorFillAlter: #f7f9fc;
+@colorFillAlter: #f5f7fc;
 @colorBorderBg: #ffffff;
 @colorSplit: rgba(13,63,155,0.12);
 @colorTextPlaceholder: #b6c0d4;
@@ -446,11 +446,11 @@
 @fontSizeIcon: 12px;
 @controlOutlineWidth: 2px;
 @controlInteractiveSize: 14px;
-@controlItemBgHover: #eff3fa;
+@controlItemBgHover: #ebeff7;
 @controlItemBgActive: #e6f4ff;
 @controlItemBgActiveHover: #b0dbff;
 @controlItemBgActiveDisabled: #cdd5e4;
-@controlTmpOutline: #f7f9fc;
+@controlTmpOutline: #f5f7fc;
 @controlOutline: rgba(5,145,255,0.1);
 @opacityLoading: 0.65;
 @linkDecoration: none;

package/es/typography/style/index.js

@@ -2,13 +2,18 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 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(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { unit } from '@ant-design/cssinjs';
 import { genComponentStyleHook } from "../../_util/genComponentStyleHook";
 export var genTypographyStyle = function genTypographyStyle(token) {
   var componentCls = token.componentCls,
     controlHeight = token.controlHeight,
     fontSize = token.fontSize,
-    lineHeight = token.lineHeight;
-  var marginOffset = (controlHeight - fontSize * lineHeight) / 2;
+    lineHeight = token.lineHeight,
+    calc = token.calc;
+  var marginOffset = calc(controlHeight).sub(calc(fontSize).mul(lineHeight).equal()).div(2).equal();
+  var paddingTop = calc(marginOffset).sub(token.lineWidth).equal();
+  var paddingInline = calc(token.paddingSM).sub(token.lineWidth).equal();
+  var negativeMarginOffset = calc(marginOffset).mul(-1).equal();
   return _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls), _defineProperty({
     lineHeight: 'inherit',
     color: 'inherit',
@@ -18,39 +23,39 @@ export var genTypographyStyle = function genTypographyStyle(token) {
   })), "".concat(componentCls).concat(componentCls, "-editable-text:not(").concat(componentCls, "-edit-content)"), {
     '&:hover': {
       background: token.colorBgContainer,
-      border: "".concat(token.lineWidth, "px ").concat(token.lineType, " ").concat(token.colorBorder),
+      border: "".concat(unit(token.lineWidth), " ").concat(token.lineType, " ").concat(token.colorBorder),
       borderRadius: token.borderRadius,
       position: 'relative',
-      insetInlineStart: -token.paddingSM,
-      padding: "".concat(marginOffset - token.lineWidth, "px ").concat(token.paddingSM - token.lineWidth, "px")
+      insetInlineStart: calc(token.paddingSM).mul(-1).equal(),
+      padding: "".concat(paddingTop, " ").concat(paddingInline)
     },
     'div&:hover': {
       height: token.controlHeight,
-      marginTop: -marginOffset,
-      marginBottom: "calc(1em - ".concat(marginOffset, "px)")
+      marginTop: negativeMarginOffset,
+      marginBottom: calc('1em').sub(marginOffset).equal()
     },
     'span&:hover': {
       display: 'inline-block',
       height: token.controlHeight,
-      marginTop: -marginOffset,
-      marginBottom: -marginOffset
+      marginTop: negativeMarginOffset,
+      marginBottom: negativeMarginOffset
     },
     'h1&:hover, h2&:hover, h3&:hover, h4&:hover, h5&:hover': {
-      marginTop: "".concat(-marginOffset, "px !important"),
-      marginBottom: "".concat(-marginOffset, "px !important")
+      marginTop: "".concat(negativeMarginOffset, " !important"),
+      marginBottom: "".concat(negativeMarginOffset, " !important")
     }
   }), "".concat(componentCls).concat(componentCls, "-edit-content"), _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls, "-div&"), {
-    insetInlineStart: -token.paddingSM,
-    marginTop: -marginOffset,
-    marginBottom: "calc(1em - ".concat(marginOffset, "px)")
+    insetInlineStart: calc(token.paddingSM).mul(-1).equal(),
+    marginTop: negativeMarginOffset,
+    marginBottom: calc('1em').sub(marginOffset).equal()
   }), "".concat(componentCls, "-span&"), {
-    insetInlineStart: -token.paddingSM,
-    marginTop: -marginOffset,
-    marginBottom: -marginOffset
+    insetInlineStart: calc(token.paddingSM).mul(-1).equal(),
+    marginTop: negativeMarginOffset,
+    marginBottom: negativeMarginOffset
   }), "".concat(componentCls, "-h1&, ").concat(componentCls, "-h2&, ").concat(componentCls, "-h3&, ").concat(componentCls, "-h4&, ").concat(componentCls, "-h5&"), {
-    insetInlineStart: -token.paddingSM,
-    marginTop: "".concat(-marginOffset, "px !important"),
-    marginBottom: "".concat(-marginOffset, "px !important")
+    insetInlineStart: calc(token.paddingSM).mul(-1).equal(),
+    marginTop: "".concat(negativeMarginOffset, " !important"),
+    marginBottom: "".concat(negativeMarginOffset, " !important")
   }));
 };
 export default (function (prefixCls) {

package/lib/alert/index.d.ts

@@ -3,10 +3,10 @@ import type { AlertProps as AntAlertProps } from 'antd/es/alert';
 export * from 'antd/es/alert';
 export interface AlertProps extends AntAlertProps {
     ghost?: boolean;
-    colored?: boolean;
+    mini?: boolean;
 }
 declare const Alert: {
-    ({ type, ghost, colored, prefixCls: customizePrefixCls, className, ...restProps }: AlertProps): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    ({ type: typeProp, showIcon, closable, ghost, mini, banner, prefixCls: customizePrefixCls, className, ...restProps }: AlertProps): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
     ErrorBoundary: typeof import("antd/es/alert/ErrorBoundary").default;
     displayName: string;
 };

package/lib/alert/index.js

@@ -39,6 +39,7 @@ var import_icons = require("@oceanbase/icons");
 var import_classnames = __toESM(require("classnames"));
 var import_config_provider = __toESM(require("../config-provider"));
 var import_style = __toESM(require("./style"));
+var import_theme = __toESM(require("../theme"));
 __reExport(alert_exports, require("antd/es/alert"), module.exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var iconMapOutlined = {
@@ -48,20 +49,26 @@ var iconMapOutlined = {
   warning: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.ExclamationCircleOutlined, {})
 };
 var Alert = ({
-  type,
+  type: typeProp,
+  showIcon = true,
+  closable,
   ghost,
-  colored,
+  mini,
+  banner,
   prefixCls: customizePrefixCls,
   className,
   ...restProps
 }) => {
+  const { token } = import_theme.default.useToken();
+  const type = banner && !typeProp ? "warning" : typeProp;
   const { getPrefixCls } = (0, import_react.useContext)(import_config_provider.default.ConfigContext);
   const prefixCls = getPrefixCls("alert", customizePrefixCls);
   const { wrapSSR } = (0, import_style.default)(prefixCls);
   const alertCls = (0, import_classnames.default)(
     {
+      [`${prefixCls}-closable`]: closable,
       [`${prefixCls}-ghost`]: ghost,
-      [`${prefixCls}-colored`]: colored
+      [`${prefixCls}-mini`]: mini
     },
     className
   );
@@ -70,6 +77,9 @@ var Alert = ({
       import_antd.Alert,
       {
         type,
+        showIcon,
+        closable,
+        banner,
         icon: iconMapOutlined[type],
         prefixCls: customizePrefixCls,
         className: alertCls,