@luminati-io/uikit 1.9.11 → 1.9.12

package/dist/uikit.umd.js

@@ -29374,15 +29374,13 @@ __webpack_require__.r(__webpack_exports__);
 /* 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 react_dom__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-dom */ "react-dom");
-/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_2__);
-/* harmony import */ var react_popper__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! react-popper */ "./node_modules/react-popper/lib/esm/usePopper.js");
-/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! styled-components */ "styled-components");
-/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(styled_components__WEBPACK_IMPORTED_MODULE_3__);
-/* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./theme */ "./src/theme.js");
-/* harmony import */ var _typography__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./typography */ "./src/typography/index.js");
-/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./utils */ "./src/utils.js");
-/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./constants */ "./src/constants.js");
+/* harmony import */ var react_popper__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react-popper */ "./node_modules/react-popper/lib/esm/usePopper.js");
+/* 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 _theme__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./theme */ "./src/theme.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 _constants__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./constants */ "./src/constants.js");
 // LICENSE_CODE ZON
 
 
@@ -29402,12 +29400,13 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
 
 
-
+var CLOSE_DELAY = 200;
 var Tooltip = function Tooltip(props) {
   var children = props.children,
     tooltip = props.tooltip,
     placement = props.placement,
-    noWrap = props.noWrap;
+    noWrap = props.noWrap,
+    interactive = props.interactive;
   var _useState = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(null),
     _useState2 = _slicedToArray(_useState, 2),
     referenceElement = _useState2[0],
@@ -29424,13 +29423,23 @@ var Tooltip = function Tooltip(props) {
     _useState8 = _slicedToArray(_useState7, 2),
     visible = _useState8[0],
     setVisible = _useState8[1];
+  var closeTimmer = (0,react__WEBPACK_IMPORTED_MODULE_1__.useRef)();
   var show = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function () {
-    return setVisible(true);
+    clearTimeout(closeTimmer.current);
+    setVisible(true);
   }, []);
   var hide = (0,react__WEBPACK_IMPORTED_MODULE_1__.useCallback)(function () {
-    return setVisible(false);
+    clearTimeout(closeTimmer.current);
+    closeTimmer.current = setTimeout(function () {
+      return setVisible(false);
+    }, interactive ? CLOSE_DELAY : 0);
+  }, []);
+  (0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {
+    return function () {
+      clearTimeout(closeTimmer.current);
+    };
   }, []);
-  var _usePopper = (0,react_popper__WEBPACK_IMPORTED_MODULE_8__.usePopper)(referenceElement, popperElement, {
+  var _usePopper = (0,react_popper__WEBPACK_IMPORTED_MODULE_7__.usePopper)(referenceElement, popperElement, {
       placement: placement,
       modifiers: [{
         name: 'arrow',
@@ -29442,21 +29451,26 @@ var Tooltip = function Tooltip(props) {
         options: {
           offset: [0, 8]
         }
-      }]
+      }],
+      strategy: 'fixed'
     }),
     styles = _usePopper.styles,
     attributes = _usePopper.attributes;
   if (!tooltip) return children;
-  var tooltipNode = visible ? /*#__PURE__*/react_dom__WEBPACK_IMPORTED_MODULE_2___default().createPortal( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(StyledTooltipBody, _extends({
+  var tooltipNode = visible ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(StyledTooltipBody, _extends({
     ref: setPopperElement,
+    role: "tooltip",
     style: styles.popper
-  }, attributes.popper), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_5__.Label, {
+  }, attributes.popper, {
+    onPointerEnter: interactive ? show : undefined,
+    onPointerLeave: interactive ? hide : undefined
+  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_typography__WEBPACK_IMPORTED_MODULE_4__.Label, {
     variant: "sm",
     color: "white"
   }, tooltip), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(StyledTooltipArrow, _extends({
     ref: setArrowElement,
     style: styles.arrow
-  }, attributes.arrow))), document.body) : null;
+  }, attributes.arrow))) : null;
   if (noWrap) {
     var child = react__WEBPACK_IMPORTED_MODULE_1__.Children.only(children);
     return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement((react__WEBPACK_IMPORTED_MODULE_1___default().Fragment), null, /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_1__.cloneElement)(child, {
@@ -29476,23 +29490,24 @@ Tooltip.defaultProps = {
 };
 Tooltip.propTypes = {
   tooltip: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().node),
-  placement: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(_utils__WEBPACK_IMPORTED_MODULE_6__.tooltipPlacements),
-  noWrap: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool)
+  placement: prop_types__WEBPACK_IMPORTED_MODULE_0___default().oneOf(_utils__WEBPACK_IMPORTED_MODULE_5__.tooltipPlacements),
+  noWrap: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool),
+  interactive: (prop_types__WEBPACK_IMPORTED_MODULE_0___default().bool)
 };
 var withTooltip = function withTooltip(Comp, tooltipProps) {
   return function WithTooltip(props) {
     return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(Tooltip, tooltipProps, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(Comp, props));
   };
 };
-var StyledTooltipBody = styled_components__WEBPACK_IMPORTED_MODULE_3___default().div.withConfig({
+var StyledTooltipBody = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "StyledTooltipBody",
   componentId: "sc-146jrck-0"
-})(["background-color:", ";padding:", ";width:fit-content;max-width:500px;border-radius:", ";transition:opacity 200ms;z-index:", ";"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].color.gray_11_50, _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["03"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["02"], _constants__WEBPACK_IMPORTED_MODULE_7__.Z_INDEX.tooltip);
-var StyledTooltipArrow = styled_components__WEBPACK_IMPORTED_MODULE_3___default().div.withConfig({
+})(["background-color:", ";padding:", ";width:fit-content;max-width:500px;border-radius:", ";transition:opacity 200ms;z-index:", ";"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].color.gray_11_50, _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["03"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["02"], _constants__WEBPACK_IMPORTED_MODULE_6__.Z_INDEX.tooltip);
+var StyledTooltipArrow = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "StyledTooltipArrow",
   componentId: "sc-146jrck-1"
-})(["&,&::before{position:absolute;width:", ";height:", ";background:inherit;border-radius:", ";}z-index:-1;visibility:hidden;&::before{visibility:visible;content:'';transform:rotate(45deg);}[data-popper-placement^='top'] > &{bottom:-", ";}[data-popper-placement^='right'] > &{left:-", ";}[data-popper-placement^='bottom'] > &{top:-", ";}[data-popper-placement^='left'] > &{right:-", ";}"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["04"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["04"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["01"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["02"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["02"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["02"], _theme__WEBPACK_IMPORTED_MODULE_4__["default"].spacing["02"]);
-var StyledTooltipReference = styled_components__WEBPACK_IMPORTED_MODULE_3___default().div.withConfig({
+})(["&,&::before{position:absolute;width:", ";height:", ";background:inherit;border-radius:", ";}z-index:-1;visibility:hidden;&::before{visibility:visible;content:'';transform:rotate(45deg);}[data-popper-placement^='top'] > &{bottom:-", ";}[data-popper-placement^='right'] > &{left:-", ";}[data-popper-placement^='bottom'] > &{top:-", ";}[data-popper-placement^='left'] > &{right:-", ";}"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["04"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["04"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["01"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["02"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["02"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["02"], _theme__WEBPACK_IMPORTED_MODULE_3__["default"].spacing["02"]);
+var StyledTooltipReference = styled_components__WEBPACK_IMPORTED_MODULE_2___default().div.withConfig({
   displayName: "StyledTooltipReference",
   componentId: "sc-146jrck-2"
 })(["width:fit-content;"]);