@luminati-io/uikit 6.3.0 → 6.3.2-beta.0

package/dist/umd/uikit.development.js

@@ -36833,8 +36833,8 @@ __webpack_require__.r(__webpack_exports__);
 
 
 /*jslint react:true*/
-var _excluded = ["text", "variant", "size", "disabled", "loading", "loadingText", "icon", "iconPlacement"],
-  _excluded2 = ["isLeft", "isRight"];
+var _excluded = ["className", "classNamePrefix", "variant", "size", "disabled", "loading", "loadingText", "icon", "iconPlacement", "text", "children"],
+  _excluded2 = ["isLeft", "isRight", "size"];
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
@@ -36847,7 +36847,9 @@ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t =
 
 
 var Button = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwardRef(function (_ref, ref) {
-  var text = _ref.text,
+  var className = _ref.className,
+    _ref$classNamePrefix = _ref.classNamePrefix,
+    classNamePrefix = _ref$classNamePrefix === void 0 ? 'uikit_button' : _ref$classNamePrefix,
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'primary' : _ref$variant,
     _ref$size = _ref.size,
@@ -36859,6 +36861,8 @@ var Button = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwardRe
     icon = _ref.icon,
     _ref$iconPlacement = _ref.iconPlacement,
     iconPlacement = _ref$iconPlacement === void 0 ? 'left' : _ref$iconPlacement,
+    text = _ref.text,
+    children = _ref.children,
     rest = _objectWithoutProperties(_ref, _excluded);
   var _getIconProps = (0,_utils__WEBPACK_IMPORTED_MODULE_6__.getIconProps)('Button', {
       size: size,
@@ -36867,25 +36871,44 @@ var Button = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwardRe
     }),
     isLeft = _getIconProps.isLeft,
     isRight = _getIconProps.isRight,
+    iconSize = _getIconProps.size,
     iconProps = _objectWithoutProperties(_getIconProps, _excluded2);
+  var iconContent = !loading && (isLeft || isRight) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_3__.Icon, _extends({
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(classNamePrefix, {
+      '-icon': true,
+      '-icon-left': isLeft,
+      '-icon-right': isRight
+    }),
+    size: iconSize
+  }, iconProps));
+  var buttonText = loading ? loadingText : text || children;
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(StyledButton, _extends({
     ref: ref
   }, rest, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(null, null, className, classNamePrefix),
     disabled: loading || disabled,
     $variant: variant,
     $size: size,
     $iconPlacement: isLeft || loading ? 'left' : isRight ? 'right' : ''
   }), loading && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_loading_icon__WEBPACK_IMPORTED_MODULE_7__.LoadingIcon, {
-    size: iconProps.size
-  }), isLeft && !loading && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_3__.Icon, iconProps), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_4__.Label, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(classNamePrefix, {
+      '-icon': true,
+      '-icon-loading': true
+    }),
+    size: iconSize
+  }), isLeft && iconContent, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_4__.Label, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(classNamePrefix, {
+      '-text': true
+    }),
     variant: size == 'xs' ? 'sm' : 'lg',
     no_wrap: true,
     "data-label": true
-  }, loading ? loadingText : text), isRight && !loading && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_3__.Icon, iconProps));
+  }, buttonText), isRight && iconContent);
 });
 Button.displayName = 'Button';
 Button.propTypes = {
-  text: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node).isRequired,
+  className: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  classNamePrefix: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
   variant: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['primary', 'secondary', 'negative', 'negative_secondary', 'positive', 'white']),
   size: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['xs', 'sm', 'md', 'lg']),
   icon: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(_utils__WEBPACK_IMPORTED_MODULE_6__.iconNames),
@@ -39282,7 +39305,7 @@ CodeBlock.propTypes = {
 var CodeBlockWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "CodeBlockWrapper",
   componentId: "sc-dgi5hi-0"
-})(["", "{border-top-left-radius:0;border-top-right-radius:0;}"], _code_snippet__WEBPACK_IMPORTED_MODULE_4__.CodeSnipperWrapper);
+})(["", "{border-top-left-radius:0;border-top-right-radius:0;}"], _code_snippet__WEBPACK_IMPORTED_MODULE_4__.CodeSnippetWrapper);
 var CodeBlockHeader = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "CodeBlockHeader",
   componentId: "sc-dgi5hi-1"
@@ -39317,8 +39340,8 @@ var CodeBlockHeader = styled_components__WEBPACK_IMPORTED_MODULE_2___default().d
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   CodeSnipperWrapper: () => (/* binding */ CodeSnipperWrapper),
-/* harmony export */   CodeSnippet: () => (/* binding */ CodeSnippet)
+/* harmony export */   CodeSnippet: () => (/* binding */ CodeSnippet),
+/* harmony export */   CodeSnippetWrapper: () => (/* binding */ CodeSnippetWrapper)
 /* harmony export */ });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
