@chaoswise/ui 3.0.23 → 3.1.1

package/lib/Antd5/avatar/group.js

@@ -1,4 +1,6 @@
 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(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : 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); }
@@ -13,6 +15,7 @@ import * as React from 'react';
 import classNames from 'classnames';
 import toArray from 'rc-util/lib/Children/toArray';
 import { cloneElement } from '../_util/reactNode';
+import { devUseWarning } from '../_util/warning';
 import { ConfigContext } from '../config-provider';
 import useCSSVarCls from '../config-provider/hooks/useCSSVarCls';
 import Popover from '../popover';
@@ -46,11 +49,17 @@ var Group = function Group(props) {
     maxStyle = props.maxStyle,
     size = props.size,
     shape = props.shape,
-    _props$maxPopoverPlac = props.maxPopoverPlacement,
-    maxPopoverPlacement = _props$maxPopoverPlac === void 0 ? 'top' : _props$maxPopoverPlac,
-    _props$maxPopoverTrig = props.maxPopoverTrigger,
-    maxPopoverTrigger = _props$maxPopoverTrig === void 0 ? 'hover' : _props$maxPopoverTrig,
-    children = props.children;
+    maxPopoverPlacement = props.maxPopoverPlacement,
+    maxPopoverTrigger = props.maxPopoverTrigger,
+    children = props.children,
+    max = props.max;
+  if (process.env.NODE_ENV !== 'production') {
+    var warning = devUseWarning('Avatar.Group');
+    warning.deprecated(!maxCount, 'maxCount', 'max={{ count: number }}');
+    warning.deprecated(!maxStyle, 'maxStyle', 'max={{ style: CSSProperties }}');
+    warning.deprecated(!maxPopoverPlacement, 'maxPopoverPlacement', 'max={{ popover: PopoverProps }}');
+    warning.deprecated(!maxPopoverTrigger, 'maxPopoverTrigger', 'max={{ popover: PopoverProps }}');
+  }
   var prefixCls = getPrefixCls('avatar', customizePrefixCls);
   var groupPrefixCls = "".concat(prefixCls, "-group");
   var rootCls = useCSSVarCls(prefixCls);
@@ -65,21 +74,30 @@ var Group = function Group(props) {
       key: "avatar-key-".concat(index)
     });
   });
+  var mergeCount = (max === null || max === void 0 ? void 0 : max.count) || maxCount;
   var numOfChildren = childrenWithProps.length;
