@chaoswise/ui 3.1.6 → 3.1.8

package/lib/Antd5/carousel/index.js

@@ -1,6 +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); }
 var _excluded = ["currentSlide", "slideCount"],
-  _excluded2 = ["dots", "arrows", "prevArrow", "nextArrow", "draggable", "waitForAnimate", "dotPosition", "vertical", "rootClassName", "className", "style", "id"];
+  _excluded2 = ["dots", "arrows", "prevArrow", "nextArrow", "draggable", "waitForAnimate", "dotPosition", "vertical", "rootClassName", "className", "style", "id", "autoplay", "autoplaySpeed"];
+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 _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
@@ -18,8 +18,8 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import SlickCarousel from '@ant-design/react-slick';
 import classNames from 'classnames';
-import { ConfigContext } from '../config-provider';
-import useStyle from './style';
+import { useComponentConfig } from '../config-provider/context';
+import useStyle, { DotDuration } from './style';
 var dotsClass = 'slick-dots';
 var ArrowButton = function ArrowButton(_ref) {
   var currentSlide = _ref.currentSlide,
@@ -54,12 +54,17 @@ var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
     customClassName = props.className,
     style = props.style,
     id = props.id,
+    _props$autoplay = props.autoplay,
+    autoplay = _props$autoplay === void 0 ? false : _props$autoplay,
+    _props$autoplaySpeed = props.autoplaySpeed,
+    autoplaySpeed = _props$autoplaySpeed === void 0 ? 3000 : _props$autoplaySpeed,
     otherProps = _objectWithoutProperties(props, _excluded2);
-  var _React$useContext = React.useContext(ConfigContext),
-    getPrefixCls = _React$useContext.getPrefixCls,
-    direction = _React$useContext.direction,
-    carousel = _React$useContext.carousel;
-  var slickRef = React.useRef();
+  var _useComponentConfig = useComponentConfig('carousel'),
+    getPrefixCls = _useComponentConfig.getPrefixCls,
+    direction = _useComponentConfig.direction,
+    contextClassName = _useComponentConfig.className,
+    contextStyle = _useComponentConfig.style;
+  var slickRef = React.useRef(null);
   var goTo = function goTo(slide) {
     var dontAnimate = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
     slickRef.current.slickGoTo(slide, dontAnimate);
@@ -82,8 +87,9 @@ var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }, [props.children]);
   var newProps = _objectSpread({
     vertical: vertical,
-    className: classNames(customClassName, carousel === null || carousel === void 0 ? void 0 : carousel.className),
-    style: _objectSpread(_objectSpread({}, carousel === null || carousel === void 0 ? void 0 : carousel.style), style)
+    className: classNames(customClassName, contextClassName),
+    style: _objectSpread(_objectSpread({}, contextStyle), style),
+    autoplay: !!autoplay
   }, otherProps);
   if (newProps.effect === 'fade') {
     newProps.fade = true;
@@ -97,9 +103,12 @@ var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
     hashId = _useStyle2[1],
     cssVarCls = _useStyle2[2];
   var className = classNames(prefixCls, _defineProperty(_defineProperty({}, "".concat(prefixCls, "-rtl"), direction === 'rtl'), "".concat(prefixCls, "-vertical"), newProps.vertical), hashId, cssVarCls, rootClassName);
+  var mergedShowDuration = autoplay && (_typeof(autoplay) === 'object' ? autoplay.dotDuration : false);
+  var dotDurationStyle = mergedShowDuration ? _defineProperty({}, DotDuration, "".concat(autoplaySpeed, "ms")) : {};
   return wrapCSSVar(_jsx("div", {
     className: className,
     id: id,
+    style: dotDurationStyle,
     children: _jsx(SlickCarousel, _objectSpread(_objectSpread({
       ref: slickRef
     }, newProps), {}, {
@@ -110,6 +119,7 @@ var Carousel = /*#__PURE__*/React.forwardRef(function (props, ref) {
       nextArrow: nextArrow,
       draggable: draggable,
       verticalSwiping: vertical,
+      autoplaySpeed: autoplaySpeed,
       waitForAnimate: waitForAnimate
     }))
   }));

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

@@ -7,6 +7,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 import { unit } from '@ant-design/cssinjs';
 import { resetComponent } from '../../style';
 import { genStyleHooks } from '../../theme/internal';
+export var DotDuration = '--dot-duration';
 var genCarouselStyle = function genCarouselStyle(token) {
   var componentCls = token.componentCls,
     antCls = token.antCls;
@@ -87,7 +88,7 @@ var genArrowsStyle = function genArrowsStyle(token) {
     arrowSize = token.arrowSize,
     arrowOffset = token.arrowOffset;
   var arrowLength = token.calc(arrowSize).div(Math.SQRT2).equal();
-  return [_defineProperty({}, componentCls, {
+  return _defineProperty({}, componentCls, {
     // Arrows
     '.slick-prev, .slick-next': {
       position: 'absolute',
@@ -121,8 +122,8 @@ var genArrowsStyle = function genArrowsStyle(token) {
         width: arrowLength,
         height: arrowLength,
         border: "0 solid currentcolor",
-        borderInlineWidth: '2px 0',
-        borderBlockWidth: '2px 0',
+        borderInlineStartWidth: 2,
+        borderBlockStartWidth: 2,
         borderRadius: 1,
         content: '""'
       }
@@ -139,7 +140,7 @@ var genArrowsStyle = function genArrowsStyle(token) {
         transform: 'rotate(135deg)'
       }
     }
-  })];
+  });
 };
 var genDotsStyle = function genDotsStyle(token) {
   var componentCls = token.componentCls,
@@ -149,7 +150,7 @@ var genDotsStyle = function genDotsStyle(token) {
     dotGap = token.dotGap,
     colorBgContainer = token.colorBgContainer,
     motionDurationSlow = token.motionDurationSlow;
-  return [_defineProperty({}, componentCls, {
+  return _defineProperty({}, componentCls, {
     '.slick-dots': {
       position: 'absolute',
       insetInlineEnd: 0,
@@ -181,6 +182,24 @@ var genDotsStyle = function genDotsStyle(token) {
         textIndent: -999,
         verticalAlign: 'top',
         transition: "all ".concat(motionDurationSlow),
+        borderRadius: dotHeight,
+        overflow: 'hidden',
+        '&::after': {
+          display: 'block',
+          position: 'absolute',
+          top: 0,
+          insetInlineStart: 0,
+          width: '100%',
+          height: dotHeight,
+          content: '""',
+          background: colorBgContainer,
+          borderRadius: dotHeight,
+          opacity: 1,
+          outline: 'none',
+          cursor: 'pointer',
+          overflow: 'hidden',
+          transform: 'translate3d(-100%, 0, 0)'
+        },
         button: {
           position: 'relative',
           display: 'block',
@@ -196,7 +215,8 @@ var genDotsStyle = function genDotsStyle(token) {
           cursor: 'pointer',
           opacity: 0.2,
           transition: "all ".concat(motionDurationSlow),
-          '&: hover, &:focus': {
+          overflow: 'hidden',
+          '&:hover': {
             opacity: 0.75
           },
           '&::after': {
@@ -207,17 +227,18 @@ var genDotsStyle = function genDotsStyle(token) {
         },
         '&.slick-active': {
           width: token.dotActiveWidth,
-          '& button': {
-            background: colorBgContainer,
+          position: 'relative',
+          '&:hover': {
             opacity: 1
           },
-          '&: hover, &:focus': {
-            opacity: 1
+          '&::after': {
+            transform: 'translate3d(0, 0, 0)',
+            transition: "transform var(".concat(DotDuration, ") ease-out")
           }
         }
       }
     }
-  })];
+  });
 };
 var genCarouselVerticalStyle = function genCarouselVerticalStyle(token) {
   var componentCls = token.componentCls,
@@ -268,8 +289,14 @@ var genCarouselVerticalStyle = function genCarouselVerticalStyle(token) {
         margin: "".concat(unit(marginXXS), " 0"),
         verticalAlign: 'baseline',
         button: reverseSizeOfDot,
+        '&::after': _objectSpread(_objectSpread({}, reverseSizeOfDot), {}, {
+          height: 0
+        }),
         '&.slick-active': _objectSpread(_objectSpread({}, reverseSizeOfDot), {}, {
-          button: reverseSizeOfDot
+          button: reverseSizeOfDot,
+          '&::after': _objectSpread(_objectSpread({}, reverseSizeOfDot), {}, {
+            transition: "height var(".concat(DotDuration, ") ease-out")
+          })
         })
       })
     }

package/lib/Antd5/cascader/index.js

@@ -1,4 +1,4 @@
-var _excluded = ["prefixCls", "size", "disabled", "className", "rootClassName", "multiple", "bordered", "transitionName", "choiceTransitionName", "popupClassName", "dropdownClassName", "expandIcon", "placement", "showSearch", "allowClear", "notFoundContent", "direction", "getPopupContainer", "status", "showArrow", "builtinPlacements", "style", "variant"];
+var _excluded = ["prefixCls", "size", "disabled", "className", "rootClassName", "multiple", "bordered", "transitionName", "choiceTransitionName", "popupClassName", "dropdownClassName", "expandIcon", "placement", "showSearch", "allowClear", "notFoundContent", "direction", "getPopupContainer", "status", "showArrow", "builtinPlacements", "style", "variant", "dropdownRender", "onDropdownVisibleChange", "dropdownMenuColumnStyle", "popupRender", "dropdownStyle", "popupMenuColumnStyle", "onOpenChange", "styles", "classNames"];
 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; }
@@ -19,7 +19,7 @@ function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
-import classNames from 'classnames';
+import cls from 'classnames';
 import RcCascader from 'rc-cascader';
 import omit from 'rc-util/lib/omit';
 import { useZIndex } from '../_util/hooks/useZIndex';
@@ -28,6 +28,7 @@ import genPurePanel from '../_util/PurePanel';
 import { getMergedStatus, getStatusClassNames } from '../_util/statusUtils';
 import { devUseWarning } from '../_util/warning';
 import { ConfigContext } from '../config-provider';
+import { useComponentConfig } from '../config-provider/context';
 import DefaultRenderEmpty from '../config-provider/defaultRenderEmpty';
 import DisabledContext from '../config-provider/DisabledContext';
 import useCSSVarCls from '../config-provider/hooks/useCSSVarCls';
@@ -86,7 +87,7 @@ var defaultSearchRender = function defaultSearchRender(inputValue, path, prefixC
   return optionList;
 };
 var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var _restProps$dropdownSt;
+  var _classNames$popup, _contextClassNames$po, _styles$popup, _contextStyles$popup;
   var customizePrefixCls = props.prefixCls,
     customizeSize = props.size,
     customDisabled = props.disabled,
@@ -113,13 +114,26 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
     builtinPlacements = props.builtinPlacements,
     style = props.style,
     customVariant = props.variant,
+    dropdownRender = props.dropdownRender,
+    onDropdownVisibleChange = props.onDropdownVisibleChange,
+    dropdownMenuColumnStyle = props.dropdownMenuColumnStyle,
+    popupRender = props.popupRender,
+    dropdownStyle = props.dropdownStyle,
+    popupMenuColumnStyle = props.popupMenuColumnStyle,
+    onOpenChange = props.onOpenChange,
+    styles = props.styles,
+    classNames = props.classNames,
     rest = _objectWithoutProperties(props, _excluded);
   var restProps = omit(rest, ['suffixIcon']);
+  var _useComponentConfig = useComponentConfig('cascader'),
+    getPrefixCls = _useComponentConfig.getPrefixCls,
+    getContextPopupContainer = _useComponentConfig.getPopupContainer,
+    contextClassName = _useComponentConfig.className,
+    contextStyle = _useComponentConfig.style,
+    contextClassNames = _useComponentConfig.classNames,
+    contextStyles = _useComponentConfig.styles;
   var _React$useContext = React.useContext(ConfigContext),
-    getContextPopupContainer = _React$useContext.getPopupContainer,
-    getPrefixCls = _React$useContext.getPrefixCls,
-    popupOverflow = _React$useContext.popupOverflow,
-    cascader = _React$useContext.cascader;
+    popupOverflow = _React$useContext.popupOverflow;
   // =================== Form =====================
   var _React$useContext2 = React.useContext(FormItemInputContext),
     contextStatus = _React$useContext2.status,
@@ -130,9 +144,22 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
   // =================== Warning =====================
   if (process.env.NODE_ENV !== 'production') {
     var warning = devUseWarning('Cascader');
-    warning.deprecated(!dropdownClassName, 'dropdownClassName', 'popupClassName');
+    // v5 deprecated dropdown api
+    var deprecatedProps = {
+      dropdownClassName: 'classNames.popup.root',
+      dropdownStyle: 'styles.popup.root',
+      dropdownRender: 'popupRender',
+      dropdownMenuColumnStyle: 'popupMenuColumnStyle',
+      onDropdownVisibleChange: 'onOpenChange',
+      bordered: 'variant'
+    };
+    Object.entries(deprecatedProps).forEach(function (_ref) {
+      var _ref2 = _slicedToArray(_ref, 2),
+        oldProp = _ref2[0],
+        newProp = _ref2[1];
+      warning.deprecated(!(oldProp in props), oldProp, newProp);
+    });
     warning(!('showArrow' in props), 'deprecated', '`showArrow` is deprecated which will be removed in next major version. It will be a default behavior, you can hide it by setting `suffixIcon` to null.');
-    warning.deprecated(!('bordered' in props), 'bordered', 'variant');
   }
   // ==================== Prefix =====================
   var _useBase = useBase(customizePrefixCls, direction),
@@ -165,7 +192,11 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
     componentName: "Cascader"
   });
   // =================== Dropdown ====================
-  var mergedDropdownClassName = classNames(popupClassName || dropdownClassName, "".concat(cascaderPrefixCls, "-dropdown"), _defineProperty({}, "".concat(cascaderPrefixCls, "-dropdown-rtl"), mergedDirection === 'rtl'), rootClassName, rootCls, cascaderRootCls, hashId, cssVarCls);
+  var mergedPopupClassName = cls((classNames === null || classNames === void 0 || (_classNames$popup = classNames.popup) === null || _classNames$popup === void 0 ? void 0 : _classNames$popup.root) || ((_contextClassNames$po = contextClassNames.popup) === null || _contextClassNames$po === void 0 ? void 0 : _contextClassNames$po.root) || popupClassName || dropdownClassName, "".concat(cascaderPrefixCls, "-dropdown"), _defineProperty({}, "".concat(cascaderPrefixCls, "-dropdown-rtl"), mergedDirection === 'rtl'), rootClassName, rootCls, contextClassNames.root, classNames === null || classNames === void 0 ? void 0 : classNames.root, cascaderRootCls, hashId, cssVarCls);
+  var mergedPopupRender = popupRender || dropdownRender;
+  var mergedPopupMenuColumnStyle = popupMenuColumnStyle || dropdownMenuColumnStyle;
+  var mergedOnOpenChange = onOpenChange || onDropdownVisibleChange;
+  var mergedPopupStyle = (styles === null || styles === void 0 || (_styles$popup = styles.popup) === null || _styles$popup === void 0 ? void 0 : _styles$popup.root) || ((_contextStyles$popup = contextStyles.popup) === null || _contextStyles$popup === void 0 ? void 0 : _contextStyles$popup.root) || dropdownStyle;
   // ==================== Search =====================
   var mergedShowSearch = React.useMemo(function () {
     if (!showSearch) {
@@ -181,8 +212,8 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
   }, [showSearch]);
   // ===================== Size ======================
   var mergedSize = useSize(function (ctx) {
-    var _ref;
-    return (_ref = customizeSize !== null && customizeSize !== void 0 ? customizeSize : compactSize) !== null && _ref !== void 0 ? _ref : ctx;
+    var _ref3;
+    return (_ref3 = customizeSize !== null && customizeSize !== void 0 ? customizeSize : compactSize) !== null && _ref3 !== void 0 ? _ref3 : ctx;
   });
   // ===================== Disabled =====================
   var disabled = React.useContext(DisabledContext);
@@ -218,15 +249,15 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
     clearIcon: clearIcon
   } : allowClear;
   // ============================ zIndex ============================
-  var _useZIndex = useZIndex('SelectLike', (_restProps$dropdownSt = restProps.dropdownStyle) === null || _restProps$dropdownSt === void 0 ? void 0 : _restProps$dropdownSt.zIndex),
+  var _useZIndex = useZIndex('SelectLike', mergedPopupStyle === null || mergedPopupStyle === void 0 ? void 0 : mergedPopupStyle.zIndex),
     _useZIndex2 = _slicedToArray(_useZIndex, 1),
     zIndex = _useZIndex2[0];
   // ==================== Render =====================
   var renderNode = _jsx(RcCascader, _objectSpread(_objectSpread({
     prefixCls: prefixCls,
-    className: classNames(!customizePrefixCls && cascaderPrefixCls, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-lg"), mergedSize === 'large'), "".concat(prefixCls, "-sm"), mergedSize === 'small'), "".concat(prefixCls, "-rtl"), isRtl), "".concat(prefixCls, "-").concat(variant), enableVariantCls), "".concat(prefixCls, "-in-form-item"), isFormItemInput), getStatusClassNames(prefixCls, mergedStatus, hasFeedback), compactItemClassnames, cascader === null || cascader === void 0 ? void 0 : cascader.className, className, rootClassName, rootCls, cascaderRootCls, hashId, cssVarCls),
+    className: cls(!customizePrefixCls && cascaderPrefixCls, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-lg"), mergedSize === 'large'), "".concat(prefixCls, "-sm"), mergedSize === 'small'), "".concat(prefixCls, "-rtl"), isRtl), "".concat(prefixCls, "-").concat(variant), enableVariantCls), "".concat(prefixCls, "-in-form-item"), isFormItemInput), getStatusClassNames(prefixCls, mergedStatus, hasFeedback), compactItemClassnames, contextClassName, className, rootClassName, classNames === null || classNames === void 0 ? void 0 : classNames.root, contextClassNames.root, rootCls, cascaderRootCls, hashId, cssVarCls),
     disabled: mergedDisabled,
-    style: _objectSpread(_objectSpread({}, cascader === null || cascader === void 0 ? void 0 : cascader.style), style)
+    style: _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, contextStyles.root), styles === null || styles === void 0 ? void 0 : styles.root), contextStyle), style)
   }, restProps), {}, {
     builtinPlacements: mergedBuiltinPlacements(builtinPlacements, popupOverflow),
     direction: mergedDirection,
@@ -239,11 +270,14 @@ var Cascader = /*#__PURE__*/React.forwardRef(function (props, ref) {
     removeIcon: removeIcon,
     loadingIcon: loadingIcon,
     checkable: checkable,
-    dropdownClassName: mergedDropdownClassName,
+    dropdownClassName: mergedPopupClassName,
     dropdownPrefixCls: customizePrefixCls || cascaderPrefixCls,
-    dropdownStyle: _objectSpread(_objectSpread({}, restProps.dropdownStyle), {}, {
+    dropdownStyle: _objectSpread(_objectSpread({}, mergedPopupStyle), {}, {
       zIndex: zIndex
     }),
+    dropdownRender: mergedPopupRender,
+    dropdownMenuColumnStyle: mergedPopupMenuColumnStyle,
+    onOpenChange: mergedOnOpenChange,
     choiceTransitionName: getTransitionName(rootPrefixCls, '', choiceTransitionName),
     transitionName: getTransitionName(rootPrefixCls, 'slide-up', transitionName),
     getPopupContainer: getPopupContainer || getContextPopupContainer,
@@ -256,7 +290,9 @@ if (process.env.NODE_ENV !== 'production') {
 }
 // We don't care debug panel
 /* istanbul ignore next */
-var PurePanel = genPurePanel(Cascader);
+var PurePanel = genPurePanel(Cascader, 'dropdownAlign', function (props) {
+  return omit(props, ['visible']);
+});
 Cascader.SHOW_PARENT = SHOW_PARENT;
 Cascader.SHOW_CHILD = SHOW_CHILD;
 Cascader.Panel = CascaderPanel;

package/lib/Antd5/cascader/style/columns.js

@@ -18,7 +18,8 @@ var getColumnsStyle = function getColumnsStyle(token) {
     // ================== Checkbox ==================
     '&-checkbox': {
       top: 0,
-      marginInlineEnd: token.paddingXS
+      marginInlineEnd: token.paddingXS,
+      pointerEvents: 'unset'
     },
     // ==================== Menu ====================
     // >>> Menus
@@ -71,6 +72,7 @@ var getColumnsStyle = function getColumnsStyle(token) {
         })
       }, "&-active:not(".concat(cascaderMenuItemCls, "-disabled)"), {
         '&, &:hover': {
+          color: token.optionSelectedColor,
           fontWeight: token.optionSelectedFontWeight,
           backgroundColor: token.optionSelectedBg
         }
@@ -78,7 +80,7 @@ var getColumnsStyle = function getColumnsStyle(token) {
         flex: 'auto'
       }), iconCls, {
         marginInlineStart: token.paddingXXS,
-        color: token.colorTextDescription,
+        color: token.colorIcon,
         fontSize: token.fontSizeIcon
       }), '&-keyword', {
         color: token.colorHighlight

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

@@ -40,7 +40,8 @@ export var prepareComponentToken = function prepareComponentToken(token) {
     optionSelectedBg: token.controlItemBgActive,
     optionSelectedFontWeight: token.fontWeightStrong,
     optionPadding: "".concat(itemPaddingVertical, "px ").concat(token.paddingSM, "px"),
-    menuPadding: token.paddingXXS
+    menuPadding: token.paddingXXS,
+    optionSelectedColor: token.colorText
   };
 };
 export default genStyleHooks('Cascader', function (token) {

package/lib/Antd5/collapse/Collapse.js

@@ -20,15 +20,17 @@ import omit from 'rc-util/lib/omit';
 import initCollapseMotion from '../_util/motion';
 import { cloneElement } from '../_util/reactNode';
 import { devUseWarning } from '../_util/warning';
-import { ConfigContext } from '../config-provider';
+import { useComponentConfig } from '../config-provider/context';
 import useSize from '../config-provider/hooks/useSize';
 import CollapsePanel from './CollapsePanel';
 import useStyle from './style';
 var Collapse = /*#__PURE__*/React.forwardRef(function (props, ref) {
-  var _React$useContext = React.useContext(ConfigContext),
-    getPrefixCls = _React$useContext.getPrefixCls,
-    direction = _React$useContext.direction,
-    collapse = _React$useContext.collapse;
+  var _useComponentConfig = useComponentConfig('collapse'),
+    getPrefixCls = _useComponentConfig.getPrefixCls,
+    direction = _useComponentConfig.direction,
+    contextExpandIcon = _useComponentConfig.expandIcon,
+    contextClassName = _useComponentConfig.className,
+    contextStyle = _useComponentConfig.style;
   var customizePrefixCls = props.prefixCls,
     className = props.className,
     rootClassName = props.rootClassName,
@@ -40,6 +42,8 @@ var Collapse = /*#__PURE__*/React.forwardRef(function (props, ref) {
     _props$expandIconPosi = props.expandIconPosition,
     expandIconPosition = _props$expandIconPosi === void 0 ? 'start' : _props$expandIconPosi,
     children = props.children,
+    destroyInactivePanel = props.destroyInactivePanel,
+    destroyOnHidden = props.destroyOnHidden,
     expandIcon = props.expandIcon;
   var mergedSize = useSize(function (ctx) {
     var _ref;
@@ -56,6 +60,7 @@ var Collapse = /*#__PURE__*/React.forwardRef(function (props, ref) {
     var warning = devUseWarning('Collapse');
     // Warning if use legacy type `expandIconPosition`
     warning(expandIconPosition !== 'left' && expandIconPosition !== 'right', 'deprecated', '`expandIconPosition` with `left` or `right` is deprecated. Please use `start` or `end` instead.');
+    warning.deprecated(!('destroyInactivePanel' in props), 'destroyInactivePanel', 'destroyOnHidden');
   }
   // Align with logic position
   var mergedExpandIconPosition = React.useMemo(function () {
@@ -64,11 +69,11 @@ var Collapse = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }
     return expandIconPosition === 'right' ? 'end' : expandIconPosition;
   }, [expandIconPosition]);
-  var mergedExpandIcon = expandIcon !== null && expandIcon !== void 0 ? expandIcon : collapse === null || collapse === void 0 ? void 0 : collapse.expandIcon;
+  var mergedExpandIcon = expandIcon !== null && expandIcon !== void 0 ? expandIcon : contextExpandIcon;
   var renderExpandIcon = React.useCallback(function () {
     var panelProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
     var icon = typeof mergedExpandIcon === 'function' ? mergedExpandIcon(panelProps) : _jsx(RightOutlined, {
-      rotate: panelProps.isActive ? 90 : undefined,
+      rotate: panelProps.isActive ? direction === 'rtl' ? -90 : 90 : undefined,
       "aria-label": panelProps.isActive ? 'expanded' : 'collapsed'
     });
     return cloneElement(icon, function () {
@@ -78,28 +83,28 @@ var Collapse = /*#__PURE__*/React.forwardRef(function (props, ref) {
       };
     });
   }, [mergedExpandIcon, prefixCls]);
-  var collapseClassName = classNames("".concat(prefixCls, "-icon-position-").concat(mergedExpandIconPosition), _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-borderless"), !bordered), "".concat(prefixCls, "-rtl"), direction === 'rtl'), "".concat(prefixCls, "-ghost"), !!ghost), "".concat(prefixCls, "-").concat(mergedSize), mergedSize !== 'middle'), collapse === null || collapse === void 0 ? void 0 : collapse.className, className, rootClassName, hashId, cssVarCls);
+  var collapseClassName = classNames("".concat(prefixCls, "-icon-position-").concat(mergedExpandIconPosition), _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-borderless"), !bordered), "".concat(prefixCls, "-rtl"), direction === 'rtl'), "".concat(prefixCls, "-ghost"), !!ghost), "".concat(prefixCls, "-").concat(mergedSize), mergedSize !== 'middle'), contextClassName, className, rootClassName, hashId, cssVarCls);
   var openMotion = _objectSpread(_objectSpread({}, initCollapseMotion(rootPrefixCls)), {}, {
     motionAppear: false,
     leavedClassName: "".concat(prefixCls, "-content-hidden")
   });
   var items = React.useMemo(function () {
-    return children ? toArray(children).map(function (child, index) {
-      var _child$props;
-      if ((_child$props = child.props) !== null && _child$props !== void 0 && _child$props.disabled) {
-        var _child$key;
-        var key = (_child$key = child.key) !== null && _child$key !== void 0 ? _child$key : String(index);
-        var _child$props2 = child.props,
-          disabled = _child$props2.disabled,
-          collapsible = _child$props2.collapsible;
-        var childProps = _objectSpread(_objectSpread({}, omit(child.props, ['disabled'])), {}, {
-          key: key,
-          collapsible: collapsible !== null && collapsible !== void 0 ? collapsible : disabled ? 'disabled' : undefined
-        });
-        return cloneElement(child, childProps);
-      }
-      return child;
-    }) : null;
+    if (children) {
+      return toArray(children).map(function (child, index) {
+        var childProps = child.props;
+        if (childProps !== null && childProps !== void 0 && childProps.disabled) {
+          var _child$key, _childProps$collapsib;
+          var key = (_child$key = child.key) !== null && _child$key !== void 0 ? _child$key : String(index);
+          var mergedChildProps = _objectSpread(_objectSpread({}, omit(child.props, ['disabled'])), {}, {
+            key: key,
+            collapsible: (_childProps$collapsib = childProps.collapsible) !== null && _childProps$collapsib !== void 0 ? _childProps$collapsib : 'disabled'
+          });
+          return cloneElement(child, mergedChildProps);
+        }
+        return child;
+      });
+    }
+    return null;
   }, [children]);
   return wrapCSSVar(
   // @ts-ignore
@@ -110,7 +115,9 @@ var Collapse = /*#__PURE__*/React.forwardRef(function (props, ref) {
     expandIcon: renderExpandIcon,
     prefixCls: prefixCls,
     className: collapseClassName,
-    style: _objectSpread(_objectSpread({}, collapse === null || collapse === void 0 ? void 0 : collapse.style), style),
+    style: _objectSpread(_objectSpread({}, contextStyle), style),
+    // TODO: In the future, destroyInactivePanel in rc-collapse needs to be upgrade to destroyOnHidden
+    destroyInactivePanel: destroyOnHidden !== null && destroyOnHidden !== void 0 ? destroyOnHidden : destroyInactivePanel,
     children: items
   })));
 });

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

@@ -5,7 +5,7 @@ function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object
 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); }
 import { unit } from '@ant-design/cssinjs';
-import { resetComponent, resetIcon } from '../../style';
+import { genFocusStyle, resetComponent, resetIcon } from '../../style';
 import { genCollapseMotion } from '../../style/motion';
 import { genStyleHooks, mergeToken } from '../../theme/internal';
 export var genBaseStyle = function genBaseStyle(token) {
@@ -45,10 +45,13 @@ export var genBaseStyle = function genBaseStyle(token) {
     }
   }, "& > ".concat(componentCls, "-item"), _defineProperty(_defineProperty(_defineProperty({
     borderBottom: borderBase,
+    '&:first-child': _defineProperty({}, "\n            &,\n            & > ".concat(componentCls, "-header"), {
+      borderRadius: "".concat(unit(collapsePanelBorderRadius), " ").concat(unit(collapsePanelBorderRadius), " 0 0")
+    }),
     '&:last-child': _defineProperty({}, "\n            &,\n            & > ".concat(componentCls, "-header"), {
       borderRadius: "0 0 ".concat(unit(collapsePanelBorderRadius), " ").concat(unit(collapsePanelBorderRadius))
     })
-  }, "> ".concat(componentCls, "-header"), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
+  }, "> ".concat(componentCls, "-header"), _objectSpread(_objectSpread({
     position: 'relative',
     // Compatible with old version of antd, should remove in next version
     display: 'flex',
@@ -59,10 +62,8 @@ export var genBaseStyle = function genBaseStyle(token) {
     lineHeight: lineHeight,
     cursor: 'pointer',
     transition: "all ".concat(motionDurationSlow, ", visibility 0s")
-  }, "> ".concat(componentCls, "-header-text"), {
+  }, genFocusStyle(token)), {}, _defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "> ".concat(componentCls, "-header-text"), {
     flex: 'auto'
-  }), '&:focus', {
-    outline: 'none'
   }), "".concat(componentCls, "-expand-icon"), {
     height: fontHeight,
     display: 'flex',
@@ -78,7 +79,7 @@ export var genBaseStyle = function genBaseStyle(token) {
     }
   })), "".concat(componentCls, "-header-text"), {
     marginInlineEnd: 'auto'
-  })), "".concat(componentCls, "-collapsible-header"), _defineProperty({
+  }))), "".concat(componentCls, "-collapsible-header"), _defineProperty({
     cursor: 'default'
   }, "".concat(componentCls, "-header-text"), {
     flex: 'none',
@@ -138,7 +139,8 @@ var genArrowStyle = function genArrowStyle(token) {
 var genBorderlessStyle = function genBorderlessStyle(token) {
   var componentCls = token.componentCls,
     headerBg = token.headerBg,
-    paddingXXS = token.paddingXXS,
+    borderlessContentPadding = token.borderlessContentPadding,
+    borderlessContentBg = token.borderlessContentBg,
     colorBorder = token.colorBorder;
   return _defineProperty({}, "".concat(componentCls, "-borderless"), _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({
     backgroundColor: headerBg,
@@ -150,10 +152,10 @@ var genBorderlessStyle = function genBorderlessStyle(token) {
   }), "> ".concat(componentCls, "-item:last-child"), {
     borderBottom: 0
   }), "> ".concat(componentCls, "-item > ").concat(componentCls, "-content"), {
-    backgroundColor: 'transparent',
+    backgroundColor: borderlessContentBg,
     borderTop: 0
   }), "> ".concat(componentCls, "-item > ").concat(componentCls, "-content > ").concat(componentCls, "-content-box"), {
-    paddingTop: paddingXXS
+    padding: borderlessContentPadding
   }));
 };
 var genGhostStyle = function genGhostStyle(token) {
@@ -177,7 +179,9 @@ export var prepareComponentToken = function prepareComponentToken(token) {
     headerBg: token.colorFillAlter,
     contentPadding: "".concat(token.padding, "px 16px"),
     // Fixed Value
-    contentBg: token.colorBgContainer
+    contentBg: token.colorBgContainer,
+    borderlessContentPadding: "".concat(token.paddingXXS, "px 16px ").concat(token.padding, "px"),
+    borderlessContentBg: 'transparent'
   };
 };
 export default genStyleHooks('Collapse', function (token) {