@@ -39355,7 +39378,7 @@ var CodeSnippet = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)
     maxHeight = _ref.maxHeight,
     wrap = _ref.wrap;
   var codeRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(CodeSnipperWrapper, {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(CodeSnippetWrapper, {
     ref: ref,
     className: (0,_util__WEBPACK_IMPORTED_MODULE_3__.classNames)(null, {}, className, variant),
     style: maxHeight ? {
@@ -39392,8 +39415,8 @@ CodeSnippet.propTypes = {
   onCopy: (prop_types__WEBPACK_IMPORTED_MODULE_2___default().func),
   wrap: (prop_types__WEBPACK_IMPORTED_MODULE_2___default().bool)
 };
-var CodeSnipperWrapper = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withConfig({
-  displayName: "CodeSnipperWrapper",
+var CodeSnippetWrapper = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withConfig({
+  displayName: "CodeSnippetWrapper",
   componentId: "sc-13u859f-0"
 })(["position:relative;min-height:48px;display:flex;border-radius:4px;&.black{background-color:", ";}&.white{background-color:", ";}"], function (_ref2) {
   var color = _ref2.theme.color;
@@ -39405,20 +39428,11 @@ var CodeSnipperWrapper = styled_components__WEBPACK_IMPORTED_MODULE_1___default(
 var CodeWrapper = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div.withConfig({
   displayName: "CodeWrapper",
   componentId: "sc-13u859f-1"
-})(["flex:1;padding-top:", ";padding-right:", ";padding-bottom:", ";padding-left:", ";overflow:auto;", ""], function (_ref4) {
+})(["flex:1;padding:", ";overflow:auto;", ""], function (_ref4) {
   var spacing = _ref4.theme.spacing;
-  return spacing['04'];
-}, function (_ref5) {
-  var spacing = _ref5.theme.spacing;
-  return spacing['04'];
-}, function (_ref6) {
-  var spacing = _ref6.theme.spacing;
   return spacing['05'];
-}, function (_ref7) {
-  var spacing = _ref7.theme.spacing;
-  return spacing['04'];
-}, function (_ref8) {
-  var scrollbars = _ref8.theme.scrollbars;
+}, function (_ref5) {
+  var scrollbars = _ref5.theme.scrollbars;
   return scrollbars.auto;
 });
 
@@ -39515,17 +39529,23 @@ var CopyButton = function CopyButton(_ref) {
 var StyledButton = styled_components__WEBPACK_IMPORTED_MODULE_1___default().button.withConfig({
   displayName: "StyledButton",
   componentId: "sc-kvxvoe-0"
-})(["position:absolute;inset-inline-end:16px;bottom:8px;z-index:1;display:flex;padding:8px;align-items:flex-start;border:0 none;border-radius:32px;background:", ";svg{width:16px;height:16px;color:", ";}&:hover,&:active{background:", ";}"], function (_ref2) {
-  var $variant = _ref2.$variant,
-    color = _ref2.theme.color;
-  return $variant == 'white' ? color.code_bg_icon_white : color.code_bg_icon_black;
+})(["position:absolute;inset-inline-end:", ";top:", ";z-index:1;display:flex;padding:8px;align-items:flex-start;border:0 none;border-radius:32px;background:", ";svg{width:16px;height:16px;color:", ";}&:hover,&:active{background:", ";}"], function (_ref2) {
+  var theme = _ref2.theme;
+  return theme.spacing['05'];
 }, function (_ref3) {
-  var $variant = _ref3.$variant,
-    color = _ref3.theme.color;
-  return $variant == 'white' ? color.icon : color.icon_white;
+  var theme = _ref3.theme;
+  return theme.spacing['05'];
 }, function (_ref4) {
   var $variant = _ref4.$variant,
     color = _ref4.theme.color;
+  return $variant == 'white' ? color.code_bg_icon_white : color.code_bg_icon_black;
+}, function (_ref5) {
+  var $variant = _ref5.$variant,
+    color = _ref5.theme.color;
+  return $variant == 'white' ? color.icon : color.icon_white;
+}, function (_ref6) {
+  var $variant = _ref6.$variant,
+    color = _ref6.theme.color;
   return $variant == 'white' ? color.code_bg_icon_white_hover : color.code_bg_icon_black_hover;
 });
 function selectElementText(element) {
@@ -39915,6 +39935,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   Link: () => (/* reexport safe */ _link__WEBPACK_IMPORTED_MODULE_13__.Link),
 /* harmony export */   Menu: () => (/* reexport safe */ _menu__WEBPACK_IMPORTED_MODULE_14__.Menu),
 /* harmony export */   Modal: () => (/* reexport module object */ _modal__WEBPACK_IMPORTED_MODULE_3__),
+/* harmony export */   Popover: () => (/* reexport safe */ _popover__WEBPACK_IMPORTED_MODULE_25__.Popover),
 /* harmony export */   Progress: () => (/* reexport safe */ _progress__WEBPACK_IMPORTED_MODULE_15__.Progress),
 /* harmony export */   ProgressBar: () => (/* reexport safe */ _progress__WEBPACK_IMPORTED_MODULE_15__.ProgressBar),
 /* harmony export */   RemovableTag: () => (/* reexport safe */ _tag__WEBPACK_IMPORTED_MODULE_18__.RemovableTag),
@@ -39923,17 +39944,17 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   Table: () => (/* reexport safe */ _table__WEBPACK_IMPORTED_MODULE_17__.Table),
 /* harmony export */   Tabs: () => (/* reexport safe */ _tab__WEBPACK_IMPORTED_MODULE_23__.Tabs),
 /* harmony export */   TagGroup: () => (/* reexport safe */ _tag__WEBPACK_IMPORTED_MODULE_18__.TagGroup),
-/* harmony export */   ThemeProvider: () => (/* reexport safe */ _themes__WEBPACK_IMPORTED_MODULE_25__.ThemeProvider),
+/* harmony export */   ThemeProvider: () => (/* reexport safe */ _themes__WEBPACK_IMPORTED_MODULE_26__.ThemeProvider),
 /* harmony export */   Toast: () => (/* reexport safe */ _toast__WEBPACK_IMPORTED_MODULE_19__.Toast),
 /* harmony export */   Toaster: () => (/* reexport safe */ _toast__WEBPACK_IMPORTED_MODULE_19__.Toaster),
 /* harmony export */   Tooltip: () => (/* reexport safe */ _tooltip__WEBPACK_IMPORTED_MODULE_24__.Tooltip),
 /* harmony export */   Tooltip2: () => (/* reexport safe */ _tooltip__WEBPACK_IMPORTED_MODULE_24__.Tooltip2),
 /* harmony export */   Typography: () => (/* reexport module object */ _typography__WEBPACK_IMPORTED_MODULE_5__),
-/* harmony export */   globalConfig: () => (/* reexport safe */ _global_config__WEBPACK_IMPORTED_MODULE_26__.globalConfig),
-/* harmony export */   setGlobalConfig: () => (/* reexport safe */ _global_config__WEBPACK_IMPORTED_MODULE_26__.setGlobalConfig),
-/* harmony export */   theme: () => (/* reexport safe */ _themes__WEBPACK_IMPORTED_MODULE_25__.lightTheme),
+/* harmony export */   globalConfig: () => (/* reexport safe */ _global_config__WEBPACK_IMPORTED_MODULE_27__.globalConfig),
+/* harmony export */   setGlobalConfig: () => (/* reexport safe */ _global_config__WEBPACK_IMPORTED_MODULE_27__.setGlobalConfig),
+/* harmony export */   theme: () => (/* reexport safe */ _themes__WEBPACK_IMPORTED_MODULE_26__.lightTheme),
 /* harmony export */   translation: () => (/* reexport safe */ _translation__WEBPACK_IMPORTED_MODULE_4__["default"]),
-/* harmony export */   useTheme: () => (/* reexport safe */ _themes__WEBPACK_IMPORTED_MODULE_25__.useTheme),
+/* harmony export */   useTheme: () => (/* reexport safe */ _themes__WEBPACK_IMPORTED_MODULE_26__.useTheme),
 /* harmony export */   useToaster: () => (/* reexport safe */ _toast__WEBPACK_IMPORTED_MODULE_19__.useToaster),
 /* harmony export */   withPopover: () => (/* reexport safe */ _hoc__WEBPACK_IMPORTED_MODULE_12__.withPopover)
 /* harmony export */ });
@@ -39962,8 +39983,9 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _infochip__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! ./infochip */ "./src/infochip.js");
 /* harmony import */ var _tab__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! ./tab */ "./src/tab/index.js");
 /* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! ./tooltip */ "./src/tooltip/index.js");
-/* harmony import */ var _themes__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ./themes */ "./src/themes/index.js");
-/* harmony import */ var _global_config__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ./global_config */ "./src/global_config.js");
+/* harmony import */ var _popover__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! ./popover */ "./src/popover/index.js");
+/* harmony import */ var _themes__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! ./themes */ "./src/themes/index.js");
+/* harmony import */ var _global_config__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! ./global_config */ "./src/global_config.js");
 // LICENSE_CODE ZON
 
 
@@ -39995,6 +40017,7 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+
 
 
 /***/ }),
@@ -40601,7 +40624,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   useOutsideClick: () => (/* reexport safe */ _use_outside_click__WEBPACK_IMPORTED_MODULE_5__["default"]),
 /* harmony export */   useResize: () => (/* reexport safe */ _use_resize__WEBPACK_IMPORTED_MODULE_6__.useResize),
 /* harmony export */   useScroll: () => (/* reexport safe */ _use_scroll__WEBPACK_IMPORTED_MODULE_7__["default"]),
-/* harmony export */   useWindowSize: () => (/* reexport safe */ _use_window_size__WEBPACK_IMPORTED_MODULE_8__.useWindowSize)
+/* harmony export */   useStateWithEffect: () => (/* reexport safe */ _use_state_with_effect__WEBPACK_IMPORTED_MODULE_8__.useStateWithEffect),
+/* harmony export */   useWindowSize: () => (/* reexport safe */ _use_window_size__WEBPACK_IMPORTED_MODULE_9__.useWindowSize)
 /* harmony export */ });
 /* harmony import */ var _use_debounced_callback__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./use_debounced_callback */ "./src/hooks/use_debounced_callback.js");
 /* harmony import */ var _use_did_update__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./use_did_update */ "./src/hooks/use_did_update.js");
