"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = useTooltip;

var _react = require("react");

var _reactDom = require("@floating-ui/react-dom");

var _compileClassNames2 = _interopRequireDefault(require("../../../libraries/compileClassNames"));

var _UCLProvider = require("../../uclprovider/UCLProvider");

var _selectn = _interopRequireDefault(require("selectn"));

var _debounce = _interopRequireDefault(require("../../../utils/debounce"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _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(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }

function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }

function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }

function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }

var staticSide = {
  top: 'bottom',
  right: 'left',
  bottom: 'top',
  left: 'right'
};

function useTooltip(_ref) {
  var _compileClassNames;

  var container = _ref.container,
      style = _ref.style;
  var theme = (0, _UCLProvider.useTheme)();

  var _useState = (0, _react.useState)(null),
      _useState2 = _slicedToArray(_useState, 2),
      title = _useState2[0],
      setTitle = _useState2[1];

  var _useState3 = (0, _react.useState)(false),
      _useState4 = _slicedToArray(_useState3, 2),
      isHtmlTitle = _useState4[0],
      setHtmlTitle = _useState4[1];

  var arrowReference = (0, _react.useRef)(null);
  var themeClassName = style[theme.mode] || style.light;
  var className = (0, _compileClassNames2["default"])((_compileClassNames = {}, _defineProperty(_compileClassNames, style.tooltipContainer, true), _defineProperty(_compileClassNames, style.show, title != null), _defineProperty(_compileClassNames, themeClassName, true), _compileClassNames));

  var _useFloating = (0, _reactDom.useFloating)({
    placement: 'bottom',
    middleware: [(0, _reactDom.offset)(6), (0, _reactDom.flip)(), (0, _reactDom.shift)(), (0, _reactDom.arrow)({
      element: arrowReference
    })]
  }),
      x = _useFloating.x,
      y = _useFloating.y,
      reference = _useFloating.reference,
      floating = _useFloating.floating,
      strategy = _useFloating.strategy,
      middlewareData = _useFloating.middlewareData,
      placement = _useFloating.placement;

  function reset() {
    if (title) {
      setTitle(null);
      setHtmlTitle(false);
    }
  }

  function mouseHover(e) {
    var element = e.target;
    var titleElement = null;

    if (element.hasAttribute('data-title') || element.hasAttribute('title')) {
      titleElement = element;
    } else {
      var closedTitleElement = element.closest('[data-title]');

      if (closedTitleElement) {
        titleElement = closedTitleElement;
      }
    }

    if (titleElement) {
      var _title = titleElement.getAttribute('data-title') || titleDiv.getAttribute('title');

      var _isHtmlTitle = titleElement.getAttribute('data-ishtml');

      setTitle(_title);
      setHtmlTitle(_isHtmlTitle);
      reference(titleElement);
    } else {
      reset();
    }
  }

  function handleClick() {
    reset();
  }

  function mouseLeave() {
    reset();
  }

  var mouseHoverDebounced = (0, _debounce["default"])(mouseHover, 300);
  (0, _react.useEffect)(function () {
    container.addEventListener("mouseover", mouseHoverDebounced);
    container.addEventListener("mouseleave", mouseLeave);
    container.addEventListener("click", handleClick);
    return function () {
      container.removeEventListener("mouseover", mouseHoverDebounced);
      container.removeEventListener("mouseleave", mouseLeave);
      container.removeEventListener("click", handleClick);
    };
  }, [title, container]);
  var arrowX = (0, _selectn["default"])("arrow.x", middlewareData);
  var arrowY = (0, _selectn["default"])("arrow.y", middlewareData);
  return {
    title: title,
    isHtmlTitle: isHtmlTitle,
    className: className,
    floating: floating,
    strategy: strategy,
    x: x,
    y: y,
    arrowReference: arrowReference,
    arrowX: arrowX,
    arrowY: arrowY,
    arrowPlacement: staticSide[placement.split('-')[0]]
  };
}