@alicloud/console-base-rc-side-panel 1.1.1 → 1.1.3-beta.0

package/build/cjs/model/provider/index.js

@@ -14,7 +14,7 @@ var _reducer = _interopRequireDefault(require("../reducer"));
 var _context = _interopRequireDefault(require("../context"));
 var _lifecycle = _interopRequireDefault(require("../lifecycle"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function Provider(_ref) {
   var props = _ref.props,
     children = _ref.children;

package/build/cjs/ui/index.js

@@ -15,7 +15,7 @@ var _const = require("./const");
 var _rc = require("./rc");
 var _rcContainer = require("./rc-container");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var ScAside = _styledComponents.default.aside.withConfig({
   componentId: "sc-1ok6knf-0"
 })(["display:flex;flex-direction:column;position:fixed;top:0;right:0;bottom:0;z-index:", ";padding:", "px 0 ", "px 0;width:", "px;transition:transform ease-in-out 250ms;", " ", " .theme-dark &{box-shadow:inset 1px 0 0 0 rgba(255,255,255,0.1),-4px 0 8px 0 rgba(0,0,0,0.3);}", " .hasTopbar &{top:", "px;}"], _consoleBaseTheme.Z_INDEX.SIDE_PANEL, _const.SPACING_Y * 1.5, _const.SIZE_BUTTON_WRAP_HEIGHT + _const.SPACING_Y, _consoleBaseTheme.SIZE.WIDTH_SIDE_PANEL, _consoleBaseTheme.mixinBgPrimary, _consoleBaseTheme.mixinShadowLLeft, function (props) {

package/build/cjs/ui/rc/index.js

@@ -22,12 +22,6 @@ Object.defineProperty(exports, "SidePanelItemButton", {
     return _sidePanelItemButton.default;
   }
 });
-Object.defineProperty(exports, "SidePanelItemTooltip", {
-  enumerable: true,
-  get: function get() {
-    return _sidePanelItemTooltip.default;
-  }
-});
 Object.defineProperty(exports, "SidePanelItemWrap", {
   enumerable: true,
   get: function get() {
@@ -37,5 +31,4 @@ Object.defineProperty(exports, "SidePanelItemWrap", {
 var _globalStyleOnBody = _interopRequireDefault(require("./global-style-on-body"));
 var _sidePanelItemWrap = _interopRequireDefault(require("./side-panel-item-wrap"));
 var _sidePanelItemButton = _interopRequireDefault(require("./side-panel-item-button"));
-var _sidePanelItemBadge = _interopRequireDefault(require("./side-panel-item-badge"));
-var _sidePanelItemTooltip = _interopRequireDefault(require("./side-panel-item-tooltip"));
+var _sidePanelItemBadge = _interopRequireDefault(require("./side-panel-item-badge"));

package/build/cjs/ui/rc/side-panel-item-badge/index.js

@@ -11,7 +11,7 @@ var _styledComponents = _interopRequireWildcard(require("styled-components"));
 var _consoleBaseThemeScBase = require("@alicloud/console-base-theme-sc-base");
 var _consoleBaseRcMarks = _interopRequireDefault(require("@alicloud/console-base-rc-marks"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var ScUnreadDot = (0, _styledComponents.default)(_consoleBaseThemeScBase.BadgeBaseDot).withConfig({
   componentId: "sc-1isvxe9-0"
 })(["top:8px;", ""], function (props) {

package/build/cjs/ui/rc/side-panel-item-button/index.js

@@ -15,7 +15,7 @@ var _consoleBaseRcButton = _interopRequireWildcard(require("@alicloud/console-ba
 var _const = require("../../const");
 var _excluded = ["title", "onlyShowIcon"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 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) { (0, _defineProperty2.default)(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; }
 var ScButton = (0, _styledComponents.default)(_consoleBaseRcButton.default).withConfig({

package/build/cjs/ui/rc-container/collapse-toggle/index.js

@@ -10,14 +10,14 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _react = _interopRequireWildcard(require("react"));
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 var _consoleBaseTheme = require("@alicloud/console-base-theme");
-var _reactHookMouseHover = _interopRequireDefault(require("@alicloud/react-hook-mouse-hover"));
 var _consoleBaseRcIcon = _interopRequireDefault(require("@alicloud/console-base-rc-icon"));
+var _consoleBaseRcTooltip = require("@alicloud/console-base-rc-tooltip");
+var _rc = require("../../rc");
+var _model = require("../../../model");
 var _const = require("../../const");
 var _intl = _interopRequireDefault(require("../../intl"));
-var _model = require("../../../model");
-var _rc = require("../../rc");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 var ScCollapseToggle = (0, _styledComponents.default)(_rc.SidePanelItemWrap).withConfig({
   componentId: "sc-15z8r94-0"
 })(["position:absolute;right:0;bottom:", "px;", ""], _const.SPACING_Y, function (props) {
@@ -31,36 +31,40 @@ var ScCollapseToggleButton = (0, _styledComponents.default)(_rc.SidePanelItemBut
 })(["", " ", ""], function (props) {
   return props.active ? (0, _styledComponents.css)(["", " ", " &:hover{", " ", "}"], _consoleBaseTheme.mixinBgAccent, _consoleBaseTheme.mixinTextWhite, _consoleBaseTheme.mixinBgAccent, _consoleBaseTheme.mixinTextWhite) : null;
 }, function (props) {
-  return props.collapsed && !props.hovered ? (0, _styledComponents.css)(["padding-left:4px;;text-align:left;"]) : null;
+  return props.collapsed && !props.hovered ? (0, _styledComponents.css)(["padding-left:4px;text-align:left;"]) : null;
 });
 function PanelToggle() {
-  var _useState = (0, _react.useState)(false),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    stateHovered = _useState2[0],
-    setStateHovered = _useState2[1];
   var collapsed = (0, _model.useCollapsed)();
   var unread = (0, _model.useItemsTop)().some(function (v) {
     return v.unread;
   });
   var handleToggleCollapsed = (0, _model.useHandleCollapsedChange)();
-  var _useMouseHover = (0, _reactHookMouseHover.default)({
-      onEnter: (0, _react.useCallback)(function () {
-        setStateHovered(true);
-      }, [setStateHovered]),
-      onLeave: (0, _react.useCallback)(function () {
-        setStateHovered(false);
-      }, [setStateHovered])
-    }),
-    _useMouseHover2 = (0, _slicedToArray2.default)(_useMouseHover, 2),
-    handleMouseEnter = _useMouseHover2[0],
-    handleMouseLeave = _useMouseHover2[1];
+  var _useState = (0, _react.useState)(false),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    isHovered = _useState2[0],
+    setIsHovered = _useState2[1];
   var title = (0, _intl.default)(collapsed ? 'op:toggle_visible' : 'op:toggle_hidden');
   return /*#__PURE__*/_react.default.createElement(ScCollapseToggle, {
-    hovered: stateHovered,
+    hovered: isHovered,
     collapsed: collapsed,
-    onMouseLeave: handleMouseLeave
-  }, /*#__PURE__*/_react.default.createElement(ScCollapseToggleButton, {
-    hovered: stateHovered,
+    onMouseEnter: function onMouseEnter() {
+      return setIsHovered(true);
+    },
+    onMouseLeave: function onMouseLeave() {
+      return setIsHovered(false);
+    }
+  }, /*#__PURE__*/_react.default.createElement(_consoleBaseRcTooltip.TooltipV1, {
+    title: title,
+    placement: "left",
+    mouseEnterDelay: collapsed ? 200 : 0 // 收起状态下 hover 时，需等待动画结束后再显示提示框，避免位置错误
+    ,
+    destroyTooltipOnHide: true,
+    fixed: true,
+    overlayStyle: {
+      transform: 'translateX(-10px)'
+    }
+  }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(ScCollapseToggleButton, {
+    hovered: isHovered,
     collapsed: collapsed,
     active: collapsed,
     title: title,
@@ -68,13 +72,9 @@ function PanelToggle() {
       type: "angle-right",
       rotate: collapsed ? 180 : undefined
     }),
-    onMouseEnter: handleMouseEnter,
     onClick: handleToggleCollapsed
-  }), collapsed && unread ? /*#__PURE__*/_react.default.createElement(_rc.SidePanelItemBadge, {
+  }))), collapsed && unread ? /*#__PURE__*/_react.default.createElement(_rc.SidePanelItemBadge, {
     unread: true,
-    alignLeft: !stateHovered
-  }) : null, /*#__PURE__*/_react.default.createElement(_rc.SidePanelItemTooltip, {
-    visible: stateHovered,
-    content: title
-  }));
+    alignLeft: !isHovered
+  }) : null);
 }

package/build/cjs/ui/rc-container/item/index.js

@@ -6,101 +6,56 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = Item;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
-var _reactHookMouseHover = _interopRequireDefault(require("@alicloud/react-hook-mouse-hover"));
-var _consoleBaseRcHtmlTrusted = _interopRequireDefault(require("@alicloud/console-base-rc-html-trusted"));
 var _consoleBaseRcEasyIcon = require("@alicloud/console-base-rc-easy-icon");
+var _consoleBaseRcTooltip = require("@alicloud/console-base-rc-tooltip");
 var _model = require("../../../model");
-var _util = require("../../util");
 var _rc = require("../../rc");
-var _excluded = ["id", "className", "style", "active", "title", "titleActive", "icon", "iconHovered", "iconActive", "iconActiveHovered", "unread", "mark", "tooltip", "tooltipActive", "tooltipAsHtml", "tooltipAlign", "tooltipDefaultVisible", "onClick", "onActiveChange", "onMouseEnter", "onMouseLeave"];
+var _excluded = ["id", "className", "style", "active", "title", "icon", "unread", "mark", "tooltip", "tooltipOptions", "onlyShowIcon", "onClick", "onActiveChange"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-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) { (0, _defineProperty2.default)(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 _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function Item(_ref) {
   var id = _ref.id,
     className = _ref.className,
     style = _ref.style,
     active = _ref.active,
     title = _ref.title,
-    titleActive = _ref.titleActive,
     icon = _ref.icon,
-    iconHovered = _ref.iconHovered,
-    iconActive = _ref.iconActive,
-    iconActiveHovered = _ref.iconActiveHovered,
     unread = _ref.unread,
     mark = _ref.mark,
     tooltip = _ref.tooltip,
-    tooltipActive = _ref.tooltipActive,
-    tooltipAsHtml = _ref.tooltipAsHtml,
-    tooltipAlign = _ref.tooltipAlign,
-    _ref$tooltipDefaultVi = _ref.tooltipDefaultVisible,
-    tooltipDefaultVisible = _ref$tooltipDefaultVi === void 0 ? false : _ref$tooltipDefaultVi,
+    tooltipOptions = _ref.tooltipOptions,
+    onlyShowIcon = _ref.onlyShowIcon,
     onClick = _ref.onClick,
     onActiveChange = _ref.onActiveChange,
-    onMouseEnter = _ref.onMouseEnter,
-    onMouseLeave = _ref.onMouseLeave,
-    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var collapsed = (0, _model.useCollapsed)();
-  var _useState = (0, _react.useState)(tooltipDefaultVisible),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    stateTooltipVisible = _useState2[0],
-    setStateTooltipVisible = _useState2[1];
-  var _useMouseHover = (0, _reactHookMouseHover.default)({
-      onEnter: (0, _react.useCallback)(function () {
-        setStateTooltipVisible(true);
-        onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter();
-      }, [setStateTooltipVisible, onMouseEnter]),
-      onLeave: (0, _react.useCallback)(function () {
-        setStateTooltipVisible(false);
-        onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave();
-      }, [setStateTooltipVisible, onMouseLeave])
-    }),
-    _useMouseHover2 = (0, _slicedToArray2.default)(_useMouseHover, 2),
-    handleMouseEnter = _useMouseHover2[0],
-    handleMouseLeave = _useMouseHover2[1];
   var handleClick = (0, _react.useCallback)(function (e) {
     onClick === null || onClick === void 0 ? void 0 : onClick(e);
     onActiveChange === null || onActiveChange === void 0 ? void 0 : onActiveChange(!active);
   }, [active, onClick, onActiveChange]);
-  var finalTitle = (0, _util.getValueByStatus)({
-    valueNormal: title,
-    valueActive: titleActive
-  }, stateTooltipVisible, active);
-  var finalIcon = (0, _util.getValueByStatus)({
-    valueNormal: icon,
-    valueHovered: iconHovered,
-    valueActive: iconActive,
-    valueActiveHovered: iconActiveHovered
-  }, stateTooltipVisible, active);
-  var finalTooltip = (0, _util.getValueByStatus)({
-    valueNormal: tooltip,
-    valueActive: tooltipActive
-  }, stateTooltipVisible, active);
-  return /*#__PURE__*/_react.default.createElement(_rc.SidePanelItemWrap, {
-    id: id,
-    className: className,
-    style: style,
-    onMouseLeave: handleMouseLeave
-  }, /*#__PURE__*/_react.default.createElement(_rc.SidePanelItemButton, _objectSpread(_objectSpread({}, props), {}, {
-    active: active,
-    title: title,
-    label: (0, _consoleBaseRcEasyIcon.renderEasyIcon)(finalIcon) || title,
-    onMouseEnter: handleMouseEnter,
-    onClick: handleClick
-  })), /*#__PURE__*/_react.default.createElement(_rc.SidePanelItemBadge, {
-    unread: unread,
-    mark: mark
-  }), finalTooltip || finalTitle ? /*#__PURE__*/_react.default.createElement(_rc.SidePanelItemTooltip, {
-    visible: stateTooltipVisible && !collapsed,
-    align: tooltipAlign,
-    content: tooltipAsHtml && finalTooltip && typeof finalTooltip === 'string' ? /*#__PURE__*/_react.default.createElement(_consoleBaseRcHtmlTrusted.default, {
-      text: finalTooltip
-    }) : finalTooltip || finalTitle,
-    onMouseEnter: handleMouseEnter
-  }) : null);
+  var renderItem = function renderItem() {
+    return /*#__PURE__*/_react.default.createElement(_rc.SidePanelItemWrap, {
+      id: id,
+      className: className,
+      style: style
+    }, /*#__PURE__*/_react.default.createElement(_rc.SidePanelItemButton, (0, _extends2.default)({
+      active: active,
+      title: title,
+      label: (0, _consoleBaseRcEasyIcon.renderEasyIcon)(icon) || title,
+      onlyShowIcon: onlyShowIcon,
+      onClick: handleClick
+    }, rest)), /*#__PURE__*/_react.default.createElement(_rc.SidePanelItemBadge, {
+      unread: unread,
+      mark: mark
+    }));
+  };
+  return collapsed || !tooltip && !title ? renderItem() : /*#__PURE__*/_react.default.createElement(_consoleBaseRcTooltip.TooltipV1, (0, _extends2.default)({
+    title: tooltip || title,
+    placement: "left",
+    destroyTooltipOnHide: true,
+    fixed: true
+  }, tooltipOptions), renderItem());
 }

package/build/cjs/ui/rc-container/items-bottom/quick-top/index.js

@@ -1,50 +1,29 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = QuickTop;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactHookMouseHover = _interopRequireDefault(require("@alicloud/react-hook-mouse-hover"));
+var _react = _interopRequireDefault(require("react"));
 var _consoleBaseRcIcon = _interopRequireDefault(require("@alicloud/console-base-rc-icon"));
 var _model = require("../../../../model");
 var _intl = _interopRequireDefault(require("../../../intl"));
 var _rc = require("../../../rc");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var _consoleBaseRcTooltip = require("@alicloud/console-base-rc-tooltip");
 function QuickTop() {
   var handleGoTop = (0, _model.useHandleGoTop)();
-  var _useState = (0, _react.useState)(false),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    stateHovered = _useState2[0],
-    setStateHovered = _useState2[1];
-  var _useMouseHover = (0, _reactHookMouseHover.default)({
-      onEnter: (0, _react.useCallback)(function () {
-        setStateHovered(true);
-      }, [setStateHovered]),
-      onLeave: (0, _react.useCallback)(function () {
-        setStateHovered(false);
-      }, [setStateHovered])
-    }),
-    _useMouseHover2 = (0, _slicedToArray2.default)(_useMouseHover, 2),
-    handleMouseEnter = _useMouseHover2[0],
-    handleMouseLeave = _useMouseHover2[1];
   var title = (0, _intl.default)('op:back_to_top');
-  return /*#__PURE__*/_react.default.createElement(_rc.SidePanelItemWrap, {
-    hovered: stateHovered,
-    onMouseLeave: handleMouseLeave
-  }, /*#__PURE__*/_react.default.createElement(_rc.SidePanelItemButton, {
+  return /*#__PURE__*/_react.default.createElement(_consoleBaseRcTooltip.TooltipV1, {
+    title: title,
+    placement: "left",
+    destroyTooltipOnHide: true,
+    fixed: true
+  }, /*#__PURE__*/_react.default.createElement(_rc.SidePanelItemWrap, null, /*#__PURE__*/_react.default.createElement(_rc.SidePanelItemButton, {
     title: title,
     label: /*#__PURE__*/_react.default.createElement(_consoleBaseRcIcon.default, {
       type: "go-top"
     }),
-    onMouseEnter: handleMouseEnter,
     onClick: handleGoTop
-  }), /*#__PURE__*/_react.default.createElement(_rc.SidePanelItemTooltip, {
-    visible: stateHovered,
-    content: title
-  }));
+  })));
 }

package/build/esm/ui/rc/index.js

@@ -1,5 +1,4 @@
 export { default as GlobalStyleOnBody } from './global-style-on-body';
 export { default as SidePanelItemWrap } from './side-panel-item-wrap';
 export { default as SidePanelItemButton } from './side-panel-item-button';
-export { default as SidePanelItemBadge } from './side-panel-item-badge';
-export { default as SidePanelItemTooltip } from './side-panel-item-tooltip';
+export { default as SidePanelItemBadge } from './side-panel-item-badge';

package/build/esm/ui/rc-container/collapse-toggle/index.js

@@ -1,13 +1,13 @@
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import React, { useState, useCallback } from 'react';
+import React, { useState } from 'react';
 import styled, { css } from 'styled-components';
 import { mixinBgAccent, mixinTextWhite } from '@alicloud/console-base-theme';
-import useMouseHover from '@alicloud/react-hook-mouse-hover';
 import Icon from '@alicloud/console-base-rc-icon';
+import { TooltipV1 } from '@alicloud/console-base-rc-tooltip';
+import { SidePanelItemWrap, SidePanelItemButton, SidePanelItemBadge } from '../../rc';
+import { useCollapsed, useItemsTop, useHandleCollapsedChange } from '../../../model';
 import { SPACING_Y } from '../../const';
 import intl from '../../intl';
-import { useCollapsed, useItemsTop, useHandleCollapsedChange } from '../../../model';
-import { SidePanelItemWrap, SidePanelItemButton, SidePanelItemBadge, SidePanelItemTooltip } from '../../rc';
 var ScCollapseToggle = styled(SidePanelItemWrap).withConfig({
   componentId: "sc-15z8r94-0"
 })(["position:absolute;right:0;bottom:", "px;", ""], SPACING_Y, function (props) {
@@ -21,36 +21,40 @@ var ScCollapseToggleButton = styled(SidePanelItemButton).withConfig({
 })(["", " ", ""], function (props) {
   return props.active ? css(["", " ", " &:hover{", " ", "}"], mixinBgAccent, mixinTextWhite, mixinBgAccent, mixinTextWhite) : null;
 }, function (props) {
-  return props.collapsed && !props.hovered ? css(["padding-left:4px;;text-align:left;"]) : null;
+  return props.collapsed && !props.hovered ? css(["padding-left:4px;text-align:left;"]) : null;
 });
 export default function PanelToggle() {
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    stateHovered = _useState2[0],
-    setStateHovered = _useState2[1];
   var collapsed = useCollapsed();
   var unread = useItemsTop().some(function (v) {
     return v.unread;
   });
   var handleToggleCollapsed = useHandleCollapsedChange();
-  var _useMouseHover = useMouseHover({
-      onEnter: useCallback(function () {
-        setStateHovered(true);
-      }, [setStateHovered]),
-      onLeave: useCallback(function () {
-        setStateHovered(false);
-      }, [setStateHovered])
-    }),
-    _useMouseHover2 = _slicedToArray(_useMouseHover, 2),
-    handleMouseEnter = _useMouseHover2[0],
-    handleMouseLeave = _useMouseHover2[1];
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    isHovered = _useState2[0],
+    setIsHovered = _useState2[1];
   var title = intl(collapsed ? 'op:toggle_visible' : 'op:toggle_hidden');
   return /*#__PURE__*/React.createElement(ScCollapseToggle, {
-    hovered: stateHovered,
+    hovered: isHovered,
     collapsed: collapsed,
-    onMouseLeave: handleMouseLeave
-  }, /*#__PURE__*/React.createElement(ScCollapseToggleButton, {
-    hovered: stateHovered,
+    onMouseEnter: function onMouseEnter() {
+      return setIsHovered(true);
+    },
+    onMouseLeave: function onMouseLeave() {
+      return setIsHovered(false);
+    }
+  }, /*#__PURE__*/React.createElement(TooltipV1, {
+    title: title,
+    placement: "left",
+    mouseEnterDelay: collapsed ? 200 : 0 // 收起状态下 hover 时，需等待动画结束后再显示提示框，避免位置错误
+    ,
+    destroyTooltipOnHide: true,
+    fixed: true,
+    overlayStyle: {
+      transform: 'translateX(-10px)'
+    }
+  }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(ScCollapseToggleButton, {
+    hovered: isHovered,
     collapsed: collapsed,
     active: collapsed,
     title: title,
@@ -58,13 +62,9 @@ export default function PanelToggle() {
       type: "angle-right",
       rotate: collapsed ? 180 : undefined
     }),
-    onMouseEnter: handleMouseEnter,
     onClick: handleToggleCollapsed
-  }), collapsed && unread ? /*#__PURE__*/React.createElement(SidePanelItemBadge, {
+  }))), collapsed && unread ? /*#__PURE__*/React.createElement(SidePanelItemBadge, {
     unread: true,
-    alignLeft: !stateHovered
-  }) : null, /*#__PURE__*/React.createElement(SidePanelItemTooltip, {
-    visible: stateHovered,
-    content: title
-  }));
+    alignLeft: !isHovered
+  }) : null);
 }

package/build/esm/ui/rc-container/item/index.js

@@ -1,96 +1,51 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["id", "className", "style", "active", "title", "titleActive", "icon", "iconHovered", "iconActive", "iconActiveHovered", "unread", "mark", "tooltip", "tooltipActive", "tooltipAsHtml", "tooltipAlign", "tooltipDefaultVisible", "onClick", "onActiveChange", "onMouseEnter", "onMouseLeave"];
-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; }
-import React, { useState, useCallback } from 'react';
-import useMouseHover from '@alicloud/react-hook-mouse-hover';
-import HtmlTrusted from '@alicloud/console-base-rc-html-trusted';
+var _excluded = ["id", "className", "style", "active", "title", "icon", "unread", "mark", "tooltip", "tooltipOptions", "onlyShowIcon", "onClick", "onActiveChange"];
+import React, { useCallback } from 'react';
 import { renderEasyIcon } from '@alicloud/console-base-rc-easy-icon';
+import { TooltipV1 } from '@alicloud/console-base-rc-tooltip';
 import { useCollapsed } from '../../../model';
-import { getValueByStatus } from '../../util';
-import { SidePanelItemWrap, SidePanelItemButton, SidePanelItemBadge, SidePanelItemTooltip } from '../../rc';
+import { SidePanelItemWrap, SidePanelItemButton, SidePanelItemBadge } from '../../rc';
 export default function Item(_ref) {
   var id = _ref.id,
     className = _ref.className,
     style = _ref.style,
     active = _ref.active,
     title = _ref.title,
-    titleActive = _ref.titleActive,
     icon = _ref.icon,
-    iconHovered = _ref.iconHovered,
-    iconActive = _ref.iconActive,
-    iconActiveHovered = _ref.iconActiveHovered,
     unread = _ref.unread,
     mark = _ref.mark,
     tooltip = _ref.tooltip,
-    tooltipActive = _ref.tooltipActive,
-    tooltipAsHtml = _ref.tooltipAsHtml,
-    tooltipAlign = _ref.tooltipAlign,
-    _ref$tooltipDefaultVi = _ref.tooltipDefaultVisible,
-    tooltipDefaultVisible = _ref$tooltipDefaultVi === void 0 ? false : _ref$tooltipDefaultVi,
+    tooltipOptions = _ref.tooltipOptions,
+    onlyShowIcon = _ref.onlyShowIcon,
     onClick = _ref.onClick,
     onActiveChange = _ref.onActiveChange,
-    onMouseEnter = _ref.onMouseEnter,
-    onMouseLeave = _ref.onMouseLeave,
-    props = _objectWithoutProperties(_ref, _excluded);
+    rest = _objectWithoutProperties(_ref, _excluded);
   var collapsed = useCollapsed();
-  var _useState = useState(tooltipDefaultVisible),
-    _useState2 = _slicedToArray(_useState, 2),
-    stateTooltipVisible = _useState2[0],
-    setStateTooltipVisible = _useState2[1];
-  var _useMouseHover = useMouseHover({
-      onEnter: useCallback(function () {
-        setStateTooltipVisible(true);
-        onMouseEnter === null || onMouseEnter === void 0 ? void 0 : onMouseEnter();
-      }, [setStateTooltipVisible, onMouseEnter]),
-      onLeave: useCallback(function () {
-        setStateTooltipVisible(false);
-        onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave();
-      }, [setStateTooltipVisible, onMouseLeave])
-    }),
-    _useMouseHover2 = _slicedToArray(_useMouseHover, 2),
-    handleMouseEnter = _useMouseHover2[0],
-    handleMouseLeave = _useMouseHover2[1];
   var handleClick = useCallback(function (e) {
     onClick === null || onClick === void 0 ? void 0 : onClick(e);
     onActiveChange === null || onActiveChange === void 0 ? void 0 : onActiveChange(!active);
   }, [active, onClick, onActiveChange]);
-  var finalTitle = getValueByStatus({
-    valueNormal: title,
-    valueActive: titleActive
-  }, stateTooltipVisible, active);
-  var finalIcon = getValueByStatus({
-    valueNormal: icon,
-    valueHovered: iconHovered,
-    valueActive: iconActive,
-    valueActiveHovered: iconActiveHovered
-  }, stateTooltipVisible, active);
-  var finalTooltip = getValueByStatus({
-    valueNormal: tooltip,
-    valueActive: tooltipActive
-  }, stateTooltipVisible, active);
-  return /*#__PURE__*/React.createElement(SidePanelItemWrap, {
-    id: id,
-    className: className,
-    style: style,
-    onMouseLeave: handleMouseLeave
-  }, /*#__PURE__*/React.createElement(SidePanelItemButton, _objectSpread(_objectSpread({}, props), {}, {
-    active: active,
-    title: title,
-    label: renderEasyIcon(finalIcon) || title,
-    onMouseEnter: handleMouseEnter,
-    onClick: handleClick
-  })), /*#__PURE__*/React.createElement(SidePanelItemBadge, {
-    unread: unread,
-    mark: mark
-  }), finalTooltip || finalTitle ? /*#__PURE__*/React.createElement(SidePanelItemTooltip, {
-    visible: stateTooltipVisible && !collapsed,
-    align: tooltipAlign,
-    content: tooltipAsHtml && finalTooltip && typeof finalTooltip === 'string' ? /*#__PURE__*/React.createElement(HtmlTrusted, {
-      text: finalTooltip
-    }) : finalTooltip || finalTitle,
-    onMouseEnter: handleMouseEnter
-  }) : null);
+  var renderItem = function renderItem() {
+    return /*#__PURE__*/React.createElement(SidePanelItemWrap, {
+      id: id,
+      className: className,
+      style: style
+    }, /*#__PURE__*/React.createElement(SidePanelItemButton, _extends({
+      active: active,
+      title: title,
+      label: renderEasyIcon(icon) || title,
+      onlyShowIcon: onlyShowIcon,
+      onClick: handleClick
+    }, rest)), /*#__PURE__*/React.createElement(SidePanelItemBadge, {
+      unread: unread,
+      mark: mark
+    }));
+  };
+  return collapsed || !tooltip && !title ? renderItem() : /*#__PURE__*/React.createElement(TooltipV1, _extends({
+    title: tooltip || title,
+    placement: "left",
+    destroyTooltipOnHide: true,
+    fixed: true
+  }, tooltipOptions), renderItem());
 }

package/build/esm/ui/rc-container/items-bottom/quick-top/index.js

@@ -1,40 +1,22 @@
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import React, { useState, useCallback } from 'react';
-import useMouseHover from '@alicloud/react-hook-mouse-hover';
+import React from 'react';
 import Icon from '@alicloud/console-base-rc-icon';
 import { useHandleGoTop } from '../../../../model';
 import intl from '../../../intl';
-import { SidePanelItemWrap, SidePanelItemButton, SidePanelItemTooltip } from '../../../rc';
+import { SidePanelItemWrap, SidePanelItemButton } from '../../../rc';
+import { TooltipV1 } from '@alicloud/console-base-rc-tooltip';
 export default function QuickTop() {
   var handleGoTop = useHandleGoTop();
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    stateHovered = _useState2[0],
-    setStateHovered = _useState2[1];
-  var _useMouseHover = useMouseHover({
-      onEnter: useCallback(function () {
-        setStateHovered(true);
-      }, [setStateHovered]),
-      onLeave: useCallback(function () {
-        setStateHovered(false);
-      }, [setStateHovered])
-    }),
-    _useMouseHover2 = _slicedToArray(_useMouseHover, 2),
-    handleMouseEnter = _useMouseHover2[0],
-    handleMouseLeave = _useMouseHover2[1];
   var title = intl('op:back_to_top');
-  return /*#__PURE__*/React.createElement(SidePanelItemWrap, {
-    hovered: stateHovered,
-    onMouseLeave: handleMouseLeave
-  }, /*#__PURE__*/React.createElement(SidePanelItemButton, {
+  return /*#__PURE__*/React.createElement(TooltipV1, {
+    title: title,
+    placement: "left",
+    destroyTooltipOnHide: true,
+    fixed: true
+  }, /*#__PURE__*/React.createElement(SidePanelItemWrap, null, /*#__PURE__*/React.createElement(SidePanelItemButton, {
     title: title,
     label: /*#__PURE__*/React.createElement(Icon, {
       type: "go-top"
     }),
-    onMouseEnter: handleMouseEnter,
     onClick: handleGoTop
-  }), /*#__PURE__*/React.createElement(SidePanelItemTooltip, {
-    visible: stateHovered,
-    content: title
-  }));
+  })));
 }

package/build/types/model/types/common.d.ts

@@ -1,15 +1,12 @@
-import { ReactElement } from 'react';
+/// <reference types="react" />
 import { ButtonProps } from '@alicloud/console-base-rc-button';
 import { EasyIconValue } from '@alicloud/console-base-rc-easy-icon';
+import { TooltipPropsV1 } from '@alicloud/console-base-rc-tooltip';
 export interface ISidePanelItemProps extends Omit<ButtonProps, 'label' | 'size' | 'theme' | 'iconLeft' | 'iconRight' | 'onMouseEnter' | 'onMouseLeave'> {
     /**
      * 默认用于 tooltip，也是按钮 aria-label 属性
      */
     title: string;
-    /**
-     * 按下状态的 title，不填则 fallback 到 title
-     */
-    titleActive?: string;
     /**
      * 图标（请尽可能用正方形），如果是组件则直接用，当它是字符串的时候，会智能判断
      */
@@ -17,39 +14,15 @@ export interface ISidePanelItemProps extends Omit<ButtonProps, 'label' | 'size'
     /**
      * 只显示图标，不需要背景
      */
-    onlyShowIcon: boolean;
-    /**
-     * 鼠标 hover 时的图标，不填则 fallback 到 icon
-     */
-    iconHovered?: EasyIconValue;
-    /**
-     * 按下状态的图标，不填则 fallback 到 icon
-     */
-    iconActive?: EasyIconValue;
-    /**
-     * 按下状态时 hover 的图标，不填则 fallback 到 iconActive
-     */
-    iconActiveHovered?: EasyIconValue;
+    onlyShowIcon?: boolean;
     /**
      * 当需要复杂的 tooltip 时，可以用这个 prop
      */
-    tooltip?: string | ReactElement;
-    /**
-     * 按下状态的 tooltip，不填则 fallback 到 tooltip
-     */
-    tooltipActive?: string | ReactElement;
-    /**
-     * 当 Tooltip 没有条件用 JSX，必须是字符串但又需要展示成 HTML 时，可以用 `tooltipAsHtml: true`
-     */
-    tooltipAsHtml?: boolean;
-    /**
-     * Tooltip 与按钮的上下对齐方式，默认为 middle
-     */
-    tooltipAlign?: 'top' | 'middle' | 'bottom';
+    tooltip?: string | React.ReactElement;
     /**
-     * Tooltip 默认是否展示，注意避免竞争，并注意降噪
+     * tooltip 的配置
      */
-    tooltipDefaultVisible?: boolean;
+    tooltipOptions?: TooltipPropsV1;
     /**
      * 右上角徽标，数字展示数字，true 展示小红点
      */

package/build/types/ui/rc/index.d.ts

@@ -2,4 +2,3 @@ export { default as GlobalStyleOnBody } from './global-style-on-body';
 export { default as SidePanelItemWrap } from './side-panel-item-wrap';
 export { default as SidePanelItemButton } from './side-panel-item-button';
 export { default as SidePanelItemBadge } from './side-panel-item-badge';
-export { default as SidePanelItemTooltip } from './side-panel-item-tooltip';

package/build/types/ui/rc-container/item/index.d.ts

@@ -1,6 +1,3 @@
 /// <reference types="react" />
 import { SidePanelItemProps } from '../../../model';
-interface IProps extends SidePanelItemProps {
-}
-export default function Item({ id, className, style, active, title, titleActive, icon, iconHovered, iconActive, iconActiveHovered, unread, mark, tooltip, tooltipActive, tooltipAsHtml, tooltipAlign, tooltipDefaultVisible, onClick, onActiveChange, onMouseEnter, onMouseLeave, ...props }: IProps): JSX.Element;
-export {};
+export default function Item({ id, className, style, active, title, icon, unread, mark, tooltip, tooltipOptions, onlyShowIcon, onClick, onActiveChange, ...rest }: SidePanelItemProps): JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alicloud/console-base-rc-side-panel",
-  "version": "1.1.1",
+  "version": "1.1.3-beta.0",
   "description": "ConsoleBase 组件 - 右侧边栏",
   "license": "MIT",
   "sideEffects": false,
@@ -40,7 +40,7 @@
     "@alicloud/console-base-rc-html-trusted": "^1.0.5",
     "@alicloud/console-base-rc-icon": "^1.10.6",
     "@alicloud/console-base-rc-marks": "^1.8.3",
-    "@alicloud/console-base-rc-tooltip": "^1.1.12",
+    "@alicloud/console-base-rc-tooltip": "1.1.13-beta.1",
     "@alicloud/console-base-theme": "^1.9.7",
     "@alicloud/console-base-theme-sc-base": "^1.6.4",
     "@alicloud/mere-dom": "^1.8.0",

package/build/cjs/ui/rc/side-panel-item-tooltip/index.js

@@ -1,58 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = SidePanelItemTooltip;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = _interopRequireDefault(require("react"));
-var _styledComponents = _interopRequireWildcard(require("styled-components"));
-var _consoleBaseTheme = require("@alicloud/console-base-theme");
-var _consoleBaseRcTooltip = _interopRequireWildcard(require("@alicloud/console-base-rc-tooltip"));
-var _const = require("../../const");
-var _excluded = ["visible", "align", "content"];
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-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) { (0, _defineProperty2.default)(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; }
-var ScTooltip = (0, _styledComponents.default)(_consoleBaseRcTooltip.default).withConfig({
-  componentId: "sc-11m2ouk-0"
-})(["right:", "px;", " img{max-width:100%;}"], _consoleBaseTheme.SIZE.WIDTH_SIDE_PANEL - 4, function (props) {
-  switch (props.placement) {
-    case _consoleBaseRcTooltip.TooltipPlacement.LEFT_TOP:
-      return (0, _styledComponents.css)(["top:0;"]);
-    case _consoleBaseRcTooltip.TooltipPlacement.LEFT_BOTTOM:
-      return (0, _styledComponents.css)(["bottom:0;"]);
-    default:
-      return (0, _styledComponents.css)(["bottom:", "px;transform:translateY(50%);"], _const.SIZE_BUTTON_WRAP_HEIGHT * 0.5);
-  }
-});
-function getPlacement(align) {
-  switch (align) {
-    case 'top':
-      return _consoleBaseRcTooltip.TooltipPlacement.LEFT_TOP;
-    case 'bottom':
-      return _consoleBaseRcTooltip.TooltipPlacement.LEFT_BOTTOM;
-    default:
-      return _consoleBaseRcTooltip.TooltipPlacement.LEFT;
-  }
-}
-
-/**
- * 工具按钮之外的部分（如果不是 tooltip 则期望它是 createPortal 出去的）
- */
-function SidePanelItemTooltip(_ref) {
-  var visible = _ref.visible,
-    align = _ref.align,
-    content = _ref.content,
-    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  return /*#__PURE__*/_react.default.createElement(ScTooltip, _objectSpread({
-    visible: visible,
-    placement: getPlacement(align),
-    arrowOffset: _const.SIZE_BUTTON_WRAP_HEIGHT * 0.5,
-    content: content
-  }, props));
-}

package/build/esm/ui/rc/side-panel-item-tooltip/index.js

@@ -1,48 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["visible", "align", "content"];
-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; }
-import React from 'react';
-import styled, { css } from 'styled-components';
-import { SIZE } from '@alicloud/console-base-theme';
-import Tooltip, { TooltipPlacement } from '@alicloud/console-base-rc-tooltip';
-import { SIZE_BUTTON_WRAP_HEIGHT } from '../../const';
-var ScTooltip = styled(Tooltip).withConfig({
-  componentId: "sc-11m2ouk-0"
-})(["right:", "px;", " img{max-width:100%;}"], SIZE.WIDTH_SIDE_PANEL - 4, function (props) {
-  switch (props.placement) {
-    case TooltipPlacement.LEFT_TOP:
-      return css(["top:0;"]);
-    case TooltipPlacement.LEFT_BOTTOM:
-      return css(["bottom:0;"]);
-    default:
-      return css(["bottom:", "px;transform:translateY(50%);"], SIZE_BUTTON_WRAP_HEIGHT * 0.5);
-  }
-});
-function getPlacement(align) {
-  switch (align) {
-    case 'top':
-      return TooltipPlacement.LEFT_TOP;
-    case 'bottom':
-      return TooltipPlacement.LEFT_BOTTOM;
-    default:
-      return TooltipPlacement.LEFT;
-  }
-}
-
-/**
- * 工具按钮之外的部分（如果不是 tooltip 则期望它是 createPortal 出去的）
- */
-export default function SidePanelItemTooltip(_ref) {
-  var visible = _ref.visible,
-    align = _ref.align,
-    content = _ref.content,
-    props = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement(ScTooltip, _objectSpread({
-    visible: visible,
-    placement: getPlacement(align),
-    arrowOffset: SIZE_BUTTON_WRAP_HEIGHT * 0.5,
-    content: content
-  }, props));
-}

package/build/types/ui/rc/side-panel-item-tooltip/index.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-import { TooltipProps } from '@alicloud/console-base-rc-tooltip';
-import { SidePanelItemProps } from '../../../model';
-interface IProps extends Omit<TooltipProps, 'placement' | 'arrowOffset'> {
-    align?: SidePanelItemProps['tooltipAlign'];
-}
-/**
- * 工具按钮之外的部分（如果不是 tooltip 则期望它是 createPortal 出去的）
- */
-export default function SidePanelItemTooltip({ visible, align, content, ...props }: IProps): JSX.Element;
-export {};