@@ -40611,7 +40635,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _use_outside_click__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./use_outside_click */ "./src/hooks/use_outside_click.js");
 /* harmony import */ var _use_resize__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./use_resize */ "./src/hooks/use_resize.js");
 /* harmony import */ var _use_scroll__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./use_scroll */ "./src/hooks/use_scroll.js");
-/* harmony import */ var _use_window_size__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./use_window_size */ "./src/hooks/use_window_size.js");
+/* harmony import */ var _use_state_with_effect__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./use_state_with_effect */ "./src/hooks/use_state_with_effect.js");
+/* harmony import */ var _use_window_size__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./use_window_size */ "./src/hooks/use_window_size.js");
 // LICENSE_CODE ZON
 
 
@@ -40627,6 +40652,7 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+
 /***/ }),
 
 /***/ "./src/hooks/use_debounced_callback.js":
@@ -40970,6 +40996,43 @@ var useScroll = function useScroll(scrollTarget) {
 
 /***/ }),
 
+/***/ "./src/hooks/use_state_with_effect.js":
+/*!********************************************!*\
+  !*** ./src/hooks/use_state_with_effect.js ***!
+  \********************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   useStateWithEffect: () => (/* binding */ useStateWithEffect)
+/* harmony export */ });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
+// LICENSE_CODE ZON
+
+
+/*jslint react:true*/
+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; } }
+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; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+
+var useStateWithEffect = function useStateWithEffect(initialValue) {
+  var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(initialValue),
+    _useState2 = _slicedToArray(_useState, 2),
+    value = _useState2[0],
+    setValue = _useState2[1];
+  (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {
+    return setValue(initialValue);
+  }, [initialValue]);
+  return [value, setValue];
+};
+
+/***/ }),
+
 /***/ "./src/hooks/use_window_size.js":
 /*!**************************************!*\
   !*** ./src/hooks/use_window_size.js ***!
@@ -41345,12 +41408,13 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../tooltip */ "./src/tooltip/index.js");
 /* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../typography */ "./src/typography/index.js");
 /* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../util */ "./src/util/index.js");
+/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../constants */ "./src/constants.js");
 // LICENSE_CODE ZON
 
 
 /*jslint react:true*/
 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 = ["id", "name", "checked", "onChange", "onClick", "label", "disabled", "tooltip", "indeterminate", "verticalAlign", "className", "classNamePrefix", "tabIndex", "readOnly"];
+var _excluded = ["id", "name", "checked", "onChange", "onClick", "label", "disabled", "tooltip", "indeterminate", "verticalAlign", "className", "classNamePrefix", "tabIndex", "readOnly", "tooltipPlacement"];
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
@@ -41364,6 +41428,7 @@ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t =
 
 
 
+
 var Checkbox = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwardRef(function (_ref, ref) {
   var id = _ref.id,
     name = _ref.name,
@@ -41381,6 +41446,7 @@ var Checkbox = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forward
     _ref$tabIndex = _ref.tabIndex,
     tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex,
     readOnly = _ref.readOnly,
+    tooltipPlacement = _ref.tooltipPlacement,
     rest = _objectWithoutProperties(_ref, _excluded);
   var labelId = (0,_hooks__WEBPACK_IMPORTED_MODULE_3__.useLabelId)(id);
   var handleClick = function handleClick(evt) {
@@ -41390,7 +41456,8 @@ var Checkbox = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forward
     onChange === null || onChange === void 0 || onChange(newValue, evt);
   };
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_tooltip__WEBPACK_IMPORTED_MODULE_4__.Tooltip2, {
-    tooltip: tooltip
+    tooltip: tooltip,
+    tooltipPlacement: tooltipPlacement
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(CheckboxWrapper, _extends({
     ref: ref
   }, rest, {
@@ -41434,7 +41501,8 @@ Checkbox.propTypes = {
   classNamePrefix: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
   tabIndex: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number),
   readOnly: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),
-  tooltip: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node)
+  tooltip: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node),
+  tooltipPlacement: _constants__WEBPACK_IMPORTED_MODULE_7__.PT_TOOLTIP_PLACEMENT
 };
 var CheckboxWrapper = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "CheckboxWrapper",
@@ -47271,13 +47339,14 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_2__);
 /* harmony import */ var _icon__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../icon */ "./src/icon.js");
 /* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../typography */ "./src/typography/index.js");
-/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../utils */ "./src/utils.js");
+/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../util */ "./src/util/index.js");
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../utils */ "./src/utils.js");
 // LICENSE_CODE ZON
 
 
 /*jslint react:true*/
 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 = ["text", "variant", "size", "underline", "icon", "iconPlacement", "as", "href", "target", "rel", "newTab"],
+var _excluded = ["className", "classNamePrefix", "variant", "size", "underline", "icon", "iconPlacement", "as", "href", "target", "rel", "newTab", "text", "children"],
   _excluded2 = ["isLeft", "isRight"];
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 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; }
@@ -47293,8 +47362,11 @@ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t =
 
 
 
+
 var Link = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwardRef(function (_ref, ref) {
-  var text = _ref.text,
+  var className = _ref.className,
+    _ref$classNamePrefix = _ref.classNamePrefix,
+    classNamePrefix = _ref$classNamePrefix === void 0 ? 'uikit_link' : _ref$classNamePrefix,
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'primary' : _ref$variant,
     _ref$size = _ref.size,
@@ -47308,8 +47380,11 @@ var Link = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwardRef(
     target = _ref.target,
     rel = _ref.rel,
     newTab = _ref.newTab,
+    text = _ref.text,
+    children = _ref.children,
     rest = _objectWithoutProperties(_ref, _excluded);
-  var linkProps = _objectSpread(_objectSpread({}, rest), getLinkProps({
+  var mergedText = text || children;
+  var lnkProps = _objectSpread(_objectSpread({}, rest), getLinkProps({
     as: as,
     href: href,
     target: target,
@@ -47318,8 +47393,8 @@ var Link = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwardRef(
   }));
   if (variant == 'inline') return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(InlineLink, _extends({
     ref: ref
-  }, linkProps), text);
-  var _getIconProps = (0,_utils__WEBPACK_IMPORTED_MODULE_5__.getIconProps)('Link', {
+  }, lnkProps), mergedText);
+  var _getIconProps = (0,_utils__WEBPACK_IMPORTED_MODULE_6__.getIconProps)('Link', {
       size: size,
       icon: icon,
       iconPlacement: iconPlacement
@@ -47327,29 +47402,43 @@ var Link = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().forwardRef(
     isLeft = _getIconProps.isLeft,
     isRight = _getIconProps.isRight,
     iconProps = _objectWithoutProperties(_getIconProps, _excluded2);
-  var labelProps = {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(StyledLink, _extends({
+    ref: ref
+  }, lnkProps, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(null, null, className, classNamePrefix),
+    $variant: variant,
+    $underline: underline,
+    $size: size,
+    $classNamePrefix: classNamePrefix
+  }), isLeft && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_3__.Icon, _extends({
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(classNamePrefix, {
+      '-icon': true,
+      '-icon-left': true
+    })
+  }, iconProps)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_4__.Label, {
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(classNamePrefix, {
+      '-text': true
+    }),
     variant: {
       lg: 'lg',
       sm: 'xs'
     }[size] || 'base',
-    children: text,
     no_wrap: true,
-    'data-label': true
-  };
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(StyledLink, _extends({
-    ref: ref
-  }, linkProps, {
-    $variant: variant,
-    $underline: underline,
-    $size: size
-  }), isLeft && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_3__.Icon, iconProps), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_4__.Label, labelProps), isRight && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_3__.Icon, iconProps));
+    "data-label": "true"
+  }, mergedText), isRight && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_3__.Icon, _extends({
+    className: (0,_util__WEBPACK_IMPORTED_MODULE_5__.classNames)(classNamePrefix, {
+      '-icon': true,
+      '-icon-right': true
+    })
+  }, iconProps)));
 });
 Link.displayName = 'Link';
 Link.propTypes = {
-  text: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node).isRequired,
+  className: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  classNamePrefix: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
   variant: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['primary', 'secondary', 'inline']),
   size: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['sm', 'md', 'lg']),
