@lumx/react 3.6.0 → 3.6.1-alpha-chore-dependency-updates.0

package/index.js

@@ -25,26 +25,40 @@ import chunk from 'lodash/chunk';
 import isUndefined from 'lodash/isUndefined';
 import set from 'lodash/set';
 
-function ownKeys(object, enumerableOnly) {
-  var keys = Object.keys(object);
+function ownKeys(e, r) {
+  var t = Object.keys(e);
   if (Object.getOwnPropertySymbols) {
-    var symbols = Object.getOwnPropertySymbols(object);
-    enumerableOnly && (symbols = symbols.filter(function (sym) {
-      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-    })), keys.push.apply(keys, symbols);
+    var o = Object.getOwnPropertySymbols(e);
+    r && (o = o.filter(function (r) {
+      return Object.getOwnPropertyDescriptor(e, r).enumerable;
+    })), t.push.apply(t, o);
   }
-  return keys;
+  return t;
 }
-function _objectSpread2(target) {
-  for (var i = 1; i < arguments.length; i++) {
-    var source = null != arguments[i] ? arguments[i] : {};
-    i % 2 ? ownKeys(Object(source), !0).forEach(function (key) {
-      _defineProperty(target, key, source[key]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) {
-      Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+function _objectSpread2(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 target;
+  return e;
+}
+function _toPrimitive(t, r) {
+  if ("object" != typeof t || !t) return t;
+  var e = t[Symbol.toPrimitive];
+  if (void 0 !== e) {
+    var i = e.call(t, r || "default");
+    if ("object" != typeof i) return i;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return ("string" === r ? String : Number)(t);
+}
+function _toPropertyKey(t) {
+  var i = _toPrimitive(t, "string");
+  return "symbol" == typeof i ? i : String(i);
 }
 function _defineProperty(obj, key, value) {
   key = _toPropertyKey(key);
@@ -101,20 +115,6 @@ function _objectWithoutProperties(source, excluded) {
   }
   return target;
 }
-function _toPrimitive(input, hint) {
-  if (typeof input !== "object" || input === null) return input;
-  var prim = input[Symbol.toPrimitive];
-  if (prim !== undefined) {
-    var res = prim.call(input, hint || "default");
-    if (typeof res !== "object") return res;
-    throw new TypeError("@@toPrimitive must return a primitive value.");
-  }
-  return (hint === "string" ? String : Number)(input);
-}
-function _toPropertyKey(arg) {
-  var key = _toPrimitive(arg, "string");
-  return typeof key === "symbol" ? key : String(key);
-}
 
 /**
  * Alignments.
@@ -378,7 +378,7 @@ const CSS_PREFIX = 'lumx';
  */
 const TOOLTIP_HOVER_DELAY = {
   open: 500,
-  close: 0
+  close: 500
 };
 
 /**
@@ -3477,7 +3477,7 @@ const ListItem = /*#__PURE__*/forwardRef((props, ref) => {
   }), isClickable({
     linkProps,
     onItemSelected
-  }) ? /* Clickable list item */
+  }) ? ( /* Clickable list item */
   renderLink(_objectSpread2(_objectSpread2({
     linkAs,
     tabIndex: !isDisabled && role === 'button' ? 0 : undefined,
@@ -3494,7 +3494,7 @@ const ListItem = /*#__PURE__*/forwardRef((props, ref) => {
     onClick: isDisabled ? undefined : onItemSelected,
     onKeyDown,
     ref: linkRef
-  }), content) :
+  }), content)) :
   /*#__PURE__*/
   /* Non clickable list item */
   React.createElement("div", {
@@ -11873,15 +11873,16 @@ const TabProvider = props => {
 TabProvider.defaultProps = DEFAULT_PROPS$W;
 
 const _excluded$1i = ["aria-label", "children", "className", "layout", "position", "theme"];
-let TabListLayout;
+let TabListLayout = /*#__PURE__*/function (TabListLayout) {
+  TabListLayout["clustered"] = "clustered";
+  TabListLayout["fixed"] = "fixed";
+  return TabListLayout;
+}({});
 
 /**
  * Defines the props of the component.
  */
-(function (TabListLayout) {
-  TabListLayout["clustered"] = "clustered";
-  TabListLayout["fixed"] = "fixed";
-})(TabListLayout || (TabListLayout = {}));
+
 /**
  * Component display name.
  */
@@ -12828,6 +12829,11 @@ const browserDoesNotSupportHover = () => {
  */
 function useTooltipOpen(delay, anchorElement) {
   const [isOpen, setIsOpen] = useState(false);
+  const onPopperMount = useRef(null);
+
+  // Global close on escape
+  const [closeCallback, setCloseCallback] = useState(undefined);
+  useCallbackOnEscape(closeCallback);
   useEffect(() => {
     if (!anchorElement) {
       return undefined;
@@ -12859,45 +12865,57 @@ function useTooltipOpen(delay, anchorElement) {
     };
 
     // Close or cancel opening of tooltip
-    const close = function () {
+    const getClose = function () {
       let overrideDelay = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : closeDelay;
       if (!shouldOpen && !timer) return;
       shouldOpen = false;
       deferUpdate(overrideDelay);
     };
-    const closeImmediately = () => close(0);
-
-    /**
-     * Handle touchend event
-     * If `touchend` comes before the open delay => cancel tooltip (close immediate).
-     * Else if `touchend` comes after the open delay => tooltip takes priority, the anchor's default touch end event is prevented.
-     */
-    const touchEnd = evt => {
-      if (!openStartTime) return;
-      if (Date.now() - openStartTime >= openDelay) {
-        // Tooltip take priority, event prevented.
-        evt.stopPropagation();
-        evt.preventDefault();
-        anchorElement.focus();
-        // Close with delay.
-        close();
-      } else {
-        // Close immediately.
-        closeImmediately();
-      }
-    };
+    const close = () => getClose(closeDelay);
+    const closeImmediately = () => getClose(0);
+    setCloseCallback(() => closeImmediately);
 
     // Adapt event to browsers with or without `hover` support.
-    const events = hoverNotSupported ? [[anchorElement, hasTouch ? 'touchstart' : 'mousedown', open], [anchorElement, hasTouch ? 'touchend' : 'mouseup', touchEnd]] : [[anchorElement, 'mouseenter', open], [anchorElement, 'mouseleave', close], [anchorElement, 'mouseup', closeImmediately]];
+    const events = [];
+    if (hoverNotSupported) {
+      /**
+       * Handle touchend event
+       * If end comes before the open delay => cancel tooltip (close immediate).
+       * Else if end comes after the open delay => tooltip takes priority, the anchor's default touch end event is prevented.
+       */
+      const longPressEnd = evt => {
+        if (!openStartTime) return;
+        if (Date.now() - openStartTime >= openDelay) {
+          // Tooltip take priority, event prevented.
+          evt.stopPropagation();
+          evt.preventDefault();
+          anchorElement.focus();
+          // Close with delay.
+          close();
+        } else {
+          // Close immediately.
+          closeImmediately();
+        }
+      };
+      events.push([anchorElement, hasTouch ? 'touchstart' : 'mousedown', open], [anchorElement, hasTouch ? 'touchend' : 'mouseup', longPressEnd]);
+    } else {
+      events.push([anchorElement, 'mouseenter', open], [anchorElement, 'mouseleave', close], [anchorElement, 'mouseup', closeImmediately]);
+      onPopperMount.current = popperElement => {
+        if (!popperElement) return;
+        // Popper element hover
+        popperElement.addEventListener('mouseenter', open);
+        popperElement.addEventListener('mouseleave', close);
+        // Add to event list to remove on unmount
+        events.push([popperElement, 'mouseenter', open], [popperElement, 'mouseleave', close]);
+      };
+    }
 
     // Events always applied no matter the browser:.
     events.push(
     // Open on focus.
     [anchorElement, 'focusin', open],
     // Close on lost focus.
-    [anchorElement, 'focusout', closeImmediately],
-    // Close on ESC keydown
-    [anchorElement, 'keydown', onEscapePressed(closeImmediately)]);
+    [anchorElement, 'focusout', closeImmediately]);
 
     // Attach events
     for (const [node, eventType, eventHandler] of events) {
@@ -12913,7 +12931,10 @@ function useTooltipOpen(delay, anchorElement) {
       }
     };
   }, [anchorElement, delay]);
-  return isOpen;
+  return {
+    isOpen,
+    onPopperMount: onPopperMount.current
+  };
 }
 
 const _excluded$1o = ["label", "children", "className", "delay", "placement", "forceOpen"];
@@ -12984,10 +13005,14 @@ const Tooltip = /*#__PURE__*/forwardRef((props, ref) => {
     }]
   });
   const position = (_attributes$popper$da = attributes === null || attributes === void 0 ? void 0 : (_attributes$popper = attributes.popper) === null || _attributes$popper === void 0 ? void 0 : _attributes$popper['data-popper-placement']) !== null && _attributes$popper$da !== void 0 ? _attributes$popper$da : placement;
-  const isOpen = useTooltipOpen(delay, anchorElement) || forceOpen;
+  const {
+    isOpen: isActivated,
+    onPopperMount
+  } = useTooltipOpen(delay, anchorElement);
+  const isOpen = isActivated || forceOpen;
   const wrappedChildren = useInjectTooltipRef(children, setAnchorElement, isOpen, id);
   return /*#__PURE__*/React.createElement(React.Fragment, null, wrappedChildren, isOpen && /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement("div", _extends({
-    ref: mergeRefs(ref, setPopperElement)
+    ref: mergeRefs(ref, setPopperElement, onPopperMount)
   }, forwardedProps, {
     id: id,
     role: "tooltip",