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

package/es/config-provider/index.js

@@ -75,9 +75,13 @@ var ConfigProvider = function ConfigProvider(_ref3) {
     card: merge({}, parentContext.card, card),
     collapse: merge({}, {
       expandIcon: function expandIcon(_ref4) {
+        var _mergedTheme$token4, _mergedTheme$token5;
         var isActive = _ref4.isActive;
         return /*#__PURE__*/_jsx(CaretRightOutlined, {
-          rotate: isActive ? 90 : 0
+          rotate: isActive ? 90 : 0,
+          style: {
+            color: ((_mergedTheme$token4 = mergedTheme.token) === null || _mergedTheme$token4 === void 0 ? void 0 : _mergedTheme$token4.colorIcon) || ((_mergedTheme$token5 = mergedTheme.token) === null || _mergedTheme$token5 === void 0 ? void 0 : _mergedTheme$token5.colorTextSecondary)
+          }
         });
       }
     }, parentContext.collapse, collapse),
@@ -85,7 +89,27 @@ var ConfigProvider = function ConfigProvider(_ref3) {
       requiredMark: 'optional'
     }, parentContext.form, form),
     spin: merge({}, parentContext.spin, spin),
-    table: merge({}, parentContext.table, table),
+    table: merge({}, {
+      expandable: {
+        expandIcon: function expandIcon(_ref5) {
+          var _mergedTheme$token6, _mergedTheme$token7;
+          var expandable = _ref5.expandable,
+            expanded = _ref5.expanded,
+            onExpand = _ref5.onExpand,
+            record = _ref5.record;
+          return expandable && /*#__PURE__*/_jsx(CaretRightOutlined, {
+            onClick: function onClick(e) {
+              return onExpand(record, e);
+            },
+            style: {
+              transition: "transform 0.2s",
+              transform: expanded ? 'rotate(90deg)' : undefined,
+              color: ((_mergedTheme$token6 = mergedTheme.token) === null || _mergedTheme$token6 === void 0 ? void 0 : _mergedTheme$token6.colorIcon) || ((_mergedTheme$token7 = mergedTheme.token) === null || _mergedTheme$token7 === void 0 ? void 0 : _mergedTheme$token7.colorTextSecondary)
+            }
+          });
+        }
+      }
+    }, parentContext.table, table),
     tabs: merge({}, parentContext.tabs, tabs),
     theme: merge({}, mergedTheme, {
       token: _objectSpread(_objectSpread(_objectSpread({}, getLocaleTokenValue(mergedLocale, 'fontFamily', fontFamily, fontFamilyEn)), getLocaleTokenValue(mergedLocale, 'fontWeight', fontWeight, fontWeightEn)), getLocaleTokenValue(mergedLocale, 'fontWeightStrong', fontWeightStrong, fontWeightStrongEn))

package/es/descriptions/hooks/useItems.d.ts

@@ -5,17 +5,17 @@ export default function useItems(items?: DescriptionsItemType[], children?: Reac
     key?: React.Key;
     label?: React.ReactNode;
     span?: number | "filled" | {
-        xs?: number;
-        sm?: number;
-        md?: number;
-        lg?: number;
-        xl?: number;
         xxl?: number;
+        xl?: number;
+        lg?: number;
+        md?: number;
+        sm?: number;
+        xs?: number;
     };
     style?: React.CSSProperties;
+    className?: string;
     classNames?: Partial<Record<"label" | "content", string>>;
     styles?: Partial<Record<"label" | "content", React.CSSProperties>>;
-    className?: string;
     labelStyle?: React.CSSProperties;
     contentStyle?: React.CSSProperties;
 }[];

package/es/descriptions/style/index.js

@@ -32,7 +32,8 @@ export var genVerticalStyle = function genVerticalStyle(size, token) {
 };
 export var genDescriptionsStyle = function genDescriptionsStyle(token) {
   var componentCls = token.componentCls,
-    typographyComponentCls = token.typographyComponentCls;
+    typographyComponentCls = token.typographyComponentCls,
+    calc = token.calc;
   return _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls), _objectSpread(_objectSpread({}, genVerticalStyle('default', token)), {}, _defineProperty(_defineProperty({}, "".concat(componentCls, "-item-container"), _defineProperty({}, "".concat(componentCls, "-item-content"), _defineProperty({
     paddingRight: 12
   }, "".concat(typographyComponentCls, "-edit-content"), {
@@ -41,7 +42,7 @@ export var genDescriptionsStyle = function genDescriptionsStyle(token) {
     marginBottom: 0
   }))), "".concat(componentCls, "-item-container:has(", "".concat(typographyComponentCls, "-edit-content"), ")"), {
     alignItems: 'center',
-    height: token.fontSize * token.lineHeight
+    height: calc(token.fontSize).mul(token.lineHeight).equal()
   }))), "".concat(componentCls).concat(componentCls, "-middle"), genVerticalStyle('middle', token)), "".concat(componentCls).concat(componentCls, "-small"), genVerticalStyle('small', token));
 };
 export default (function (prefixCls, typographyPrefixCls) {

package/es/drawer/style/index.js

@@ -2,20 +2,38 @@ 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 genDrawerStyle = function genDrawerStyle(token) {
   var componentCls = token.componentCls,
-    antCls = token.antCls;
-  var contentPadding = "".concat(token.paddingXS, "px ").concat(token.paddingLG, "px ").concat(token.paddingLG, "px ").concat(token.paddingLG, "px");
+    antCls = token.antCls,
+    fontSizeHeading3 = token.fontSizeHeading3,
+    colorSplit = token.colorSplit,
+    calc = token.calc;
+  var contentPadding = token.paddingLG;
   var boxShadowBottom = '0 2px 4px 0 rgba(54,69,99,0.04), 0 1px 6px -1px rgba(54,69,99,0.04), 0 1px 2px 0 rgba(54,69,99,0.06)';
   var boxShadowTop = '0 -2px 4px 0 rgba(54,69,99,0.04), 0 -1px 6px -1px rgba(54,69,99,0.04), 0 -1px 2px 0 rgba(54,69,99,0.06)';
-  return _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls), _defineProperty({}, "".concat(componentCls, "-content"), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls, "-header"), {
-    padding: "".concat(token.padding, "px ").concat(token.paddingLG, "px"),
+  return _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls), _defineProperty({}, "".concat(componentCls, "-content"), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls, "-header"), _defineProperty(_defineProperty({
+    position: 'relative',
+    padding: "".concat(unit(token.padding), " ").concat(unit(token.paddingLG)),
     borderBottom: 'none',
     transition: "box-shadow ".concat(token.motionDurationMid),
     // ensure header box-shadow cover body content
     zIndex: 10
-  }), "".concat(componentCls, "-header-shadow"), {
+  }, "".concat(componentCls, "-title"), {
+    fontSize: fontSizeHeading3
+  }), '&::after', {
+    content: '""',
+    position: 'absolute',
+    bottom: 0,
+    left: 0,
+    right: 0,
+    height: '1px',
+    backgroundColor: colorSplit,
+    // 使用负margin让分割线贯通到content边缘
+    marginLeft: calc(token.paddingLG).mul(-1).equal(),
+    marginRight: calc(token.paddingLG).mul(-1).equal()
+  })), "".concat(componentCls, "-header-shadow"), {
     boxShadow: boxShadowBottom
   }), "".concat(componentCls, "-body"), {
     padding: 0,
@@ -26,7 +44,7 @@ export var genDrawerStyle = function genDrawerStyle(token) {
     overflow: 'auto'
   }), "".concat(componentCls, "-footer-container"), _defineProperty({
     position: 'sticky',
-    padding: "".concat(token.padding, "px ").concat(token.paddingLG, "px"),
+    padding: "".concat(unit(token.padding), " ").concat(unit(token.paddingLG)),
     transition: "box-shadow ".concat(token.motionDurationMid),
     // ensure footer box-shadow cover body content
     zIndex: 10
@@ -35,12 +53,14 @@ export var genDrawerStyle = function genDrawerStyle(token) {
     display: 'flex',
     justifyContent: 'space-between',
     alignItems: 'center'
-  })), "".concat(componentCls, "-footer-container-shadow"), {
+  })), "".concat(componentCls, "-footer-container-no-padding-top"), {
+    paddingTop: 0
+  }), "".concat(componentCls, "-footer-container-shadow"), {
     boxShadow: boxShadowTop
   }))), "".concat(componentCls).concat(componentCls, "-loading"), _defineProperty({}, "".concat(componentCls, "-body > ").concat(antCls, "-skeleton"), {
     padding: contentPadding
   })), "".concat(componentCls).concat(componentCls, "-with-footer"), _defineProperty({}, "".concat(componentCls, "-content"), _defineProperty({}, "".concat(componentCls, "-body-content"), {
-    padding: "".concat(token.paddingXS, "px ").concat(token.paddingLG, "px")
+    paddingBottom: token.paddingXS
   })));
 };
 export default (function (prefixCls) {

package/es/empty/style/index.js

@@ -2,13 +2,15 @@ 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 genEmptyStyle = function genEmptyStyle(token) {
   var antCls = token.antCls,
     componentCls = token.componentCls,
     colorTextTertiary = token.colorTextTertiary,
     colorText = token.colorText,
-    colorTextSecondary = token.colorTextSecondary;
+    colorTextSecondary = token.colorTextSecondary,
+    calc = token.calc;
   return _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls), _defineProperty(_defineProperty({}, "".concat(componentCls, "-image"), {
     height: 160,
     marginBottom: 0
@@ -36,7 +38,7 @@ export var genEmptyStyle = function genEmptyStyle(token) {
   }, "".concat(antCls, "-steps-item-container"), _defineProperty(_defineProperty({}, "".concat(antCls, "-steps-item-icon"), _defineProperty({
     height: token.controlHeightSM,
     width: token.controlHeightSM,
-    lineHeight: "".concat(token.controlHeightSM, "px"),
+    lineHeight: unit(token.controlHeightSM),
     backgroundColor: token.colorFillSecondary,
     // override default border color
     borderColor: token.colorFillSecondary
@@ -47,9 +49,9 @@ export var genEmptyStyle = function genEmptyStyle(token) {
     color: colorText,
     fontSize: token.fontSize,
     fontWeight: token.fontWeightStrong,
-    lineHeight: "".concat(token.controlHeightSM, "px"),
+    lineHeight: unit(token.controlHeightSM),
     '&::after': {
-      top: token.controlHeightSM / 2
+      top: calc(token.controlHeightSM).div(2).equal()
     }
   }), "".concat(antCls, "-steps-item-description"), {
     color: colorTextTertiary,

package/es/form/FormItem.d.ts

@@ -17,6 +17,7 @@ export type LabelTooltipType = WrapperTooltipProps | React.ReactNode;
 export interface FormItemProps extends AntFormItemProps {
     tooltip?: WrapperTooltipProps | ReactNode;
     action?: ReactNode;
+    description?: ReactNode;
 }
 type CompoundedComponent = React.FC<FormItemProps> & {
     useStatus: typeof AntFormItem.useStatus;

package/es/form/FormItem.js

@@ -1,11 +1,11 @@
-var _excluded = ["children", "label", "tooltip", "action", "layout", "prefixCls", "className"],
+var _excluded = ["children", "label", "tooltip", "action", "description", "layout", "prefixCls", "className"],
   _excluded2 = ["icon", "type", "overlayInnerStyle"];
 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 _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); }
 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); }
-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); }
 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 React, { useContext } from 'react';
@@ -27,6 +27,7 @@ var FormItem = function FormItem(_ref) {
     label = _ref.label,
     tooltip = _ref.tooltip,
     action = _ref.action,
+    description = _ref.description,
     externalLayout = _ref.layout,
     customizePrefixCls = _ref.prefixCls,
     className = _ref.className,
@@ -36,7 +37,7 @@ var FormItem = function FormItem(_ref) {
   var prefixCls = getPrefixCls('form', customizePrefixCls);
   var _useStyle = useStyle(prefixCls),
     wrapSSR = _useStyle.wrapSSR;
-  var formItemCls = classNames(className);
+  var formItemCls = classNames(className, _defineProperty({}, "".concat(prefixCls, "-item-has-description"), !!description));
   var _useContext2 = useContext(FormContext),
     contextLayout = _useContext2.layout,
     vertical = _useContext2.vertical;
@@ -59,6 +60,13 @@ var FormItem = function FormItem(_ref) {
       }, overlayInnerStyle)
     }, restTooltipProps);
   }
+
+  // description config - only show in vertical layout
+  var isVertical = layout === 'vertical' || vertical;
+  var descriptionContent = description && isVertical ? /*#__PURE__*/_jsx("div", {
+    className: "".concat(prefixCls, "-item-description"),
+    children: description
+  }) : null;
   return wrapSSR( /*#__PURE__*/_jsx(AntFormItem, _objectSpread(_objectSpread({
     layout: layout,
     label: action && (layout === 'vertical' || vertical) ? /*#__PURE__*/_jsxs(_Fragment, {
@@ -75,7 +83,9 @@ var FormItem = function FormItem(_ref) {
     prefixCls: customizePrefixCls,
     className: formItemCls
   }, restProps), {}, {
-    children: children
+    children: /*#__PURE__*/_jsxs(_Fragment, {
+      children: [descriptionContent, children]
+    })
   })));
 };
 FormItem.useStatus = AntFormItem.useStatus;

package/es/form/style/index.js

@@ -4,13 +4,25 @@ function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol"
 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 { genComponentStyleHook } from "../../_util/genComponentStyleHook";
 export var genFormStyle = function genFormStyle(token) {
-  var componentCls = token.componentCls;
-  return _defineProperty({}, "".concat(componentCls).concat(componentCls, "-vertical"), _defineProperty({}, "".concat(componentCls, "-item:not(").concat(componentCls, "-item-horizontal)"), _defineProperty({}, "".concat(componentCls, "-item-label > label"), _defineProperty({
+  var componentCls = token.componentCls,
+    calc = token.calc;
+  return _defineProperty(_defineProperty({}, componentCls, _defineProperty({}, "".concat(componentCls, "-item-extra"), {
+    paddingTop: token.paddingXXS,
+    fontSize: token.fontSizeSM
+  })), "".concat(componentCls).concat(componentCls, "-vertical"), _defineProperty(_defineProperty({}, "".concat(componentCls, "-item:not(").concat(componentCls, "-item-horizontal)"), _defineProperty({}, "".concat(componentCls, "-item-label > label"), _defineProperty({
     width: '100%'
   }, "".concat(componentCls, "-item-action"), {
     position: 'absolute',
     right: 0
-  }))));
+  }))), "".concat(componentCls, "-item-has-description"), _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls, "-item-control-input"), {
+    minHeight: 'auto'
+  }), "".concat(componentCls, "-item-label"), {
+    paddingBottom: token.paddingXXS
+  }), "".concat(componentCls, "-item-description"), {
+    paddingBottom: calc(token.paddingXXS).add(2).equal(),
+    fontSize: token.fontSizeSM,
+    color: token.colorTextDescription
+  })));
 };
 export default (function (prefixCls) {
   var useStyle = genComponentStyleHook('Form', function (token) {

package/es/input-number/index.d.ts

@@ -8,7 +8,8 @@ export interface InputNumberLocale {
 export interface InputNumberProps extends AntInputNumberProps {
     locale?: InputNumberLocale;
 }
-type CompoundedComponent = React.ForwardRefExoticComponent<InputNumberProps & React.RefAttributes<HTMLInputElement>> & {
+type InputNumberRef = React.ComponentRef<typeof AntInputNumber>;
+type CompoundedComponent = React.ForwardRefExoticComponent<InputNumberProps & React.RefAttributes<InputNumberRef>> & {
     _InternalPanelDoNotUseOrYouWillBeFired: typeof AntInputNumber._InternalPanelDoNotUseOrYouWillBeFired;
 };
 declare const InputNumber: CompoundedComponent;

package/es/locale/ja-JP.d.ts

@@ -0,0 +1,3 @@
+import type { Locale } from '.';
+declare const _default: Locale;
+export default _default;

package/es/locale/ja-JP.js

@@ -0,0 +1,28 @@
+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); }
+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; }
+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 jaJP from 'antd/es/locale/ja_JP';
+export default _objectSpread(_objectSpread({}, jaJP), {}, {
+  global: _objectSpread(_objectSpread({}, jaJP.global), {}, {
+    inputPlaceholder: '入力してください'
+  }),
+  Pagination: _objectSpread(_objectSpread({}, jaJP.Pagination), {}, {
+    total: '合計 ${total} 件'
+  }),
+  Drawer: {
+    okText: '確定',
+    cancelText: 'キャンセル'
+  },
+  Table: _objectSpread(_objectSpread({}, jaJP.Table), {}, {
+    batchOperationBar: {
+      selected: '選択済み',
+      object: '件',
+      cancel: 'キャンセル',
+      collapse: '折りたたむ',
+      open: '展開'
+    }
+  })
+});

package/es/modal/Modal.js

@@ -8,6 +8,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 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 { Modal as AntModal } from 'antd';
+import { ExclamationCircleOutlined, CloseCircleOutlined, CheckCircleOutlined, InfoCircleOutlined } from '@oceanbase/icons';
 import classNames from 'classnames';
 import React, { useContext } from 'react';
 import ConfigProvider from "../config-provider";
@@ -52,22 +53,35 @@ var Modal = function Modal(_ref) {
 // 替换 Modal 上的静态方法，支持消费 ConfigProvider 配置
 // 注意: 不能使用 Modal.info = modal.info 进行属性赋值，需要新建函数赋值，否则仍然无法消费 ConfigProvider 配置
 Modal.info = function (props) {
-  return modal.info(props);
+  return modal.info(_objectSpread({
+    // use outlined icon
+    icon: /*#__PURE__*/_jsx(InfoCircleOutlined, {})
+  }, props));
 };
 Modal.success = function (props) {
-  return modal.success(props);
+  return modal.success(_objectSpread({
+    icon: /*#__PURE__*/_jsx(CheckCircleOutlined, {})
+  }, props));
 };
 Modal.error = function (props) {
-  return modal.error(props);
+  return modal.error(_objectSpread({
+    icon: /*#__PURE__*/_jsx(CloseCircleOutlined, {})
+  }, props));
 };
 Modal.warning = function (props) {
-  return modal.warning(props);
+  return modal.warning(_objectSpread({
+    icon: /*#__PURE__*/_jsx(ExclamationCircleOutlined, {})
+  }, props));
 };
 Modal.warn = function (props) {
-  return modal.warning(props);
+  return modal.warning(_objectSpread({
+    icon: /*#__PURE__*/_jsx(ExclamationCircleOutlined, {})
+  }, props));
 };
 Modal.confirm = function (props) {
-  return modal.confirm(props);
+  return modal.confirm(_objectSpread({
+    icon: /*#__PURE__*/_jsx(ExclamationCircleOutlined, {})
+  }, props));
 };
 Modal.useModal = AntModal.useModal;
 Modal.destroyAll = AntModal.destroyAll;

package/es/modal/style/index.js

@@ -6,21 +6,49 @@ import { genComponentStyleHook } from "../../_util/genComponentStyleHook";
 export var genModalStyle = function genModalStyle(token) {
   var antCls = token.antCls,
     componentCls = token.componentCls,
-    marginXXS = token.marginXXS,
     marginLG = token.marginLG,
-    paddingMD = token.paddingMD,
-    borderRadius = token.borderRadius,
-    controlHeight = token.controlHeight,
     fontSizeHeading5 = token.fontSizeHeading5,
-    lineHeightHeading5 = token.lineHeightHeading5;
+    lineHeightHeading5 = token.lineHeightHeading5,
+    fontSizeHeading3 = token.fontSizeHeading3,
+    colorSplit = token.colorSplit,
+    calc = token.calc;
   var top = 100;
   var bottom = 100;
-  var titleHeight = fontSizeHeading5 * lineHeightHeading5;
-  return _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls, ":not(").concat(componentCls, "-confirm)"), _defineProperty(_defineProperty({}, "".concat(componentCls, "-header"), {
-    marginBottom: marginLG
-  }), "".concat(componentCls, "-footer"), _defineProperty({
-    marginTop: marginLG
-  }, "".concat(componentCls, "-footer-content"), _defineProperty({
+  var titleHeight = calc(fontSizeHeading5).mul(lineHeightHeading5).equal();
+  return _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls, ":not(").concat(componentCls, "-confirm):not(").concat(componentCls, "-progress)"), _defineProperty(_defineProperty({}, "".concat(componentCls, "-content"), _defineProperty(_defineProperty(_defineProperty({
+    paddingBlock: token.padding
+  }, "".concat(componentCls, "-close"), {
+    marginTop: token.marginXXS,
+    marginRight: token.marginXXS
+  }), "".concat(componentCls, "-header"), _defineProperty(_defineProperty({
+    position: 'relative',
+    marginBottom: 0,
+    paddingBottom: token.padding
+  }, "".concat(componentCls, "-title"), {
+    fontSize: fontSizeHeading3
+  }), '&::after', {
+    content: '""',
+    position: 'absolute',
+    bottom: 0,
+    left: 0,
+    right: 0,
+    height: '1px',
+    backgroundColor: colorSplit,
+    // antd Modal content默认padding通常是24px，使用负margin让分割线贯通
+    // 如果antd使用其他padding值，可能需要调整
+    marginLeft: calc(token.paddingLG).mul(-1).equal(),
+    marginRight: calc(token.paddingLG).mul(-1).equal()
+  })), "".concat(componentCls, "-body"), {
+    paddingTop: token.paddingLG,
+    marginInline: calc(token.marginLG).mul(-1).equal(),
+    paddingInline: token.paddingLG
+  })), "".concat(componentCls, "-footer"), _defineProperty(_defineProperty({
+    paddingTop: token.paddingLG,
+    marginTop: 0
+  }, "".concat(antCls, "-btn"), {
+    height: 28,
+    minHeight: 28
+  }), "".concat(componentCls, "-footer-content"), _defineProperty({
     display: 'flex',
     justifyContent: 'space-between',
     alignItems: 'center'
@@ -28,13 +56,16 @@ export var genModalStyle = function genModalStyle(token) {
     marginInlineEnd: token.margin,
     // make extra align to start
     textAlign: 'start'
-  })))), "".concat(componentCls).concat(componentCls, "-progress"), _defineProperty({}, "".concat(componentCls, "-content"), _defineProperty(_defineProperty(_defineProperty({
-    padding: "".concat(token.paddingXL + token.padding, "px ").concat(token.paddingLG + token.padding, "px")
-  }, "".concat(componentCls, "-header"), _defineProperty({
+  })))), "".concat(componentCls).concat(componentCls, "-progress"), _defineProperty({}, "".concat(componentCls, "-content"), _defineProperty(_defineProperty(_defineProperty(_defineProperty({
+    padding: token.paddingLG
+  }, "".concat(componentCls, "-close"), {
+    marginTop: token.marginSM,
+    marginRight: token.marginXXS
+  }), "".concat(componentCls, "-header"), _defineProperty({
     textAlign: 'center',
     marginBottom: token.marginXXL
   }, "".concat(componentCls, "-title"), {
-    fontSize: token.fontSizeHeading4
+    fontSize: fontSizeHeading3
   })), "".concat(componentCls, "-body"), _defineProperty(_defineProperty(_defineProperty({
     textAlign: 'center'
   }, "".concat(componentCls, "-progress-loading"), {
@@ -45,14 +76,27 @@ export var genModalStyle = function genModalStyle(token) {
     color: token.colorTextTertiary
   }), "".concat(antCls, "-alert"), {
     textAlign: 'left'
-  })), "".concat(componentCls, "-footer"), {
+  })), "".concat(componentCls, "-footer"), _defineProperty({
     textAlign: 'center'
-  }))), "".concat(componentCls, "-confirm"), _defineProperty(_defineProperty({}, "".concat(componentCls, "-body ").concat(componentCls, "-confirm-title +").concat(componentCls, "-confirm-content"), {
-    marginBlockStart: marginXXS,
+  }, "".concat(antCls, "-btn"), {
+    height: 28,
+    minHeight: 28
+  })))), "".concat(componentCls, "-confirm"), _defineProperty(_defineProperty({}, "".concat(componentCls, "-content"), {
+    padding: token.paddingLG
+  }), "".concat(componentCls, "-body"), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls, "-confirm-title"), {
+    fontSize: fontSizeHeading3
+  }), "".concat(componentCls, "-confirm-body > ").concat(token.iconCls), {
+    height: calc(token.fontSizeHeading3).mul(token.lineHeight).equal()
+  }), "".concat(componentCls, "-confirm-paragraph"), {
+    rowGap: token.marginSM
+  }), "".concat(componentCls, "-confirm-content"), {
     color: token.colorTextSecondary
-  }), "".concat(componentCls, "-confirm-btns"), {
+  }), "".concat(componentCls, "-confirm-btns"), _defineProperty({
     marginTop: marginLG
-  }));
+  }, "".concat(antCls, "-btn"), {
+    height: 28,
+    minHeight: 28
+  }))));
 };
 export default (function (prefixCls) {
   var useStyle = genComponentStyleHook('Modal', function (token) {

package/es/radio/style/index.js

@@ -8,11 +8,13 @@ export var genRadioStyle = function genRadioStyle(token) {
     radioSize = token.radioSize,
     fontSize = token.fontSize,
     fontSizeLG = token.fontSizeLG,
-    lineHeight = token.lineHeight;
+    lineHeight = token.lineHeight,
+    calc = token.calc;
+  var marginBottom = calc(calc(fontSize).mul(lineHeight).equal()).sub(radioSize || fontSizeLG).div(-2).equal();
   return _defineProperty({}, "".concat(componentCls, "-wrapper"), _defineProperty({}, "".concat(componentCls), _defineProperty({
     alignSelf: 'baseline'
   }, "".concat(componentCls, "-inner"), {
-    marginBottom: -(fontSize * lineHeight - (radioSize || fontSizeLG)) / 2
+    marginBottom: marginBottom
   })));
 };
 export default (function (prefixCls) {

package/es/slider/style/index.js

@@ -2,7 +2,6 @@ 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 { toNumber } from 'lodash';
 import { genComponentStyleHook } from "../../_util/genComponentStyleHook";
 export var genSliderStyle = function genSliderStyle(token) {
   var componentCls = token.componentCls,
@@ -11,13 +10,16 @@ export var genSliderStyle = function genSliderStyle(token) {
     _token$handleSize = token.handleSize,
     handleSize = _token$handleSize === void 0 ? 10 : _token$handleSize,
     _token$handleLineWidt = token.handleLineWidth,
-    handleLineWidth = _token$handleLineWidt === void 0 ? 2 : _token$handleLineWidt;
+    handleLineWidth = _token$handleLineWidt === void 0 ? 2 : _token$handleLineWidt,
+    calc = token.calc;
+  var dotSizeHalf = calc(dotSize).div(2).equal();
+  var handleOffset = calc(handleSize).add(calc(handleLineWidth).mul(2).equal()).div(2).equal();
   return _defineProperty({}, "".concat(componentCls).concat(componentCls, "-horizontal"), _defineProperty({}, "".concat(componentCls, "-mark"), _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls, "-mark-text[style*=\"left: 0%;\"]"), {
-    transform: "translateX(calc(0% - ".concat(dotSize / 2, "px)) !important")
+    transform: "translateX(calc(0% - ".concat(dotSizeHalf, ")) !important")
   }), "".concat(componentCls, "-mark-text[style*=\"left: 100%;\"]"), {
-    transform: "translateX(calc(-100% + ".concat(dotSize / 2, "px)) !important")
+    transform: "translateX(calc(-100% + ".concat(dotSizeHalf, ")) !important")
   }), "".concat(componentCls, "-mark-text[style=\"transform: translateX(-50%);\"]"), {
-    transform: "translateX(calc(0% - ".concat((handleSize + toNumber(handleLineWidth) * 2) / 2, "px)) !important")
+    transform: "translateX(calc(0% - ".concat(handleOffset, ")) !important")
   })));
 };
 export default (function (prefixCls) {

package/es/spin/style/index.js

@@ -7,9 +7,10 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 import { genComponentStyleHook } from "../../_util/genComponentStyleHook";
 var genSizeStyle = function genSizeStyle(spinDotSize, token) {
   var componentCls = token.componentCls,
-    colorText = token.colorText;
+    colorText = token.colorText,
+    calc = token.calc;
   var spinDotWidth = spinDotSize;
-  var spinDotHight = spinDotWidth * (295 / 397);
+  var spinDotHight = calc(spinDotWidth).mul(295).div(397).equal();
   return _defineProperty({}, "&".concat(componentCls, "-oceanbase"), _defineProperty(_defineProperty({}, "".concat(componentCls, "-dot"), {
     width: spinDotWidth,
     height: spinDotHight
@@ -20,22 +21,23 @@ var genSizeStyle = function genSizeStyle(spinDotSize, token) {
 };
 var genNestedSizeStyle = function genNestedSizeStyle(spinDotSize, token) {
   var componentCls = token.componentCls,
-    fontSize = token.fontSize;
+    fontSize = token.fontSize,
+    calc = token.calc;
   var spinDotWidth = spinDotSize;
   // oceanbase indicator is rectangle instead of square, should calculate actual height by ratio
   // width: 295px
   // height: 397px
-  var spinDotHight = spinDotWidth * (295 / 397);
-  var dotMarginLeft = -spinDotWidth / 2;
-  var dotMarginTop = -spinDotHight / 2;
-  var textPaddingTop = (spinDotHight - fontSize) / 2 + 2;
+  var spinDotHight = calc(spinDotWidth).mul(295).div(397).equal();
+  var dotMarginLeft = calc(spinDotWidth).div(-2).equal();
+  var dotMarginTop = calc(spinDotHight).div(-2).equal();
+  var textPaddingTop = calc(spinDotHight).sub(fontSize).div(2).add(2).equal();
   return _defineProperty({}, "&".concat(componentCls, "-oceanbase, & > ").concat(componentCls, "-oceanbase"), _defineProperty(_defineProperty(_defineProperty({}, "".concat(componentCls, "-dot"), {
     marginLeft: dotMarginLeft,
     marginTop: dotMarginTop
   }), "".concat(componentCls, "-text"), {
     paddingTop: textPaddingTop
   }), "&".concat(componentCls, "-show-text ").concat(componentCls, "-dot"), {
-    marginTop: dotMarginTop - 10
+    marginTop: calc(dotMarginTop).sub(10).equal()
   }));
 };
 export var genSpinStyle = function genSpinStyle(token) {
@@ -50,16 +52,17 @@ export default (function (prefixCls) {
     // should expand by 2x for oceanbase indicator
     // because it's inner padding is smaller than antd default indicator
     // const ratio = 3;
+    var calc = token.calc;
     return [genSpinStyle(_objectSpread(_objectSpread({}, token), {}, {
       // https://github.com/ant-design/ant-design/blob/master/components/spin/style/index.tsx#L238
       // spinDotSize: (token.controlHeightLG / 2) * ratio,
       // spinDotSizeSM: token.controlHeightLG * 0.35 * ratio,
       // spinDotSizeLG: token.controlHeight * ratio,
-      spinDotSize: token.controlHeight * 1.75,
+      spinDotSize: calc(token.controlHeight).mul(1.75).equal(),
       // 56,
-      spinDotSizeSM: token.controlHeight * 1.125,
+      spinDotSizeSM: calc(token.controlHeight).mul(1.125).equal(),
       // 36
-      spinDotSizeLG: token.controlHeight * 2.25 // 72
+      spinDotSizeLG: calc(token.controlHeight).mul(2.25).equal() // 72
     }))];
   });
   return useStyle(prefixCls);