-  icon: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(_utils__WEBPACK_IMPORTED_MODULE_5__.iconNames),
+  icon: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(_utils__WEBPACK_IMPORTED_MODULE_6__.iconNames),
   iconPlacement: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['left', 'right']),
   href: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
   newTab: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),
@@ -47376,8 +47465,8 @@ var getLinkProps = function getLinkProps(opt) {
 var StyledLink = styled_components__WEBPACK_IMPORTED_MODULE_2___default().a.withConfig({
   displayName: "StyledLink",
   componentId: "sc-1ilmd36-0"
-})(["display:inline-flex;align-items:center;justify-content:center;text-decoration:none;background:0 none;border:0 none;padding:0;gap:", ";color:", ";[data-label]{text-decoration:", ";}cursor:pointer;&:disabled{cursor:not-allowed;}&:hover:not(:disabled){color:", ";[data-label]{text-decoration:", ";}}&:hover,:visited,:focus{text-decoration:none;}"], function (props) {
-  return (0,_utils__WEBPACK_IMPORTED_MODULE_5__.toPixel)(props.$size == 'lg' ? 8 : 4);
+})(["display:inline-flex;align-items:center;justify-content:flex-start;text-decoration:none;background:0 none;border:0 none;padding:0;gap:", ";color:", ";[data-label]{text-decoration:", ";}cursor:pointer;&:disabled{cursor:not-allowed;}&:hover:not(:disabled){color:", ";[data-label]{text-decoration:", ";}}&:hover,:visited,:focus{text-decoration:none;}.", "-icon-right{margin-left:auto;}"], function (props) {
+  return (0,_utils__WEBPACK_IMPORTED_MODULE_6__.toPixel)(props.$size == 'lg' ? 8 : 4);
 }, function (_ref2) {
   var $variant = _ref2.$variant,
     color = _ref2.theme.color;
@@ -47390,6 +47479,9 @@ var StyledLink = styled_components__WEBPACK_IMPORTED_MODULE_2___default().a.with
   return $variant == 'primary' ? color.link_primary_hover : color.link_secondary_hover;
 }, function (props) {
   return props.$underline || props.$variant == 'primary' ? 'underline' : 'none';
+}, function (_ref4) {
+  var $classNamePrefix = _ref4.$classNamePrefix;
+  return $classNamePrefix;
 });
 var InlineLink = styled_components__WEBPACK_IMPORTED_MODULE_2___default().a.withConfig({
   displayName: "InlineLink",
@@ -47497,16 +47589,17 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
 /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! styled-components */ "styled-components");
 /* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_2__);
-/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../constants */ "./src/constants.js");
-/* harmony import */ var _icon__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../icon */ "./src/icon.js");
-/* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../tooltip */ "./src/tooltip/index.js");
-/* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../typography */ "./src/typography/index.js");
-/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../utils */ "./src/utils.js");
-/* harmony import */ var _menu__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./menu */ "./src/menu/menu.js");
-/* harmony import */ var _menu_item_divider__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./menu_item_divider */ "./src/menu/menu_item_divider.js");
-/* harmony import */ var _menu_item_group__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./menu_item_group */ "./src/menu/menu_item_group.js");
-/* harmony import */ var _shared__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./shared */ "./src/menu/shared.js");
-/* harmony import */ var _menu_item_popup__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./menu_item_popup */ "./src/menu/menu_item_popup.js");
+/* harmony import */ var rc_util_lib_pickAttrs__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! rc-util/lib/pickAttrs */ "./node_modules/rc-util/lib/pickAttrs.js");
+/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../constants */ "./src/constants.js");
+/* harmony import */ var _icon__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../icon */ "./src/icon.js");
+/* harmony import */ var _tooltip__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../tooltip */ "./src/tooltip/index.js");
+/* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../typography */ "./src/typography/index.js");
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../utils */ "./src/utils.js");
+/* harmony import */ var _menu__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./menu */ "./src/menu/menu.js");
+/* harmony import */ var _menu_item_divider__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./menu_item_divider */ "./src/menu/menu_item_divider.js");
+/* harmony import */ var _menu_item_group__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ./menu_item_group */ "./src/menu/menu_item_group.js");
+/* harmony import */ var _shared__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ./shared */ "./src/menu/shared.js");
+/* harmony import */ var _menu_item_popup__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! ./menu_item_popup */ "./src/menu/menu_item_popup.js");
 // LICENSE_CODE ZON
 
 
@@ -47530,6 +47623,7 @@ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t =
 
 
 
