@bigbinary/neetoui/dist/cjs/Tooltip.js

neetoUI drives the experience at all neeto products

'use strict';

var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
var React = require('react');
var Tippy = require('@tippyjs/react');
var tippy_js = require('tippy.js');
require('react-router-dom');
require('@bigbinary/neeto-hotkeys');
require('./overlayManager.js');
require('@babel/runtime/helpers/classCallCheck');
require('@babel/runtime/helpers/createClass');
require('@bigbinary/neeto-cist');
require('qs');
require('ramda');
require('./index-D0rucYPS.js');
require('i18next');
var usePrefersReducedMotion = require('./usePrefersReducedMotion-DIgi-Aj7.js');
var jsxRuntime = require('react/jsx-runtime');
require('@babel/runtime/helpers/toConsumableArray');
require('dayjs');
require('dayjs/plugin/localeData');
require('dayjs/plugin/utc');
require('dayjs/plugin/weekday');
require('dayjs/plugin/weekOfYear');

var ARROW = "<svg width='12' height='6' viewBox='0 0 10 5' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M10 5H0.926697L3.95208 1.63847C4.74227 0.760478 6.11722 0.754951 6.91445 1.62656L10 5Z' /></svg>";

var _excluded = ["content", "children", "theme", "disabled", "position", "interactive", "hideAfter", "hideOnTargetExit"];
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), true).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var Tooltip = function Tooltip(_ref) {
  var content = _ref.content,
    children = _ref.children,
    _ref$theme = _ref.theme,
    theme = _ref$theme === void 0 ? "dark" : _ref$theme,
    _ref$disabled = _ref.disabled,
    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
    _ref$position = _ref.position,
    position = _ref$position === void 0 ? "auto" : _ref$position,
    _ref$interactive = _ref.interactive,
    interactive = _ref$interactive === void 0 ? false : _ref$interactive,
    _ref$hideAfter = _ref.hideAfter,
    hideAfter = _ref$hideAfter === void 0 ? -1 : _ref$hideAfter,
    _ref$hideOnTargetExit = _ref.hideOnTargetExit,
    hideOnTargetExit = _ref$hideOnTargetExit === void 0 ? false : _ref$hideOnTargetExit,
    otherProps = _objectWithoutProperties(_ref, _excluded);
  var _useState = React.useState(null),
    _useState2 = _slicedToArray(_useState, 2),
    instance = _useState2[0],
    setInstance = _useState2[1];
  var prefersReducedMotion = usePrefersReducedMotion.usePrefersReducedMotion();
  var localProps = {};
  if (hideAfter > 0) {
    localProps["onShow"] = function (instance) {
      return setTimeout(function () {
        var _instance$state;
        return !((_instance$state = instance.state) !== null && _instance$state !== void 0 && _instance$state.isDestroyed) && instance.hide();
      }, hideAfter);
    };
  }
  React.useEffect(function () {
    if (hideOnTargetExit) {
      var intersectionObserver = new IntersectionObserver(function (entries) {
        entries.forEach(function (entry) {
          return !entry.isIntersecting && (instance === null || instance === void 0 ? void 0 : instance.hide());
        });
      });
      (instance === null || instance === void 0 ? void 0 : instance.reference) && intersectionObserver.observe(instance === null || instance === void 0 ? void 0 : instance.reference);
      return function () {
        intersectionObserver.disconnect();
      };
    }
    return undefined;
  }, [instance, hideOnTargetExit]);
  var handleCreate = function handleCreate(instance) {
    var _instance$popper$firs;
    setInstance(instance);
    (_instance$popper$firs = instance.popper.firstElementChild) === null || _instance$popper$firs === void 0 ? void 0 : _instance$popper$firs.setAttribute("data-testid", "tooltip-box");
  };
  return /*#__PURE__*/jsxRuntime.jsx(Tippy, _objectSpread(_objectSpread({
    animation: prefersReducedMotion ? false : "scale-subtle",
    arrow: ARROW,
    duration: prefersReducedMotion ? 0 : [100, 200],
    placement: position,
    plugins: [tippy_js.followCursor],
    role: "tooltip",
    zIndex: 100001,
    onCreate: handleCreate
  }, _objectSpread(_objectSpread({
    content: content,
    disabled: disabled,
    interactive: interactive,
    theme: theme
  }, localProps), otherProps)), {}, {
    children: /*#__PURE__*/React.isValidElement(children) ? children : children && /*#__PURE__*/jsxRuntime.jsx("span", {
      children: children
    })
  }));
};

module.exports = Tooltip;
//# sourceMappingURL=Tooltip.js.map