@kdcloudjs/kdesign 1.3.2 → 1.3.5

package/lib/menu/subMenu.js

@@ -1,11 +1,5 @@
 "use strict";
 
-var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-
-var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
-
-var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
 
 Object.defineProperty(exports, "__esModule", {
@@ -17,8 +11,6 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/he
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
 
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
-
 var _getOwnPropertySymbols = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols"));
 
 var _includes = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/includes"));
@@ -27,7 +19,7 @@ var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-sta
 
 var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
 
-var React = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 
 var _configProvider = require("../config-provider");
 
@@ -43,11 +35,11 @@ var _hooks = require("../_utils/hooks");
 
 var _index = require("../index");
 
-var _devwarning = _interopRequireDefault(require("../_utils/devwarning"));
+var _usePopper = _interopRequireDefault(require("../_utils/usePopper"));
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+var _devwarning = _interopRequireDefault(require("../_utils/devwarning"));
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var _menuItem = require("./menuItem");
 
 var __rest = void 0 && (void 0).__rest || function (s, e) {
   var t = {};
@@ -63,9 +55,9 @@ var __rest = void 0 && (void 0).__rest || function (s, e) {
 };
 
 var SubMenu = function SubMenu(props) {
-  var _classNames2;
+  var _classNames2, _classNames3, _context4;
 
-  var _React$useContext = React.useContext(_configProvider.ConfigContext),
+  var _React$useContext = _react.default.useContext(_configProvider.ConfigContext),
       getPrefixCls = _React$useContext.getPrefixCls,
       pkgPrefixCls = _React$useContext.prefixCls,
       userDefaultProps = _React$useContext.compDefaultProps; // 属性需要合并一遍用户定义的默认属性
@@ -73,6 +65,7 @@ var SubMenu = function SubMenu(props) {
 
   var _a = (0, _utils.getCompProps)('MenuSubMenu', userDefaultProps, props),
       customPrefixcls = _a.prefixCls,
+      theme = _a.theme,
       mode = _a.mode,
       title = _a.title,
       icon = _a.icon,
@@ -90,8 +83,9 @@ var SubMenu = function SubMenu(props) {
       handleOnOpenChange = _a.handleOnOpenChange,
       _a$paddingLeft = _a.paddingLeft,
       paddingLeft = _a$paddingLeft === void 0 ? 0 : _a$paddingLeft,
-      restProps = __rest(_a, ["prefixCls", "mode", "title", "icon", "disabled", "children", "collapsed", "keyValue", "selectedKey", "openKeys", "triggerSubMenuAction", "forceSubMenuRender", "inlineIndent", "className", "style", "handleOnOpenChange", "paddingLeft"]); // 初始化level
+      restProps = __rest(_a, ["prefixCls", "theme", "mode", "title", "icon", "disabled", "children", "collapsed", "keyValue", "selectedKey", "openKeys", "triggerSubMenuAction", "forceSubMenuRender", "inlineIndent", "className", "style", "handleOnOpenChange", "paddingLeft"]);
 
+  var isVertical = mode === 'vertical'; // 初始化level
 
   if (!restProps.level) {
     restProps.level = 1;
@@ -105,21 +99,19 @@ var SubMenu = function SubMenu(props) {
   (0, _devwarning.default)(!children, 'submenu', 'cannot found children in Menu.SubMenu'); // className前缀
 
   var prefixCls = getPrefixCls(pkgPrefixCls, 'menu-submenu', customPrefixcls);
-  var subMenuRef = React.useRef(null);
-  var subMenuWrapperRef = React.useRef(null);
 
-  var _React$useState = React.useState(false),
-      _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-      isVisible = _React$useState2[0],
-      setIsVisible = _React$useState2[1];
+  var subMenuRef = _react.default.useRef(null);
 
-  React.useEffect(function () {
-    if (openKeys.length > 0) {
-      setIsVisible((0, _includes.default)(openKeys).call(openKeys, keyValue));
-    }
-  }, [keyValue]);
-  React.useEffect(function () {
-    if (!isVisible) return;
+  var subMenuWrapperRef = _react.default.useRef(null);
+
+  var subMenuVerticalRef = _react.default.useRef(null);
+
+  var subMenuWrapperVerticalRef = _react.default.useRef(null);
+
+  var visible = Array.isArray(openKeys) && (0, _includes.default)(openKeys).call(openKeys, keyValue);
+
+  _react.default.useEffect(function () {
+    if (!visible || isVertical) return;
     var subMenuWrapperEle = subMenuWrapperRef.current;
     var subMenuEle = subMenuRef.current;
 
@@ -160,22 +152,23 @@ var SubMenu = function SubMenu(props) {
 
   var curPaddingRight = getPaddingRight();
   var curPaddingLeft = getPaddingLeft();
-  var getCurrentStyle = React.useCallback(function () {
+
+  var getCurrentStyle = _react.default.useCallback(function () {
     var _a; // 内嵌模式height主要是用来动画的，必须要设置overflow溢出隐藏
 
 
     if (mode === 'inline') {
       var height = ((_a = subMenuWrapperRef.current) === null || _a === void 0 ? void 0 : _a.scrollHeight) || 0;
       return {
-        height: isVisible && !collapsed ? "".concat(height, "px") : '0px',
+        height: visible && !collapsed ? "".concat(height, "px") : '0px',
         overflow: 'hidden',
-        opacity: isVisible && !collapsed ? 1 : 0,
+        opacity: visible && !collapsed ? 1 : 0,
         transition: 'all 0.2s cubic-bezier(0,.4,.4,1)'
       };
     }
 
     var style = {
-      visibility: forceSubMenuRender && !isVisible ? 'visible' : 'hidden'
+      visibility: forceSubMenuRender && !visible ? 'visible' : 'hidden'
     };
 
     if (restProps.subMenuMode === 'horizontal') {
@@ -204,28 +197,34 @@ var SubMenu = function SubMenu(props) {
       paddingLeft: "".concat(popupOffsetPosition[0], "px"),
       paddingTop: "".concat(popupOffsetPosition[1], "px")
     });
-  }, [subMenuRef, restProps.popupOffset, forceSubMenuRender, isVisible, mode, restProps.subMenuMode]);
+  }, [subMenuRef, restProps.popupOffset, forceSubMenuRender, visible, mode, restProps.subMenuMode]);
+
+  var handleVisibleChange = function handleVisibleChange(status) {
+    var clean = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+    handleOnOpenChange(keyValue, status, clean);
+  };
 
   var closeSubMenu = function closeSubMenu() {
-    setIsVisible(false);
-    handleOnOpenChange(keyValue);
+    handleVisibleChange(false, true);
   }; // 点击区域外的地方关闭
 
 
-  (0, _hooks.useOnClickOutside)([subMenuRef], function () {
-    if (triggerSubMenuAction === 'click' && mode === 'vertical') {
+  (0, _hooks.useOnClickOutside)([subMenuVerticalRef, subMenuWrapperVerticalRef], function (e) {
+    var _a;
+
+    var className = ((_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.className) || '';
+
+    if (!(0, _includes.default)(className).call(className, _menuItem.MENU_ITEM_CONTAINER_NAME)) {
       closeSubMenu();
     }
-  }); // 缩略模式自动关闭子菜单
-
-  if (triggerSubMenuAction === 'click' && mode === 'vertical' && collapsed) {
-    closeSubMenu();
-  }
+  }); // // 缩略模式自动关闭子菜单
+  // if (triggerSubMenuAction === 'click' && mode === 'vertical' && collapsed) {
+  //   closeSubMenu()
+  // }
 
   var handleMouseEvent = function handleMouseEvent(status) {
     if (disabled || triggerSubMenuAction === 'click') return;
-    handleOnOpenChange(keyValue);
-    setIsVisible(status);
+    handleVisibleChange(status);
   };
 
   var handleOnMouseEnter = function handleOnMouseEnter() {
@@ -242,7 +241,7 @@ var SubMenu = function SubMenu(props) {
     // 保存路径
     info.keyPath = (0, _concat.default)(_context = info.keyPath).call(_context, [keyValue]);
 
-    if (triggerSubMenuAction === 'click' && mode === 'vertical') {
+    if (triggerSubMenuAction === 'click' && isVertical) {
       closeSubMenu();
     }
 
@@ -250,20 +249,18 @@ var SubMenu = function SubMenu(props) {
   }; // 子菜单展开收缩
 
 
-  var handleOnClickSubMenu = function handleOnClickSubMenu(e) {
+  var handleOnClickSubMenu = function handleOnClickSubMenu() {
     if (disabled || triggerSubMenuAction === 'hover') return;
-    e.stopPropagation();
-    handleOnOpenChange(keyValue);
-    setIsVisible(!isVisible);
+    handleVisibleChange(!visible);
   };
 
   var renderItemTitle = function renderItemTitle() {
     if (!icon && collapsed && restProps.level === 1 && (0, _util.isString)(title)) {
-      return /*#__PURE__*/React.createElement("p", null, title.charAt(0));
+      return /*#__PURE__*/_react.default.createElement("p", null, title.charAt(0));
     }
 
     if ((0, _util.isString)(title)) {
-      return /*#__PURE__*/React.createElement("span", null, title);
+      return /*#__PURE__*/_react.default.createElement("span", null, title);
     }
 
     return (0, _util.renderReactNodeFunction)(title);
@@ -273,101 +270,27 @@ var SubMenu = function SubMenu(props) {
     var _context2;
 
     if (mode !== 'inline' || collapsed) return null;
-    return /*#__PURE__*/React.createElement(_index.Icon, {
+    return /*#__PURE__*/_react.default.createElement(_index.Icon, {
       type: "arrow-down",
-      className: (0, _classnames.default)("".concat(prefixCls, "-arrow"), (0, _defineProperty2.default)({}, (0, _concat.default)(_context2 = "".concat(prefixCls, "-arrow-")).call(_context2, isVisible ? 'up' : 'down'), true))
+      className: (0, _classnames.default)("".concat(prefixCls, "-arrow"), (0, _defineProperty2.default)({}, (0, _concat.default)(_context2 = "".concat(prefixCls, "-arrow-")).call(_context2, visible ? 'up' : 'down'), true))
     });
   };
 
-  var renderSubMenu = function renderSubMenu() {
-    var _context3;
-
-    var style = getCurrentStyle(); // 展开收缩动画。针对二级三级菜单目前使用单一的样式去区分了
-
-    var motionClassName = {};
-
-    if (mode !== 'inline') {
-      var prefixClsMotion = "".concat(prefixCls, "-sub");
-
-      if (isVisible) {
-        motionClassName["".concat(prefixClsMotion, "-second")] = restProps.level === 1;
-        motionClassName["".concat(prefixClsMotion, "-third")] = restProps.level === 2;
-      } else {
-        motionClassName["".concat(prefixClsMotion, "-hide")] = true;
-      }
-    }
-
-    return /*#__PURE__*/React.createElement("div", {
-      style: style,
-      ref: subMenuWrapperRef
-    }, /*#__PURE__*/React.createElement("ul", {
-      className: (0, _classnames.default)("".concat(prefixCls, "-sub"), restProps.popupClassName, motionClassName)
-    }, (0, _map.default)(_context3 = (0, _reactChildren.toArray)(children)).call(_context3, function (item, index) {
-      var key = item.key || index;
-      return /*#__PURE__*/React.cloneElement(item, {
-        key: key,
-        level: restProps.level + 1,
-        keyValue: key,
-        collapsed: collapsed,
-        mode: mode,
-        selectedKey: selectedKey,
-        openKeys: openKeys,
-        forceSubMenuRender: forceSubMenuRender,
-        triggerSubMenuAction: triggerSubMenuAction,
-        handleOnOpenChange: handleOnOpenChange,
-        handleOnClick: handleOnClick,
-        inlineIndent: inlineIndent,
-        paddingLeft: curPaddingLeft
-      });
-    })));
-  };
-
-  var renderThridMenu = function renderThridMenu() {
-    var _context4;
-
-    var style = getCurrentStyle();
-    return /*#__PURE__*/React.createElement("div", {
-      style: style
-    }, /*#__PURE__*/React.createElement("div", {
-      className: (0, _classnames.default)("".concat(prefixCls, "-thrid")),
-      onClick: function onClick(e) {
-        e.stopPropagation();
-      },
-      style: {
-        width: (0, _util.getWrapWidth)(children)
-      }
-    }, (0, _map.default)(_context4 = (0, _reactChildren.toArray)(children)).call(_context4, function (item, i) {
-      return /*#__PURE__*/React.cloneElement(item, {
-        level: restProps.level + 1,
-        subMenuMode: restProps.subMenuMode,
-        keyValue: item.key || i,
-        collapsed: collapsed,
-        mode: mode,
-        selectedKey: selectedKey,
-        openKeys: openKeys,
-        forceSubMenuRender: forceSubMenuRender,
-        triggerSubMenuAction: triggerSubMenuAction,
-        handleOnOpenChange: handleOnOpenChange,
-        handleOnClick: handleOnClick
-      });
-    })));
-  };
-
   if (restProps.subMenuMode === 'horizontal' && restProps.level > 1 && children) {
-    var _context5;
+    var _context3;
 
     var width = (0, _util.getItemWidth)(children);
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/_react.default.createElement("div", {
       className: (0, _classnames.default)("".concat(prefixCls, "-thrid-item")),
       style: {
         width: width
       }
-    }, /*#__PURE__*/React.createElement("div", {
+    }, /*#__PURE__*/_react.default.createElement("div", {
       className: (0, _classnames.default)("".concat(prefixCls, "-thrid-title"))
-    }, /*#__PURE__*/React.createElement("span", null, title)), /*#__PURE__*/React.createElement("ul", {
+    }, /*#__PURE__*/_react.default.createElement("span", null, title)), /*#__PURE__*/_react.default.createElement("ul", {
       className: (0, _classnames.default)("".concat(prefixCls, "-thrid-list"), restProps.popupClassName)
-    }, (0, _map.default)(_context5 = (0, _reactChildren.toArray)(children)).call(_context5, function (item, i) {
-      return /*#__PURE__*/React.cloneElement(item, {
+    }, (0, _map.default)(_context3 = (0, _reactChildren.toArray)(children)).call(_context3, function (item, i) {
+      return /*#__PURE__*/_react.default.cloneElement(item, {
         level: restProps.level + 1,
         subMenuMode: restProps.subMenuMode,
         keyValue: item && item.key || i,
@@ -391,19 +314,99 @@ var SubMenu = function SubMenu(props) {
   var titleStyle = {
     paddingRight: "".concat(curPaddingRight, "px"),
     paddingLeft: "".concat(curPaddingLeft, "px")
-  };
-  return /*#__PURE__*/React.createElement("li", (0, _extends2.default)({
-    ref: subMenuRef,
-    className: (0, _classnames.default)(prefixCls, className, (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-collapsed"), collapsed), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-disabled"), disabled), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-hover"), !disabled && isVisible), _classNames2)),
+  }; // eslint-disable-next-line react-hooks/rules-of-hooks
+
+  var verticalView = (0, _usePopper.default)( /*#__PURE__*/_react.default.createElement("li", (0, _extends2.default)({
+    className: (0, _classnames.default)(prefixCls, className, (_classNames2 = {}, (0, _defineProperty2.default)(_classNames2, "light", theme === 'light'), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-collapsed"), collapsed), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-disabled"), disabled), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-hover"), !disabled && visible), (0, _defineProperty2.default)(_classNames2, "".concat(prefixCls, "-active"), Array.isArray(openKeys) && (0, _includes.default)(openKeys).call(openKeys, keyValue)), _classNames2)),
+    ref: subMenuVerticalRef,
     key: keyValue
-  }, mouseEvent, {
-    style: style
-  }), /*#__PURE__*/React.createElement("div", {
+  }, {
+    onMouseLeave: handleOnMouseLeave,
+    onMouseEnter: handleOnMouseEnter,
+    onClick: handleOnClickSubMenu
+  }), /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _classnames.default)("".concat(prefixCls, "-title")),
     style: titleStyle
-  }, icon && /*#__PURE__*/React.cloneElement((0, _util.renderReactNodeFunction)(icon), {
+  }, icon && /*#__PURE__*/_react.default.cloneElement((0, _util.renderReactNodeFunction)(icon), {
     className: (0, _classnames.default)("".concat(prefixCls, "-icon"))
-  }), renderItemTitle(), renderItemArrow()), restProps.subMenuMode === 'horizontal' ? renderThridMenu() : renderSubMenu());
+  }), renderItemTitle(), renderItemArrow())), /*#__PURE__*/_react.default.createElement("div", {
+    ref: subMenuWrapperVerticalRef,
+    onMouseLeave: function onMouseLeave() {
+      handleOnMouseLeave();
+    },
+    onMouseEnter: function onMouseEnter() {
+      handleOnMouseEnter();
+    }
+  }, /*#__PURE__*/_react.default.createElement("ul", {
+    className: (0, _classnames.default)("".concat(prefixCls, "-sub"), restProps.popupClassName, (_classNames3 = {}, (0, _defineProperty2.default)(_classNames3, "".concat(prefixCls, "-sub-second"), restProps.level === 1), (0, _defineProperty2.default)(_classNames3, "".concat(prefixCls, "-sub-third"), restProps.level === 2), _classNames3))
+  }, (0, _map.default)(_context4 = (0, _reactChildren.toArray)(children)).call(_context4, function (item, index) {
+    var key = item.key || index;
+    return /*#__PURE__*/_react.default.cloneElement(item, {
+      key: key,
+      level: restProps.level + 1,
+      keyValue: key,
+      collapsed: collapsed,
+      mode: mode,
+      theme: theme,
+      selectedKey: selectedKey,
+      openKeys: openKeys,
+      forceSubMenuRender: forceSubMenuRender,
+      triggerSubMenuAction: triggerSubMenuAction,
+      handleOnOpenChange: handleOnOpenChange,
+      handleOnClick: handleOnClick,
+      inlineIndent: inlineIndent,
+      paddingLeft: curPaddingLeft
+    });
+  }))), {
+    arrow: false,
+    placement: 'rightTop',
+    gap: 0,
+    visible: isVertical ? visible : false,
+    disabled: isVertical ? undefined : true,
+    prefixCls: 'kd-menu-popper',
+    popperClassName: theme === 'light' ? 'light' : ''
+  });
+
+  if (isVertical) {
+    return verticalView;
+  } else {
+    var _classNames4, _context5;
+
+    return /*#__PURE__*/_react.default.createElement("li", (0, _extends2.default)({
+      ref: subMenuRef,
+      className: (0, _classnames.default)(prefixCls, className, (_classNames4 = {}, (0, _defineProperty2.default)(_classNames4, "".concat(prefixCls, "-collapsed"), collapsed), (0, _defineProperty2.default)(_classNames4, "".concat(prefixCls, "-disabled"), disabled), _classNames4)),
+      key: keyValue
+    }, mouseEvent, {
+      style: style
+    }), /*#__PURE__*/_react.default.createElement("div", {
+      className: (0, _classnames.default)("".concat(prefixCls, "-title")),
+      style: titleStyle
+    }, icon && /*#__PURE__*/_react.default.cloneElement((0, _util.renderReactNodeFunction)(icon), {
+      className: (0, _classnames.default)("".concat(prefixCls, "-icon"))
+    }), renderItemTitle(), renderItemArrow()), /*#__PURE__*/_react.default.createElement("div", {
+      style: getCurrentStyle(),
+      ref: subMenuWrapperRef
+    }, /*#__PURE__*/_react.default.createElement("ul", {
+      className: (0, _classnames.default)("".concat(prefixCls, "-sub"), restProps.popupClassName)
+    }, (0, _map.default)(_context5 = (0, _reactChildren.toArray)(children)).call(_context5, function (item, index) {
+      var key = item.key || index;
+      return /*#__PURE__*/_react.default.cloneElement(item, {
+        key: key,
+        level: restProps.level + 1,
+        keyValue: key,
+        collapsed: collapsed,
+        mode: mode,
+        selectedKey: selectedKey,
+        openKeys: openKeys,
+        forceSubMenuRender: forceSubMenuRender,
+        triggerSubMenuAction: triggerSubMenuAction,
+        handleOnOpenChange: handleOnOpenChange,
+        handleOnClick: handleOnClick,
+        inlineIndent: inlineIndent,
+        paddingLeft: curPaddingLeft
+      });
+    }))));
+  }
 };
 
 SubMenu.displayName = 'SubMenu';

package/lib/radio/radio.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import React from 'react';
 import { IRadioProps } from './interface';
 declare const Radio: React.ForwardRefExoticComponent<IRadioProps & React.RefAttributes<unknown>>;
 export default Radio;

package/lib/radio/radio.js

@@ -21,7 +21,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/hel
 
 var _getOwnPropertySymbols = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols"));
 
-var React = _interopRequireWildcard(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
@@ -51,14 +51,15 @@ var __rest = void 0 && (void 0).__rest || function (s, e) {
 var InternalRadio = function InternalRadio(props, ref) {
   var _classNames;
 
-  var context = React.useContext(_context.default);
+  var context = _react.default.useContext(_context.default);
 
-  var _React$useContext = React.useContext(_ConfigContext.default),
+  var _React$useContext = _react.default.useContext(_ConfigContext.default),
       getPrefixCls = _React$useContext.getPrefixCls,
       prefixCls = _React$useContext.prefixCls,
       userDefaultProps = _React$useContext.compDefaultProps;
 
-  var innerRef = React.useRef();
+  var innerRef = _react.default.useRef();
+
   var mergedRef = ref || innerRef;
 
   var _a = (0, _utils.getCompProps)('Radio', userDefaultProps, props),
@@ -78,14 +79,15 @@ var InternalRadio = function InternalRadio(props, ref) {
 
   var radioPrefixCls = getPrefixCls === null || getPrefixCls === void 0 ? void 0 : getPrefixCls(prefixCls, getPrefix(radioType), customPrefixcls); // 样式前缀
 
-  var _React$useState = React.useState(checked || defaultChecked),
+  var _React$useState = _react.default.useState(checked || defaultChecked),
       _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
       isChecked = _React$useState2[0],
       setIsChecked = _React$useState2[1];
 
-  React.useEffect(function () {
+  _react.default.useEffect(function () {
     checked !== undefined && setIsChecked(checked);
   }, [checked]);
+
   var radioProps = (0, _extends2.default)({}, restProps);
 
   var onChange = function onChange(e) {
@@ -110,32 +112,40 @@ var InternalRadio = function InternalRadio(props, ref) {
 
   var classString = (0, _classnames.default)((_classNames = {}, (0, _defineProperty2.default)(_classNames, "".concat(radioPrefixCls), true), (0, _defineProperty2.default)(_classNames, "".concat(radioPrefixCls, "-disabled"), radioProps.disabled), (0, _defineProperty2.default)(_classNames, "".concat(radioPrefixCls, "-checked"), context ? radioProps.checked : isChecked), _classNames), className); // 单选包裹元素class名称
 
-  var handleRepeatClick = function handleRepeatClick(e) {
-    var element = e.target;
-
-    if (element.tagName !== 'INPUT') {
-      e.stopPropagation();
-    }
-  };
-
+  (0, _react.useEffect)(function () {
+    var handleRepeatClick = function handleRepeatClick(e) {
+      var element = e.target;
+
+      if (element.tagName !== 'INPUT') {
+        e.stopPropagation();
+      }
+    };
+
+    var radioRef = mergedRef;
+    radioRef.current.addEventListener('click', handleRepeatClick);
+    return function () {
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+      radioRef.current.removeEventListener('click', handleRepeatClick);
+    };
+  }, []);
   return (
     /*#__PURE__*/
     // eslint-disable-next-line
-    React.createElement("label", {
+    _react.default.createElement("label", {
       className: classString,
       style: style,
-      ref: mergedRef,
-      onClick: handleRepeatClick
-    }, /*#__PURE__*/React.createElement("input", (0, _extends2.default)({
+      ref: mergedRef
+    }, /*#__PURE__*/_react.default.createElement("input", (0, _extends2.default)({
       type: "radio",
       className: "".concat(radioPrefixCls, "-input")
-    }, radioProps)), children !== undefined ? /*#__PURE__*/React.createElement("span", {
+    }, radioProps)), children !== undefined ? /*#__PURE__*/_react.default.createElement("span", {
       className: "".concat(radioPrefixCls, "-text")
     }, children) : null)
   );
 };
 
-var Radio = /*#__PURE__*/React.forwardRef(InternalRadio);
+var Radio = /*#__PURE__*/_react.default.forwardRef(InternalRadio);
+
 Radio.displayName = 'Radio';
 var _default = Radio;
 exports.default = _default;