+
 var MenuItem = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(function (_ref, ref) {
   var _ref$type = _ref.type,
     type = _ref$type === void 0 ? 'item' : _ref$type,
@@ -47551,7 +47645,7 @@ var MenuItem = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(fu
     icon = _ref.icon,
     iconPlacement = _ref.iconPlacement,
     rest = _objectWithoutProperties(_ref, _excluded);
-  if (type == 'divider') return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_menu_item_divider__WEBPACK_IMPORTED_MODULE_9__["default"], {
+  if (type == 'divider') return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_menu_item_divider__WEBPACK_IMPORTED_MODULE_10__["default"], {
     ref: ref
   });
   var subItems = buildSubItems(children, {
@@ -47559,13 +47653,13 @@ var MenuItem = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(fu
   });
   var isSubMenu = subMenu || subItems;
   if (type == 'group') {
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_menu_item_group__WEBPACK_IMPORTED_MODULE_10__.MenuItemGroup, _extends({
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_menu_item_group__WEBPACK_IMPORTED_MODULE_11__.MenuItemGroup, _extends({
       ref: ref,
       text: text,
       isFirstItem: isFirstItem
     }, rest), subItems);
   }
-  var _getIconProps = (0,_utils__WEBPACK_IMPORTED_MODULE_7__.getIconProps)('MenuItem', {
+  var _getIconProps = (0,_utils__WEBPACK_IMPORTED_MODULE_8__.getIconProps)('MenuItem', {
       size: size,
       icon: icon,
       iconPlacement: iconPlacement
@@ -47574,23 +47668,23 @@ var MenuItem = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(fu
     iconProps = _objectWithoutProperties(_getIconProps, _excluded2);
   var iconColor = disabled ? 'icon_disabled' : variant == 'negative' ? 'icon_error' : 'icon';
   var labelColor = disabled ? 'text_disabled' : variant == 'negative' ? 'text_error' : 'text';
-  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_shared__WEBPACK_IMPORTED_MODULE_11__.MenuItemContainer, {
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_shared__WEBPACK_IMPORTED_MODULE_12__.MenuItemContainer, {
     ref: ref,
     as: tag,
     role: "menuitem"
-  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_tooltip__WEBPACK_IMPORTED_MODULE_5__.Tooltip2, {
+  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_tooltip__WEBPACK_IMPORTED_MODULE_6__.Tooltip2, {
     tooltip: tooltip
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(MenuItemComp, _extends({}, rest, {
     "aria-disabled": disabled ? true : undefined,
     size: size,
     role: "button",
     subItems: subItems
-  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(MenuItemLeft, null, isLeft && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_4__.Icon, _extends({}, iconProps, {
+  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(MenuItemLeft, null, isLeft && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_icon__WEBPACK_IMPORTED_MODULE_5__.Icon, _extends({}, iconProps, {
     color: iconColor
   })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(MenuItemRight, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(MenuItemText, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(PrimaryText, {
     $size: size,
     color: labelColor
-  }, text), !isSubMenu && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), null, !!tertiaryText && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_6__.Label, {
+  }, text), !isSubMenu && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), null, !!tertiaryText && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_7__.Label, {
     variant: "sm",
     whiteSpace: "nowrap",
     color: "text_tertiary"
@@ -47608,7 +47702,7 @@ MenuItem.propTypes = {
   description: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
   type: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['item', 'divider', 'group']),
   size: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['sm', 'md', 'lg']),
-  icon: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(_utils__WEBPACK_IMPORTED_MODULE_7__.iconNames),
+  icon: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(_utils__WEBPACK_IMPORTED_MODULE_8__.iconNames),
   // XXX alexanderse: PT.arrayOf(PT.shape(MenuItem.propTypes)) cause parse err
   children: prop_types__WEBPACK_IMPORTED_MODULE_0___default().arrayOf((prop_types__WEBPACK_IMPORTED_MODULE_0___default().object)),
   variant: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(['default', 'negative']),
@@ -47618,7 +47712,7 @@ MenuItem.propTypes = {
   tooltip: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node),
   popupPlacement: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
   popupClassName: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
-  popupTrigger: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([_constants__WEBPACK_IMPORTED_MODULE_3__.PT_TRIGGER, prop_types__WEBPACK_IMPORTED_MODULE_0___default().arrayOf(_constants__WEBPACK_IMPORTED_MODULE_3__.PT_TRIGGER)]),
+  popupTrigger: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([_constants__WEBPACK_IMPORTED_MODULE_4__.PT_TRIGGER, prop_types__WEBPACK_IMPORTED_MODULE_0___default().arrayOf(_constants__WEBPACK_IMPORTED_MODULE_4__.PT_TRIGGER)]),
   popupStyle: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().object)
 };
 var MenuItemComp = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef)(function (_ref2, ref) {
@@ -47630,9 +47724,9 @@ var MenuItemComp = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.forwardRef
     rest = _objectWithoutProperties(_ref2, _excluded3);
   var button = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(MenuItemButton, _extends({
     ref: ref
-  }, rest));
+  }, (0,rc_util_lib_pickAttrs__WEBPACK_IMPORTED_MODULE_3__["default"])(rest)));
   if (subItems) {
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_menu_item_popup__WEBPACK_IMPORTED_MODULE_12__.MenuItemPopup, {
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_menu_item_popup__WEBPACK_IMPORTED_MODULE_13__.MenuItemPopup, {
       subItems: subItems,
       popupPlacement: popupPlacement,
       popupTrigger: popupTrigger,
@@ -47652,7 +47746,7 @@ var MenuItemButton = styled_components__WEBPACK_IMPORTED_MODULE_2___default().di
   displayName: "MenuItemButton",
   componentId: "sc-vtiffr-0"
 })(["display:flex;flex-direction:row;align-items:center;justify-content:flex-start;text-decoration:none;background:0 none;border:0 none;padding:0 12px;box-sizing:border-box;width:100%;min-width:168px;max-width:540px;height:", ";gap:4px;cursor:", ";&:hover{background-color:", ";}&:hover,:visited,:focus{text-decoration:none;}&:active{background-color:", ";}"], function (props) {
-  return (0,_utils__WEBPACK_IMPORTED_MODULE_7__.toPixel)(sizes[props.size] || sizes.md);
+  return (0,_utils__WEBPACK_IMPORTED_MODULE_8__.toPixel)(sizes[props.size] || sizes.md);
 }, function (props) {
   return props['aria-disabled'] ? 'not-allowed' : 'pointer';
 }, function (_ref3) {
@@ -47687,13 +47781,13 @@ var SecondaryIcon = function SecondaryIcon(_ref5) {
   });
   return null;
 };
-var RightIcon = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(_icon__WEBPACK_IMPORTED_MODULE_4__.Icon).attrs({
+var RightIcon = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(_icon__WEBPACK_IMPORTED_MODULE_5__.Icon).attrs({
   size: 'xs'
 }).withConfig({
   displayName: "RightIcon",
   componentId: "sc-vtiffr-4"
 })(["margin-left:auto;"]);
-var PrimaryText = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(_typography__WEBPACK_IMPORTED_MODULE_6__.Label).attrs(function (props) {
+var PrimaryText = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(_typography__WEBPACK_IMPORTED_MODULE_7__.Label).attrs(function (props) {
   return {
     variant: props.$size == 'lg' ? 'lg' : 'sm',
     whiteSpace: 'nowrap'
@@ -47702,7 +47796,7 @@ var PrimaryText = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(_typo
   displayName: "PrimaryText",
   componentId: "sc-vtiffr-5"
 })(["overflow-x:clip;text-overflow:ellipsis;"]);
-var SecondaryText = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(_typography__WEBPACK_IMPORTED_MODULE_6__.Label).attrs({
+var SecondaryText = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(_typography__WEBPACK_IMPORTED_MODULE_7__.Label).attrs({
   variant: 'sm',
   color: 'text_secondary',
   whiteSpace: 'nowrap'
@@ -47710,7 +47804,7 @@ var SecondaryText = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(_ty
   displayName: "SecondaryText",
   componentId: "sc-vtiffr-6"
 })(["margin-left:auto;"]);
-var Description = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(_typography__WEBPACK_IMPORTED_MODULE_6__.Label).attrs({
+var Description = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(_typography__WEBPACK_IMPORTED_MODULE_7__.Label).attrs({
   variant: 'xs',
   color: 'text_tertiary',
   whiteSpace: 'nowrap'
@@ -47720,7 +47814,7 @@ var Description = styled_components__WEBPACK_IMPORTED_MODULE_2___default()(_typo
 })(["width:100%;overflow-x:clip;text-overflow:ellipsis;"]);
 var buildSubItems = function buildSubItems(children, itemProps) {
   return Array.isArray(children) && children.length > 0 ? children.map(function (item, ind) {
-    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_menu__WEBPACK_IMPORTED_MODULE_8__.Menu.Item, _extends({
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_menu__WEBPACK_IMPORTED_MODULE_9__.Menu.Item, _extends({
       key: item.key
     }, item, itemProps, {
       isFirstItem: ind == 0
@@ -49232,6 +49326,272 @@ var CompContainer = styled_components__WEBPACK_IMPORTED_MODULE_1___default().div
 
 /***/ }),
 
+/***/ "./src/popover/index.js":
+/*!******************************!*\
+  !*** ./src/popover/index.js ***!
+  \******************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   Popover: () => (/* reexport safe */ _popover__WEBPACK_IMPORTED_MODULE_0__.Popover)
+/* harmony export */ });
+/* harmony import */ var _popover__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./popover */ "./src/popover/popover.js");
+// LICENSE_CODE ZON
+
+
+/*jslint react:true*/
+
+
+/***/ }),
+
+/***/ "./src/popover/placements.js":
+/*!***********************************!*\
+  !*** ./src/popover/placements.js ***!
+  \***********************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   placements: () => (/* binding */ placements)
+/* harmony export */ });
+// LICENSE_CODE ZON
+
+
+/*jslint react:true*/
+var autoAdjustOverflowTopBottom = {
+  shiftX: 64,
+  adjustY: 1
+};
+var autoAdjustOverflowLeftRight = {
+  adjustX: 1,
+  shiftY: true
+};
+var targetOffset = [0, 0];
+var placements = {
+  top: {
+    points: ['bc', 'tc'],
+    overflow: autoAdjustOverflowTopBottom,
+    offset: [0, -6],
+    targetOffset: targetOffset
+  },
+  topLeft: {
+    points: ['bl', 'tl'],
+    overflow: autoAdjustOverflowTopBottom,
+    offset: [0, -6],
+    targetOffset: targetOffset
+  },
+  topRight: {
+    points: ['br', 'tr'],
+    overflow: autoAdjustOverflowTopBottom,
+    offset: [0, -6],
+    targetOffset: targetOffset
+  },
+  bottom: {
+    points: ['tc', 'bc'],
+    overflow: autoAdjustOverflowTopBottom,
+    offset: [0, 6],
+    targetOffset: targetOffset
+  },
+  bottomLeft: {
+    points: ['tl', 'bl'],
+    overflow: autoAdjustOverflowTopBottom,
+    offset: [0, 6],
+    targetOffset: targetOffset
+  },
+  bottomRight: {
+    points: ['tr', 'br'],
+    overflow: autoAdjustOverflowTopBottom,
+    offset: [0, 6],
+    targetOffset: targetOffset
+  },
+  left: {
+    points: ['cr', 'cl'],
+    overflow: autoAdjustOverflowLeftRight,
+    offset: [-6, 0],
+    targetOffset: targetOffset
+  },
+  leftTop: {
+    points: ['tr', 'tl'],
+    overflow: autoAdjustOverflowLeftRight,
+    offset: [-6, 0],
+    targetOffset: targetOffset
+  },
+  leftBottom: {
+    points: ['br', 'bl'],
+    overflow: autoAdjustOverflowLeftRight,
+    offset: [-6, 0],
+    targetOffset: targetOffset
+  },
+  right: {
+    points: ['cl', 'cr'],
+    overflow: autoAdjustOverflowLeftRight,
+    offset: [6, 0],
+    targetOffset: targetOffset
+  },
+  rightTop: {
+    points: ['tl', 'tr'],
+    overflow: autoAdjustOverflowLeftRight,
+    offset: [6, 0],
+    targetOffset: targetOffset
+  },
+  rightBottom: {
+    points: ['bl', 'br'],
+    overflow: autoAdjustOverflowLeftRight,
+    offset: [6, 0],
+    targetOffset: targetOffset
+  }
+};
+
+/***/ }),
+
+/***/ "./src/popover/popover.js":
+/*!********************************!*\
+  !*** ./src/popover/popover.js ***!
+  \********************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   Popover: () => (/* binding */ _Popover)
+/* harmony export */ });
+/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! prop-types */ "prop-types");
+/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! styled-components */ "styled-components");
+/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_2__);
+/* harmony import */ var _rc_component_trigger__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @rc-component/trigger */ "./node_modules/@rc-component/trigger/es/index.js");
+/* harmony import */ var dom_helpers_listen__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! dom-helpers/listen */ "./node_modules/dom-helpers/esm/listen.js");
+/* harmony import */ var _util__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../util */ "./src/util/index.js");
+/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../constants */ "./src/constants.js");
+/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../hooks */ "./src/hooks/index.js");
+/* harmony import */ var _placements__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./placements */ "./src/popover/placements.js");
+// LICENSE_CODE ZON
+
+
+/*jslint react:true*/
+var _excluded = ["className", "classNamePrefix", "style", "trigger", "visible", "placement", "popover", "onVisibleChange", "afterVisibleChange", "children", "hideOnScroll", "getScrollDOMNode"];
+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; } }
+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; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
+
+
+
+
+
+
+
+
+
+var _Popover = function Popover(_ref) {
+  var className = _ref.className,
+    _ref$classNamePrefix = _ref.classNamePrefix,
+    classNamePrefix = _ref$classNamePrefix === void 0 ? 'uikit_popover' : _ref$classNamePrefix,
+    style = _ref.style,
+    trigger = _ref.trigger,
+    visible = _ref.visible,
+    _ref$placement = _ref.placement,
+    placement = _ref$placement === void 0 ? 'bottom' : _ref$placement,
+    popover = _ref.popover,
+    onVisibleChange = _ref.onVisibleChange,
+    afterVisibleChange = _ref.afterVisibleChange,
+    children = _ref.children,
+    hideOnScroll = _ref.hideOnScroll,
+    getScrollDOMNode = _ref.getScrollDOMNode,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var theme = (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.useTheme)();
+  var mouseEnterDelay = (0,_util__WEBPACK_IMPORTED_MODULE_5__.firstDefined)(rest.showDelay, _Popover.showDelay);
+  var mouseLeaveDelay = (0,_util__WEBPACK_IMPORTED_MODULE_5__.firstDefined)(rest.hideDelay, _Popover.hideDelay);
+  var popupMotion = {
+    motionName: "".concat(classNamePrefix, "-motion"),
+    motionAppear: true,
+    motionEnter: true,
+    motionLeave: true,
+    motionDeadline: 500
+  };
+  var _useStateWithEffect = (0,_hooks__WEBPACK_IMPORTED_MODULE_7__.useStateWithEffect)(visible),
+    _useStateWithEffect2 = _slicedToArray(_useStateWithEffect, 2),
+    popupVisible = _useStateWithEffect2[0],
+    setPopupVisible = _useStateWithEffect2[1];
+  var onPopupVisibleChange = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function (value) {
+    setPopupVisible(value);
+    onVisibleChange === null || onVisibleChange === void 0 || onVisibleChange(value);
+  }, [onVisibleChange]);
+  (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {
+    if (!hideOnScroll || !popupVisible) return;
+    var htmlElement = typeof getScrollDOMNode == 'function' ? getScrollDOMNode() : window;
+    if (htmlElement) {
+      return (0,dom_helpers_listen__WEBPACK_IMPORTED_MODULE_4__["default"])(htmlElement, 'scroll', function () {
+        return onPopupVisibleChange(false);
+      });
+    }
+  }, [hideOnScroll, popupVisible, getScrollDOMNode, onPopupVisibleChange]);
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(PopoverStyle, {
+    $prefixCls: classNamePrefix,
+    $theme: theme
+  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_rc_component_trigger__WEBPACK_IMPORTED_MODULE_3__["default"], {
+    prefixCls: classNamePrefix,
+    mask: true,
+    action: trigger,
+    popupPlacement: placement,
+    popupMotion: popupMotion,
+    popupClassName: className,
+    popupStyle: style,
+    popupVisible: popupVisible,
+    onPopupVisibleChange: onPopupVisibleChange,
+    builtinPlacements: _placements__WEBPACK_IMPORTED_MODULE_8__.placements,
+    zIndex: _constants__WEBPACK_IMPORTED_MODULE_6__.Z_INDEX.popover,
+    afterPopupVisibleChange: afterVisibleChange,
+    mouseEnterDelay: mouseEnterDelay,
+    mouseLeaveDelay: mouseLeaveDelay,
+    popup: popover
+  }, children));
+};
+
+_Popover.propTypes = {
+  className: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  classNamePrefix: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().string),
+  style: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().object),
+  trigger: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOfType([_constants__WEBPACK_IMPORTED_MODULE_6__.PT_TRIGGER, prop_types__WEBPACK_IMPORTED_MODULE_0___default().arrayOf(_constants__WEBPACK_IMPORTED_MODULE_6__.PT_TRIGGER)]),
+  visible: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),
+  placement: _constants__WEBPACK_IMPORTED_MODULE_6__.PT_TOOLTIP_PLACEMENT,
+  popover: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node),
+  showDelay: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number),
+  hideDelay: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().number),
+  onVisibleChange: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().func),
+  afterVisibleChange: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().func),
+  hideOnScroll: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),
+  getScrollDOMNode: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().func)
+};
+_Popover.showDelay = 0.1;
+_Popover.hideDelay = 0.1;
+var prefixCls = function prefixCls(p) {
+  return p.$prefixCls;
+};
+var theme = function theme(cb) {
+  return function (p) {
+    return cb(p.$theme);
+  };
+};
+var PopoverStyle = (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.createGlobalStyle)([".", "{position:absolute;display:block;visibility:visible;width:fit-content;border-radius:4px;border:1px solid ", ";background:", ";box-shadow:", ";&-hidden{display:none;}&-mask{position:fixed;inset:0;pointer-events:none;&-hidden{display:none;}}&-motion{&-enter,&-appear{opacity:0;animation-duration:0.3s;animation-fill-mode:both;animation-timing-function:cubic-bezier(0.08,0.82,0.17,1);animation-play-state:paused;}&-leave{animation-duration:0.3s;animation-fill-mode:both;animation-timing-function:cubic-bezier(0.6,0.04,0.98,0.34);animation-play-state:paused;}&-enter&-enter-active,&-appear&-appear-active{animation-name:rcPopoverZoomIn;animation-play-state:running;}&-leave&-leave-active{animation-name:rcPopoverZoomOut;animation-play-state:running;}}@keyframes rcPopoverZoomIn{0%{opacity:0;transform:scale(0,0);}100%{opacity:1;transform:scale(1,1);}}@keyframes rcPopoverZoomOut{0%{opacity:1;transform:scale(1,1);}100%{opacity:0;transform:scale(0,0);}}}"], prefixCls, theme(function (t) {
+  return t.color.border_secondary;
+}), theme(function (t) {
+  return t.color.bg_elevated;
+}), theme(function (t) {
+  return t.shadow.medium;
+}));
+
+/***/ }),
+
 /***/ "./src/progress/index.js":
 /*!*******************************!*\
   !*** ./src/progress/index.js ***!
@@ -50001,7 +50361,7 @@ var theme = function theme(cb) {
     return cb(p.$theme);
   };
 };
-var TabsStyle = (0,styled_components__WEBPACK_IMPORTED_MODULE_4__.createGlobalStyle)([".", "{box-sizing:border-box;margin:0;padding:0;list-style:none;display:flex;&-top,&-bottom{flex-direction:column;.", "-nav-list{flex-direction:row;}}&-left,&-right{flex-direction:row;.", "-nav-list{flex-direction:column;}}&-nav{position:relative;display:flex;flex:none;align-items:center;&-wrap{position:relative;display:flex;flex:auto;align-self:stretch;white-space:nowrap;transform:translate(0);}&-list{position:relative;display:flex;transition:opacity 0.3s;justify-content:flex-start;align-items:center;box-sizing:border-box;width:fit-content;}}&-content-holder{flex:auto;min-width:0;min-height:0;box-sizing:border-box;}&-content{position:relative;width:100%;}&-tabpane{outline:none;&-hidden{display:none;}}&-tab{&-btn{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;border:0 none;background:transparent;min-width:0;width:fit-content;cursor:pointer;white-space:nowrap;font-family:", ";line-height:", ";letter-spacing:", ";}&-disabled{.", "-tab-btn{cursor:not-allowed;}}}&-main{.", "-nav-list{gap:24px;}.", "-tab{.", "-tab-btn{height:36px;padding:0;justify-content:center;gap:4px;color:", ";box-shadow:0px -1px 0px 0px ", " inset;font-size:", ";font-weight:", ";&:hover{color:", ";box-shadow:0px -2px 0px 0px ", " inset;}}&-active{.", "-tab-btn,.", "-tab-btn:hover{color:", ";box-shadow:0px -2px 0px 0px ", " inset;}}&-disabled{.", "-tab-btn,.", "-tab-btn:hover{color:", ";box-shadow:0px -1px 0px 0px ", " inset;}}}}&-underline{.", "-tab{.", "-tab-btn{height:24px;padding:0 16px;justify-content:center;gap:4px;color:", ";box-shadow:0px -1px 0px 0px ", " inset;font-size:", ";font-weight:", ";&:hover{color:", ";box-shadow:0px -2px 0px 0px ", " inset;}}&-active{.", "-tab-btn,.", "-tab-btn:hover{color:", ";box-shadow:0px -2px 0px 0px ", " inset;}}&-disabled{.", "-tab-btn,.", "-tab-btn:hover{color:", ";box-shadow:0px -1px 0px 0px ", " inset;}}}}&-contain{.", "-nav-list{padding:2px;gap:2px;border-radius:4px;background:", ";}.", "-tab{.", "-tab-btn{height:32px;padding:0px 8px;justify-content:center;gap:6px;border-radius:4px;color:", ";font-size:", ";font-weight:", ";&:hover{color:", ";background:", ";}}&-active{.", "-tab-btn,.", "-tab-btn:hover{background:", ";border:1px solid ", ";box-shadow:", ";font-weight:", ";}}&-disabled{.", "-tab-btn,.", "-tab-btn:hover{color:", ";background:", ";}}}}&-vertical{.", "-tab{.", "-tab-btn{width:200px;height:40px;padding:0 12px;justify-content:flex-start;gap:4px;border-radius:0 4px 4px 0;border-left:1px solid transparent;color:", ";overflow-x:clip;text-overflow:ellipsis;&:hover{border-left-color:", ";}}&-active{.", "-tab-btn{background:", ";border-left-color:", ";}}&-disabled{.", "-tab-btn,.", "-tab-btn:hover{color:", ";border-left-color:transparent;}}}}}"], prefixCls, prefixCls, prefixCls, theme(function (t) {
+var TabsStyle = (0,styled_components__WEBPACK_IMPORTED_MODULE_4__.createGlobalStyle)([".", "{box-sizing:border-box;margin:0;padding:0;list-style:none;display:flex;&-top,&-bottom{flex-direction:column;.", "-nav-list{flex-direction:row;}}&-left,&-right{flex-direction:row;.", "-nav-list{flex-direction:column;}}&-nav{position:relative;display:flex;flex:none;align-items:center;&-wrap{position:relative;display:flex;flex:auto;align-self:stretch;white-space:nowrap;transform:translate(0);}&-list{position:relative;display:flex;transition:opacity 0.3s;justify-content:flex-start;align-items:center;box-sizing:border-box;width:fit-content;}&-operations{display:flex;align-self:stretch;&-hidden{position:absolute;visibility:hidden;pointer-events:none;}}}&-content-holder{flex:auto;min-width:0;min-height:0;box-sizing:border-box;}&-content{position:relative;width:100%;}&-tabpane{outline:none;&-hidden{display:none;}}&-tab{&-btn{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;border:0 none;background:transparent;min-width:0;width:fit-content;cursor:pointer;white-space:nowrap;font-family:", ";line-height:", ";letter-spacing:", ";}&-disabled{.", "-tab-btn{cursor:not-allowed;}}}&-main{.", "-nav-list{gap:24px;}.", "-tab{.", "-tab-btn{height:36px;padding:0;justify-content:center;gap:4px;color:", ";box-shadow:0px -1px 0px 0px ", " inset;font-size:", ";font-weight:", ";&:hover{color:", ";box-shadow:0px -2px 0px 0px ", " inset;}}&-active{.", "-tab-btn,.", "-tab-btn:hover{color:", ";box-shadow:0px -2px 0px 0px ", " inset;}}&-disabled{.", "-tab-btn,.", "-tab-btn:hover{color:", ";box-shadow:0px -1px 0px 0px ", " inset;}}}}&-underline{.", "-tab{.", "-tab-btn{height:24px;padding:0 16px;justify-content:center;gap:4px;color:", ";box-shadow:0px -1px 0px 0px ", " inset;font-size:", ";font-weight:", ";&:hover{color:", ";box-shadow:0px -2px 0px 0px ", " inset;}}&-active{.", "-tab-btn,.", "-tab-btn:hover{color:", ";box-shadow:0px -2px 0px 0px ", " inset;}}&-disabled{.", "-tab-btn,.", "-tab-btn:hover{color:", ";box-shadow:0px -1px 0px 0px ", " inset;}}}}&-contain{.", "-nav-list{padding:2px;gap:2px;border-radius:4px;background:", ";}.", "-tab{.", "-tab-btn{height:32px;padding:0px 8px;justify-content:center;gap:6px;border-radius:4px;color:", ";font-size:", ";font-weight:", ";&:hover{color:", ";background:", ";}}&-active{.", "-tab-btn,.", "-tab-btn:hover{background:", ";border:1px solid ", ";box-shadow:", ";font-weight:", ";}}&-disabled{.", "-tab-btn,.", "-tab-btn:hover{color:", ";background:", ";}}}}&-vertical{.", "-tab{.", "-tab-btn{width:200px;height:40px;padding:0 12px;justify-content:flex-start;gap:4px;border-radius:0 4px 4px 0;border-left:1px solid transparent;color:", ";overflow-x:clip;text-overflow:ellipsis;&:hover{border-left-color:", ";}}&-active{.", "-tab-btn{background:", ";border-left-color:", ";}}&-disabled{.", "-tab-btn,.", "-tab-btn:hover{color:", ";border-left-color:transparent;}}}}&-ink-bar{display:none;position:absolute;pointer-events:none;}}"], prefixCls, prefixCls, prefixCls, theme(function (t) {
   return t.font_family.sans;
 }), theme(function (t) {
   return t.line_height.none;
@@ -61578,6 +61938,153 @@ debounce.debounce = debounce;
 module.exports = debounce;
 
 
+/***/ }),
+
+/***/ "./node_modules/dom-helpers/esm/addEventListener.js":
+/*!**********************************************************!*\
+  !*** ./node_modules/dom-helpers/esm/addEventListener.js ***!
+  \**********************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__),
+/* harmony export */   onceSupported: () => (/* binding */ onceSupported),
+/* harmony export */   optionsSupported: () => (/* binding */ optionsSupported)
+/* harmony export */ });
+/* harmony import */ var _canUseDOM__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./canUseDOM */ "./node_modules/dom-helpers/esm/canUseDOM.js");
+/* eslint-disable no-return-assign */
+
+var optionsSupported = false;
+var onceSupported = false;
+
+try {
+  var options = {
+    get passive() {
+      return optionsSupported = true;
+    },
+
+    get once() {
+      // eslint-disable-next-line no-multi-assign
+      return onceSupported = optionsSupported = true;
+    }
+
+  };
+
+  if (_canUseDOM__WEBPACK_IMPORTED_MODULE_0__["default"]) {
+    window.addEventListener('test', options, options);
+    window.removeEventListener('test', options, true);
+  }
+} catch (e) {
+  /* */
+}
+
+/**
+ * An `addEventListener` ponyfill, supports the `once` option
+ * 
+ * @param node the element
+ * @param eventName the event name
+ * @param handle the handler
+ * @param options event options
+ */
+function addEventListener(node, eventName, handler, options) {
+  if (options && typeof options !== 'boolean' && !onceSupported) {
+    var once = options.once,
+        capture = options.capture;
+    var wrappedHandler = handler;
+
+    if (!onceSupported && once) {
+      wrappedHandler = handler.__once || function onceHandler(event) {
+        this.removeEventListener(eventName, onceHandler, capture);
+        handler.call(this, event);
+      };
+
+      handler.__once = wrappedHandler;
+    }
+
+    node.addEventListener(eventName, wrappedHandler, optionsSupported ? options : capture);
+  }
+
+  node.addEventListener(eventName, handler, options);
+}
+
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (addEventListener);
+
+/***/ }),
+
+/***/ "./node_modules/dom-helpers/esm/canUseDOM.js":
+/*!***************************************************!*\
+  !*** ./node_modules/dom-helpers/esm/canUseDOM.js ***!
+  \***************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (!!(typeof window !== 'undefined' && window.document && window.document.createElement));
+
+/***/ }),
+
+/***/ "./node_modules/dom-helpers/esm/listen.js":
+/*!************************************************!*\
+  !*** ./node_modules/dom-helpers/esm/listen.js ***!
+  \************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+/* harmony import */ var _addEventListener__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./addEventListener */ "./node_modules/dom-helpers/esm/addEventListener.js");
+/* harmony import */ var _removeEventListener__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./removeEventListener */ "./node_modules/dom-helpers/esm/removeEventListener.js");
+
+
+
+function listen(node, eventName, handler, options) {
+  (0,_addEventListener__WEBPACK_IMPORTED_MODULE_0__["default"])(node, eventName, handler, options);
+  return function () {
+    (0,_removeEventListener__WEBPACK_IMPORTED_MODULE_1__["default"])(node, eventName, handler, options);
+  };
+}
+
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (listen);
+
+/***/ }),
+
+/***/ "./node_modules/dom-helpers/esm/removeEventListener.js":
+/*!*************************************************************!*\
+  !*** ./node_modules/dom-helpers/esm/removeEventListener.js ***!
+  \*************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "default": () => (__WEBPACK_DEFAULT_EXPORT__)
+/* harmony export */ });
+/**
+ * A `removeEventListener` ponyfill
+ * 
+ * @param node the element
+ * @param eventName the event name
+ * @param handle the handler
+ * @param options event options
+ */
+function removeEventListener(node, eventName, handler, options) {
+  var capture = options && typeof options !== 'boolean' ? options.capture : options;
+  node.removeEventListener(eventName, handler, capture);
+
+  if (handler.__once) {
+    node.removeEventListener(eventName, handler.__once, capture);
+  }
+}
+
+/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (removeEventListener);
+
 /***/ }),
 
 /***/ "./node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js":
@@ -143670,6 +144177,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   Link: () => (/* reexport safe */ _core__WEBPACK_IMPORTED_MODULE_0__.Link),
 /* harmony export */   Menu: () => (/* reexport safe */ _core__WEBPACK_IMPORTED_MODULE_0__.Menu),
 /* harmony export */   Modal: () => (/* reexport safe */ _core__WEBPACK_IMPORTED_MODULE_0__.Modal),
+/* harmony export */   Popover: () => (/* reexport safe */ _core__WEBPACK_IMPORTED_MODULE_0__.Popover),
 /* harmony export */   Progress: () => (/* reexport safe */ _core__WEBPACK_IMPORTED_MODULE_0__.Progress),
 /* harmony export */   ProgressBar: () => (/* reexport safe */ _core__WEBPACK_IMPORTED_MODULE_0__.ProgressBar),
 /* harmony export */   RemovableTag: () => (/* reexport safe */ _core__WEBPACK_IMPORTED_MODULE_0__.RemovableTag),