-  if (maxCount && maxCount < numOfChildren) {
-    var childrenShow = childrenWithProps.slice(0, maxCount);
-    var childrenHidden = childrenWithProps.slice(maxCount, numOfChildren);
-    childrenShow.push(_jsx(Popover, {
-      content: childrenHidden,
-      trigger: maxPopoverTrigger,
-      placement: maxPopoverPlacement,
-      overlayClassName: "".concat(groupPrefixCls, "-popover"),
-      destroyTooltipOnHide: true,
+  if (mergeCount && mergeCount < numOfChildren) {
+    var _max$popover, _max$popover2, _max$popover3;
+    var childrenShow = childrenWithProps.slice(0, mergeCount);
+    var childrenHidden = childrenWithProps.slice(mergeCount, numOfChildren);
+    var mergeStyle = (max === null || max === void 0 ? void 0 : max.style) || maxStyle;
+    var mergePopoverTrigger = (max === null || max === void 0 || (_max$popover = max.popover) === null || _max$popover === void 0 ? void 0 : _max$popover.trigger) || maxPopoverTrigger || 'hover';
+    var mergePopoverPlacement = (max === null || max === void 0 || (_max$popover2 = max.popover) === null || _max$popover2 === void 0 ? void 0 : _max$popover2.placement) || maxPopoverPlacement || 'top';
+    var mergeProps = _objectSpread(_objectSpread({
+      content: childrenHidden
+    }, max === null || max === void 0 ? void 0 : max.popover), {}, {
+      overlayClassName: classNames("".concat(groupPrefixCls, "-popover"), max === null || max === void 0 || (_max$popover3 = max.popover) === null || _max$popover3 === void 0 ? void 0 : _max$popover3.overlayClassName),
+      placement: mergePopoverPlacement,
+      trigger: mergePopoverTrigger
+    });
+    childrenShow.push(_jsx(Popover, _objectSpread(_objectSpread({
+      destroyTooltipOnHide: true
+    }, mergeProps), {}, {
       children: _jsx(Avatar, {
-        style: maxStyle,
-        children: "+".concat(numOfChildren - maxCount)
+        style: mergeStyle,
+        children: "+".concat(numOfChildren - mergeCount)
       })
-    }, "avatar-popover-key"));
+    }), "avatar-popover-key"));
     return wrapCSSVar(_jsx(AvatarContextProvider, {
       shape: shape,
       size: size,

package/lib/Antd5/avatar/style/index.js

@@ -38,7 +38,7 @@ var genBaseStyle = function genBaseStyle(token) {
       margin: 0
     }));
   };
-  return _defineProperty({}, componentCls, _objectSpread(_objectSpread(_objectSpread({}, resetComponent(token)), {}, _defineProperty(_defineProperty({
+  return _defineProperty({}, componentCls, _objectSpread(_objectSpread(_objectSpread({}, resetComponent(token)), {}, _defineProperty({
     position: 'relative',
     display: 'inline-flex',
     justifyContent: 'center',
@@ -49,17 +49,22 @@ var genBaseStyle = function genBaseStyle(token) {
     textAlign: 'center',
     verticalAlign: 'middle',
     background: avatarBg,
-    border: "".concat(unit(lineWidth), " ").concat(lineType, " transparent")
-  }, "&-image", {
-    background: 'transparent'
-  }), "".concat(antCls, "-image-img"), {
+    border: "".concat(unit(lineWidth), " ").concat(lineType, " transparent"),
+    '&-image': {
+      background: 'transparent'
+    }
+  }, "".concat(antCls, "-image-img"), {
     display: 'block'
-  }), avatarSizeStyle(containerSize, textFontSize, borderRadius)), {}, _defineProperty(_defineProperty(_defineProperty({}, "&-lg", _objectSpread({}, avatarSizeStyle(containerSizeLG, textFontSizeLG, borderRadiusLG))), "&-sm", _objectSpread({}, avatarSizeStyle(containerSizeSM, textFontSizeSM, borderRadiusSM))), '> img', {
-    display: 'block',
-    width: '100%',
-    height: '100%',
-    objectFit: 'cover'
-  })));
+  }), avatarSizeStyle(containerSize, textFontSize, borderRadius)), {}, {
+    '&-lg': _objectSpread({}, avatarSizeStyle(containerSizeLG, textFontSizeLG, borderRadiusLG)),
+    '&-sm': _objectSpread({}, avatarSizeStyle(containerSizeSM, textFontSizeSM, borderRadiusSM)),
+    '> img': {
+      display: 'block',
+      width: '100%',
+      height: '100%',
+      objectFit: 'cover'
+    }
+  }));
 };
 var genGroupStyle = function genGroupStyle(token) {
   var componentCls = token.componentCls,
@@ -68,9 +73,9 @@ var genGroupStyle = function genGroupStyle(token) {
     groupSpace = token.groupSpace;
   return _defineProperty(_defineProperty({}, "".concat(componentCls, "-group"), _defineProperty(_defineProperty({
     display: 'inline-flex'
-  }, "".concat(componentCls), {
+  }, componentCls, {
     borderColor: groupBorderColor
-  }), "> *:not(:first-child)", {
+  }), '> *:not(:first-child)', {
     marginInlineStart: groupOverlapping
   })), "".concat(componentCls, "-group-popover"), _defineProperty({}, "".concat(componentCls, " + ").concat(componentCls), {
     marginInlineStart: groupSpace

package/lib/Antd5/back-top/index.js

@@ -39,10 +39,11 @@ var BackTop = function BackTop(props) {
     setVisible = _React$useState2[1];
   var ref = React.useRef(null);
   var getDefaultTarget = function getDefaultTarget() {
-    return ref.current && ref.current.ownerDocument ? ref.current.ownerDocument : window;
+    var _ref$current;
+    return ((_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.ownerDocument) || window;
   };
   var handleScroll = throttleByAnimationFrame(function (e) {
-    var scrollTop = getScroll(e.target, true);
+    var scrollTop = getScroll(e.target);
     setVisible(scrollTop >= visibilityHeight);
   });
   if (process.env.NODE_ENV !== 'production') {

package/lib/Antd5/badge/ScrollNumber.js

@@ -52,7 +52,7 @@ var ScrollNumber = /*#__PURE__*/React.forwardRef(function (props, ref) {
   // allow specify the border
   // mock border-color by box-shadow for compatible with old usage:
   // <Badge count={4} style={{ backgroundColor: '#fff', color: '#999', borderColor: '#d9d9d9' }} />
-  if (style && style.borderColor) {
+  if (style !== null && style !== void 0 && style.borderColor) {
     newProps.style = _objectSpread(_objectSpread({}, style), {}, {
       boxShadow: "0 0 0 1px ".concat(style.borderColor, " inset")
     });

package/lib/Antd5/badge/SingleNumber.js

@@ -14,12 +14,12 @@ import { createElement as _createElement } from "react";
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import classNames from 'classnames';
-function UnitNumber(_ref) {
-  var prefixCls = _ref.prefixCls,
-    value = _ref.value,
-    current = _ref.current,
-    _ref$offset = _ref.offset,
-    offset = _ref$offset === void 0 ? 0 : _ref$offset;
+var UnitNumber = function UnitNumber(props) {
+  var prefixCls = props.prefixCls,
+    value = props.value,
+    current = props.current,
+    _props$offset = props.offset,
+    offset = _props$offset === void 0 ? 0 : _props$offset;
   var style;
   if (offset) {
     style = {
@@ -35,7 +35,7 @@ function UnitNumber(_ref) {
     }),
     children: value
   });
-}
+};
 function getOffset(start, end, unit) {
   var index = start;
   var offset = 0;
@@ -45,7 +45,7 @@ function getOffset(start, end, unit) {
   }
   return offset;
 }
-export default function SingleNumber(props) {
+var SingleNumber = function SingleNumber(props) {
   var prefixCls = props.prefixCls,
     originCount = props.count,
     originValue = props.value;
@@ -66,11 +66,9 @@ export default function SingleNumber(props) {
   };
   // Fallback if transition events are not supported
   React.useEffect(function () {
-    var timeout = setTimeout(function () {
-      onTransitionEnd();
-    }, 1000);
+    var timer = setTimeout(onTransitionEnd, 1000);
     return function () {
-      clearTimeout(timeout);
+      return clearTimeout(timer);
     };
   }, [value]);
   // ============================= Render =============================
@@ -94,21 +92,23 @@ export default function SingleNumber(props) {
     for (var index = value; index <= end; index += 1) {
       unitNumberList.push(index);
     }
+    var unit = prevCount < count ? 1 : -1;
     // Fill with number unit nodes
     var prevIndex = unitNumberList.findIndex(function (n) {
       return n % 10 === prevValue;
     });
-    unitNodes = unitNumberList.map(function (n, index) {
+    // Cut list
+    var cutUnitNumberList = unit < 0 ? unitNumberList.slice(0, prevIndex + 1) : unitNumberList.slice(prevIndex);
+    unitNodes = cutUnitNumberList.map(function (n, index) {
       var singleUnit = n % 10;
       return /*#__PURE__*/_createElement(UnitNumber, _objectSpread(_objectSpread({}, props), {}, {
         key: n,
         value: singleUnit,
-        offset: index - prevIndex,
+        offset: unit < 0 ? index - prevIndex : index,
         current: index === prevIndex
       }));
     });
     // Calculate container offset value
-    var unit = prevCount < count ? 1 : -1;
     offsetStyle = {
       transform: "translateY(".concat(-getOffset(prevValue, value, unit), "00%)")
     };
@@ -119,4 +119,5 @@ export default function SingleNumber(props) {
     onTransitionEnd: onTransitionEnd,
     children: unitNodes
   });
-}
+};
+export default SingleNumber;

package/lib/Antd5/badge/style/index.js

@@ -67,7 +67,6 @@ var genSharedBadgeStyle = function genSharedBadgeStyle(token) {
     iconCls = token.iconCls,
     antCls = token.antCls,
     badgeShadowSize = token.badgeShadowSize,
-    motionDurationSlow = token.motionDurationSlow,
     textFontSize = token.textFontSize,
     textFontSizeSM = token.textFontSizeSM,
     statusSize = token.statusSize,
@@ -88,7 +87,7 @@ var genSharedBadgeStyle = function genSharedBadgeStyle(token) {
       background: darkColor
     }));
   });
-  return _defineProperty({}, componentCls, _objectSpread(_objectSpread(_objectSpread({}, resetComponent(token)), {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
+  return _defineProperty({}, componentCls, _objectSpread(_objectSpread(_objectSpread({}, resetComponent(token)), {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
     position: 'relative',
     display: 'inline-block',
     width: 'fit-content',
@@ -137,8 +136,6 @@ var genSharedBadgeStyle = function genSharedBadgeStyle(token) {
     background: token.badgeColor,
     borderRadius: '100%',
     boxShadow: "0 0 0 ".concat(unit(badgeShadowSize), " ").concat(token.badgeShadowColor)
-  }), "".concat(componentCls, "-dot").concat(numberPrefixCls), {
-    transition: "background ".concat(motionDurationSlow)
   }), "".concat(componentCls, "-count, ").concat(componentCls, "-dot, ").concat(numberPrefixCls, "-custom-component"), _defineProperty({
     position: 'absolute',
     top: 0,
@@ -168,6 +165,7 @@ var genSharedBadgeStyle = function genSharedBadgeStyle(token) {
     overflow: 'visible',
     color: token.colorInfo,
     backgroundColor: token.colorInfo,
+    borderColor: 'currentcolor',
     '&::after': {
       position: 'absolute',
       top: 0,
@@ -221,8 +219,9 @@ var genSharedBadgeStyle = function genSharedBadgeStyle(token) {
     top: 'auto',
     display: 'block',
     transformOrigin: '50% 50%'
-  })), "".concat(numberPrefixCls), _defineProperty(_defineProperty({
-    overflow: 'hidden'
+  })), numberPrefixCls, _defineProperty(_defineProperty({
+    overflow: 'hidden',
+    transition: "all ".concat(token.motionDurationMid, " ").concat(token.motionEaseOutBack)
   }, "".concat(numberPrefixCls, "-only"), _defineProperty({
     position: 'relative',
     display: 'inline-block',
@@ -251,7 +250,7 @@ export var prepareToken = function prepareToken(token) {
     colorBorderBg = token.colorBorderBg;
   var badgeFontHeight = fontHeight;
   var badgeShadowSize = lineWidth;
-  var badgeTextColor = token.colorBgContainer;
+  var badgeTextColor = token.colorTextLightSolid;
   var badgeColor = token.colorError;
   var badgeColorHover = token.colorErrorHover;
   var badgeToken = mergeToken(token, {

package/lib/Antd5/badge/style/ribbon.js

@@ -24,9 +24,9 @@ var genRibbonStyle = function genRibbonStyle(token) {
       color: darkColor
     });
   });
-  return _defineProperty(_defineProperty({}, "".concat(ribbonWrapperPrefixCls), {
+  return _defineProperty(_defineProperty({}, ribbonWrapperPrefixCls, {
     position: 'relative'
-  }), "".concat(ribbonPrefixCls), _objectSpread(_objectSpread(_objectSpread({}, resetComponent(token)), {}, _defineProperty(_defineProperty({
+  }), ribbonPrefixCls, _objectSpread(_objectSpread(_objectSpread({}, resetComponent(token)), {}, _defineProperty(_defineProperty({
     position: 'absolute',
     top: marginXS,
     padding: "0 ".concat(unit(token.paddingXS)),
@@ -36,7 +36,7 @@ var genRibbonStyle = function genRibbonStyle(token) {
     backgroundColor: token.colorPrimary,
     borderRadius: token.borderRadiusSM
   }, "".concat(ribbonPrefixCls, "-text"), {
-    color: token.colorTextLightSolid
+    color: token.badgeTextColor
   }), "".concat(ribbonPrefixCls, "-corner"), {
     position: 'absolute',
     top: '100%',

package/lib/Antd5/breadcrumb/design/behavior-pattern.js

@@ -13,22 +13,22 @@ var BehaviorPattern = function BehaviorPattern() {
         children: [{
           id: '707000085',
           label: '了解当前页面的位置',
-          link: 'components-breadcrumb-index-tab-design-demo-basic'
+          link: 'breadcrumb-index-tab-design-demo-basic'
         }, {
           id: '707000086',
           label: '了解系统层级结构',
-          link: 'components-breadcrumb-index-tab-design-demo-basic'
+          link: 'breadcrumb-index-tab-design-demo-basic'
         }]
       }, {
         id: '200000005',
         label: '向上导航',
         targetType: 'mvp',
-        link: 'components-breadcrumb-index-tab-design-demo-basic'
+        link: 'breadcrumb-index-tab-design-demo-basic'
       }, {
         id: '200000006',
         label: '快捷导航',
         targetType: 'extension',
-        link: 'components-breadcrumb-index-tab-design-demo-overlay'
+        link: 'breadcrumb-index-tab-design-demo-overlay'
       }]
     }
   });

package/lib/Antd5/breadcrumb/style/index.js

@@ -70,7 +70,7 @@ export var prepareComponentToken = function prepareComponentToken(token) {
     lastItemColor: token.colorText,
     iconFontSize: token.fontSize,
     linkColor: token.colorTextDescription,
-    linkHoverColor: token.colorPrimaryHover,
+    linkHoverColor: token.colorText,
     separatorColor: token.colorTextDescription,
     separatorMargin: token.marginXS
   };

package/lib/Antd5/button/LoadingIcon.js

@@ -14,10 +14,8 @@ var InnerLoadingIcon = /*#__PURE__*/forwardRef(function (props, ref) {
   var prefixCls = props.prefixCls,
     className = props.className,
     style = props.style,
-    iconClassName = props.iconClassName,
-    _props$iconPosition = props.iconPosition,
-    iconPosition = _props$iconPosition === void 0 ? 'start' : _props$iconPosition;
-  var mergedIconCls = classNames(className, _defineProperty(_defineProperty({}, "".concat(prefixCls, "-loading-icon-end"), iconPosition === 'end'), "".concat(prefixCls, "-loading-icon"), iconPosition === 'start'));
+    iconClassName = props.iconClassName;
+  var mergedIconCls = classNames("".concat(prefixCls, "-loading-icon"), className);
   return _jsx(IconWrapper, {
     prefixCls: prefixCls,
     className: mergedIconCls,
@@ -47,15 +45,13 @@ var LoadingIcon = function LoadingIcon(props) {
     loading = props.loading,
     existIcon = props.existIcon,
     className = props.className,
-    style = props.style,
-    iconPosition = props.iconPosition;
+    style = props.style;
   var visible = !!loading;
   if (existIcon) {
     return _jsx(InnerLoadingIcon, {
       prefixCls: prefixCls,
       className: className,
-      style: style,
-      iconPosition: iconPosition
+      style: style
     });
   }
   return _jsx(CSSMotion, {
@@ -78,8 +74,7 @@ var LoadingIcon = function LoadingIcon(props) {
         className: className,
         style: _objectSpread(_objectSpread({}, style), motionStyle),
         ref: ref,
-        iconClassName: motionCls,
-        iconPosition: iconPosition
+        iconClassName: motionCls
       });
     }
   });

package/lib/Antd5/button/button-group.js

@@ -40,7 +40,6 @@ var ButtonGroup = function ButtonGroup(props) {
     case 'small':
       sizeCls = 'sm';
       break;
-    case 'middle':
     default:
     // Do nothing
   }

package/lib/Antd5/button/button.js

@@ -1,4 +1,4 @@
-var _excluded = ["loading", "prefixCls", "type", "danger", "shape", "size", "styles", "disabled", "className", "rootClassName", "children", "icon", "iconPosition", "ghost", "block", "htmlType", "classNames", "style", "autoInsertSpace"];
+var _excluded = ["loading", "prefixCls", "color", "variant", "type", "danger", "shape", "size", "styles", "disabled", "className", "rootClassName", "children", "icon", "iconPosition", "ghost", "block", "htmlType", "classNames", "style", "autoInsertSpace", "autoFocus"];
 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(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
@@ -13,12 +13,11 @@ function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return 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); }
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-/* eslint-disable react/button-has-type */
-import React, { Children, createRef, useContext, useEffect, useMemo, useState } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { Children, useContext, useEffect, useMemo, useRef, useState } from 'react';
 import classNames from 'classnames';
 import omit from 'rc-util/lib/omit';
-import { composeRef } from 'rc-util/lib/ref';
+import { useComposeRef } from 'rc-util/lib/ref';
 import { devUseWarning } from '../_util/warning';
 import Wave from '../_util/wave';
 import { ConfigContext } from '../config-provider';
@@ -26,11 +25,11 @@ import DisabledContext from '../config-provider/DisabledContext';
 import useSize from '../config-provider/hooks/useSize';
 import { useCompactItemContext } from '../space/Compact';
 import Group, { GroupSizeContext } from './button-group';
-import { isTwoCNChar, isUnBorderedButtonType, spaceChildren } from './buttonHelpers';
+import { isTwoCNChar, isUnBorderedButtonVariant, spaceChildren } from './buttonHelpers';
 import IconWrapper from './IconWrapper';
 import LoadingIcon from './LoadingIcon';
 import useStyle from './style';
-import CompactCmp from './style/compactCmp';
+import Compact from './style/compact';
 function getLoadingConfig(loading) {
   if (_typeof(loading) === 'object' && loading) {
     var delay = loading === null || loading === void 0 ? void 0 : loading.delay;
@@ -45,13 +44,23 @@ function getLoadingConfig(loading) {
     delay: 0
   };
 }
+var ButtonTypeMap = {
+  "default": ['default', 'outlined'],
+  primary: ['primary', 'solid'],
+  dashed: ['default', 'dashed'],
+  link: ['primary', 'link'],
+  text: ['default', 'text']
+};
 var InternalCompoundedButton = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var _ref, _button$classNames, _button$styles;
+  var _ref, _sizeClassNameMap$siz, _classNames, _button$classNames, _button$styles;
   var _props$loading = props.loading,
     loading = _props$loading === void 0 ? false : _props$loading,
     customizePrefixCls = props.prefixCls,
+    color = props.color,
+    variant = props.variant,
     type = props.type,
-    danger = props.danger,
+    _props$danger = props.danger,
+    danger = _props$danger === void 0 ? false : _props$danger,
     _props$shape = props.shape,
     shape = _props$shape === void 0 ? 'default' : _props$shape,
     customizeSize = props.size,
@@ -73,10 +82,26 @@ var InternalCompoundedButton = /*#__PURE__*/React.forwardRef(function (props, re
     _props$style = props.style,
     customStyle = _props$style === void 0 ? {} : _props$style,
     autoInsertSpace = props.autoInsertSpace,
+    autoFocus = props.autoFocus,
     rest = _objectWithoutProperties(props, _excluded);
   // https://github.com/ant-design/ant-design/issues/47605
   // Compatible with original `type` behavior
   var mergedType = type || 'default';
+  var _useMemo = useMemo(function () {
+      if (color && variant) {
+        return [color, variant];
+      }
+      var colorVariantPair = ButtonTypeMap[mergedType] || [];
+      if (danger) {
+        return ['danger', colorVariantPair[1]];
+      }
+      return colorVariantPair;
+    }, [type, color, variant, danger]),
+    _useMemo2 = _slicedToArray(_useMemo, 2),
+    mergedColor = _useMemo2[0],
+    mergedVariant = _useMemo2[1];
+  var isDanger = mergedColor === 'danger';
+  var mergedColorText = isDanger ? 'dangerous' : mergedColor;
   var _useContext = useContext(ConfigContext),
     getPrefixCls = _useContext.getPrefixCls,
     direction = _useContext.direction,
@@ -102,9 +127,11 @@ var InternalCompoundedButton = /*#__PURE__*/React.forwardRef(function (props, re
     _useState4 = _slicedToArray(_useState3, 2),
     hasTwoCNChar = _useState4[0],
     setHasTwoCNChar = _useState4[1];
-  var internalRef = /*#__PURE__*/createRef();
-  var buttonRef = composeRef(ref, internalRef);
-  var needInserted = Children.count(children) === 1 && !icon && !isUnBorderedButtonType(mergedType);
+  var buttonRef = useRef();
+  var mergedRef = useComposeRef(ref, buttonRef);
+  var needInserted = Children.count(children) === 1 && !icon && !isUnBorderedButtonVariant(mergedVariant);
+  // ========================= Effect =========================
+  // Loading
   useEffect(function () {
     var delayTimer = null;
     if (loadingOrDelay.delay > 0) {
@@ -123,12 +150,13 @@ var InternalCompoundedButton = /*#__PURE__*/React.forwardRef(function (props, re
     }
     return cleanupTimer;
   }, [loadingOrDelay]);
+  // Two chinese characters check
   useEffect(function () {
     // FIXME: for HOC usage like <FormatMessage />
-    if (!buttonRef || !buttonRef.current || !mergedInsertSpace) {
+    if (!buttonRef.current || !mergedInsertSpace) {
       return;
     }
-    var buttonText = buttonRef.current.textContent;
+    var buttonText = buttonRef.current.textContent || '';
     if (needInserted && isTwoCNChar(buttonText)) {
       if (!hasTwoCNChar) {
         setHasTwoCNChar(true);
@@ -136,21 +164,30 @@ var InternalCompoundedButton = /*#__PURE__*/React.forwardRef(function (props, re
     } else if (hasTwoCNChar) {
       setHasTwoCNChar(false);
     }
-  }, [buttonRef]);
-  var handleClick = function handleClick(e) {
-    var onClick = props.onClick;
+  });
+  // Auto focus
+  useEffect(function () {
+    if (autoFocus && buttonRef.current) {
+      buttonRef.current.focus();
+    }
+  }, []);
+  // ========================= Events =========================
+  var handleClick = React.useCallback(function (e) {
+    var _props$onClick;
     // FIXME: https://github.com/ant-design/ant-design/issues/30207
     if (innerLoading || mergedDisabled) {
       e.preventDefault();
       return;
     }
-    onClick === null || onClick === void 0 || onClick(e);
-  };
+    (_props$onClick = props.onClick) === null || _props$onClick === void 0 || _props$onClick.call(props, e);
+  }, [props.onClick, innerLoading, mergedDisabled]);
+  // ========================== Warn ==========================
   if (process.env.NODE_ENV !== 'production') {
     var warning = devUseWarning('Button');
     warning(!(typeof icon === 'string' && icon.length > 2), 'breaking', "`icon` is using ReactNode instead of string naming in v4. Please check `".concat(icon, "` at https://ant.design/components/icon"));
-    warning(!(ghost && isUnBorderedButtonType(mergedType)), 'usage', "`link` or `text` button can't be a `ghost` button.");
+    warning(!(ghost && isUnBorderedButtonVariant(mergedVariant)), 'usage', "`link` or `text` button can't be a `ghost` button.");
   }
+  // ========================== Size ==========================
   var _useCompactItemContex = useCompactItemContext(prefixCls, direction),
     compactSize = _useCompactItemContex.compactSize,
     compactItemClassnames = _useCompactItemContex.compactItemClassnames;
@@ -163,13 +200,13 @@ var InternalCompoundedButton = /*#__PURE__*/React.forwardRef(function (props, re
     var _ref2, _ref3;
     return (_ref2 = (_ref3 = customizeSize !== null && customizeSize !== void 0 ? customizeSize : compactSize) !== null && _ref3 !== void 0 ? _ref3 : groupSize) !== null && _ref2 !== void 0 ? _ref2 : ctxSize;
   });
-  var sizeCls = sizeFullName ? sizeClassNameMap[sizeFullName] || '' : '';
+  var sizeCls = sizeFullName ? (_sizeClassNameMap$siz = sizeClassNameMap[sizeFullName]) !== null && _sizeClassNameMap$siz !== void 0 ? _sizeClassNameMap$siz : '' : '';
   var iconType = innerLoading ? 'loading' : icon;
   var linkButtonRestProps = omit(rest, ['navigate']);
-  var classes = classNames(prefixCls, hashId, cssVarCls, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-").concat(shape), shape !== 'default' && shape), "".concat(prefixCls, "-").concat(mergedType), mergedType), "".concat(prefixCls, "-").concat(sizeCls), sizeCls), "".concat(prefixCls, "-icon-only"), !children && children !== 0 && !!iconType), "".concat(prefixCls, "-background-ghost"), ghost && !isUnBorderedButtonType(mergedType)), "".concat(prefixCls, "-loading"), innerLoading), "".concat(prefixCls, "-two-chinese-chars"), hasTwoCNChar && mergedInsertSpace && !innerLoading), "".concat(prefixCls, "-block"), block), "".concat(prefixCls, "-dangerous"), !!danger), "".concat(prefixCls, "-rtl"), direction === 'rtl'), compactItemClassnames, className, rootClassName, button === null || button === void 0 ? void 0 : button.className);
+  // ========================= Render =========================
+  var classes = classNames(prefixCls, hashId, cssVarCls, (_classNames = {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_classNames, "".concat(prefixCls, "-").concat(shape), shape !== 'default' && shape), "".concat(prefixCls, "-").concat(mergedType), mergedType), "".concat(prefixCls, "-dangerous"), danger), "".concat(prefixCls, "-color-").concat(mergedColorText), mergedColorText), "".concat(prefixCls, "-variant-").concat(mergedVariant), mergedVariant), "".concat(prefixCls, "-").concat(sizeCls), sizeCls), "".concat(prefixCls, "-icon-only"), !children && children !== 0 && !!iconType), "".concat(prefixCls, "-background-ghost"), ghost && !isUnBorderedButtonVariant(mergedVariant)), "".concat(prefixCls, "-loading"), innerLoading), "".concat(prefixCls, "-two-chinese-chars"), hasTwoCNChar && mergedInsertSpace && !innerLoading), _defineProperty(_defineProperty(_defineProperty(_classNames, "".concat(prefixCls, "-block"), block), "".concat(prefixCls, "-rtl"), direction === 'rtl'), "".concat(prefixCls, "-icon-end"), iconPosition === 'end')), compactItemClassnames, className, rootClassName, button === null || button === void 0 ? void 0 : button.className);
   var fullStyle = _objectSpread(_objectSpread({}, button === null || button === void 0 ? void 0 : button.style), customStyle);
-  var isIconPositionEnd = iconPosition === 'end' && children && children !== 0 && iconType;
-  var iconClasses = classNames(customClassNames === null || customClassNames === void 0 ? void 0 : customClassNames.icon, button === null || button === void 0 || (_button$classNames = button.classNames) === null || _button$classNames === void 0 ? void 0 : _button$classNames.icon, _defineProperty({}, "".concat(prefixCls, "-icon-end"), isIconPositionEnd));
+  var iconClasses = classNames(customClassNames === null || customClassNames === void 0 ? void 0 : customClassNames.icon, button === null || button === void 0 || (_button$classNames = button.classNames) === null || _button$classNames === void 0 ? void 0 : _button$classNames.icon);
   var iconStyle = _objectSpread(_objectSpread({}, (styles === null || styles === void 0 ? void 0 : styles.icon) || {}), (button === null || button === void 0 || (_button$styles = button.styles) === null || _button$styles === void 0 ? void 0 : _button$styles.icon) || {});
   var iconNode = icon && !innerLoading ? _jsx(IconWrapper, {
     prefixCls: prefixCls,
@@ -179,26 +216,18 @@ var InternalCompoundedButton = /*#__PURE__*/React.forwardRef(function (props, re
   }) : _jsx(LoadingIcon, {
     existIcon: !!icon,
     prefixCls: prefixCls,
-    loading: !!innerLoading,
-    iconPosition: iconPosition
+    loading: innerLoading
   });
   var kids = children || children === 0 ? spaceChildren(children, needInserted && mergedInsertSpace) : null;
-  var genButtonContent = function genButtonContent(iconComponent, kidsComponent) {
-    return iconPosition === 'start' ? _jsxs(_Fragment, {
-      children: [iconComponent, kidsComponent]
-    }) : _jsxs(_Fragment, {
-      children: [kidsComponent, iconComponent]
-    });
-  };
   if (linkButtonRestProps.href !== undefined) {
-    return wrapCSSVar(_jsx("a", _objectSpread(_objectSpread({}, linkButtonRestProps), {}, {
+    return wrapCSSVar(_jsxs("a", _objectSpread(_objectSpread({}, linkButtonRestProps), {}, {
       className: classNames(classes, _defineProperty({}, "".concat(prefixCls, "-disabled"), mergedDisabled)),
       href: mergedDisabled ? undefined : linkButtonRestProps.href,
       style: fullStyle,
       onClick: handleClick,
-      ref: buttonRef,
+      ref: mergedRef,
       tabIndex: mergedDisabled ? -1 : 0,
-      children: genButtonContent(iconNode, kids)
+      children: [iconNode, kids]
     })));
   }
   var buttonNode = _jsxs("button", _objectSpread(_objectSpread({}, rest), {}, {
@@ -207,15 +236,15 @@ var InternalCompoundedButton = /*#__PURE__*/React.forwardRef(function (props, re
     style: fullStyle,
     onClick: handleClick,
     disabled: mergedDisabled,
-    ref: buttonRef,
-    children: [genButtonContent(iconNode, kids), !!compactItemClassnames && _jsx(CompactCmp, {
+    ref: mergedRef,
+    children: [iconNode, kids, compactItemClassnames && _jsx(Compact, {
       prefixCls: prefixCls
-    }, "compact")]
+    })]
   }));
-  if (!isUnBorderedButtonType(mergedType)) {
+  if (!isUnBorderedButtonVariant(mergedVariant)) {
     buttonNode = _jsx(Wave, {
       component: "Button",
-      disabled: !!innerLoading,
+      disabled: innerLoading,
       children: buttonNode
     });
   }