import _extends from "@babel/runtime/helpers/esm/extends";
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
var _excluded = ["children", "initialVisible", "text", "offset", "placement", "portalClassName", "enterDelay", "leaveDelay", "trigger", "type", "className", "onVisibleChange", "hideArrow", "visible"];
import _JSXStyle from "../styled-jsx.es.js";
/* "use client" */

import React, { useEffect, useMemo, useRef, useState } from 'react';
import TooltipContent from './tooltip-content';
import useClickAway from '../utils/use-click-away';
import { withScale } from '../use-scale';
import { getRect } from './helper';
import useClasses from '../use-classes';
var TooltipComponent = function TooltipComponent(_ref) {
  var children = _ref.children,
    _ref$initialVisible = _ref.initialVisible,
    initialVisible = _ref$initialVisible === void 0 ? false : _ref$initialVisible,
    text = _ref.text,
    _ref$offset = _ref.offset,
    offset = _ref$offset === void 0 ? 12 : _ref$offset,
    _ref$placement = _ref.placement,
    placement = _ref$placement === void 0 ? 'top' : _ref$placement,
    _ref$portalClassName = _ref.portalClassName,
    portalClassName = _ref$portalClassName === void 0 ? '' : _ref$portalClassName,
    _ref$enterDelay = _ref.enterDelay,
    enterDelay = _ref$enterDelay === void 0 ? 100 : _ref$enterDelay,
    _ref$leaveDelay = _ref.leaveDelay,
    leaveDelay = _ref$leaveDelay === void 0 ? 150 : _ref$leaveDelay,
    _ref$trigger = _ref.trigger,
    trigger = _ref$trigger === void 0 ? 'hover' : _ref$trigger,
    _ref$type = _ref.type,
    type = _ref$type === void 0 ? 'default' : _ref$type,
    _ref$className = _ref.className,
    className = _ref$className === void 0 ? '' : _ref$className,
    _ref$onVisibleChange = _ref.onVisibleChange,
    onVisibleChange = _ref$onVisibleChange === void 0 ? function () {} : _ref$onVisibleChange,
    _ref$hideArrow = _ref.hideArrow,
    hideArrow = _ref$hideArrow === void 0 ? false : _ref$hideArrow,
    customVisible = _ref.visible,
    props = _objectWithoutProperties(_ref, _excluded);
  var timer = useRef();
  var ref = useRef(null);
  var _useState = useState(initialVisible),
    _useState2 = _slicedToArray(_useState, 2),
    visible = _useState2[0],
    setVisible = _useState2[1];
  var iconOffset = useMemo(function () {
    if (!(ref !== null && ref !== void 0 && ref.current)) return {
      x: '0.75em',
      y: '0.75em'
    };
    var rect = getRect(ref);
    return {
      x: "".concat(rect.width ? rect.width / 2 : 0, "px"),
      y: "".concat(rect.height ? rect.height / 2 : 0, "px")
    };
  }, [ref === null || ref === void 0 ? void 0 : ref.current]);
  var contentProps = {
    type: type,
    visible: visible,
    offset: offset,
    placement: placement,
    hideArrow: hideArrow,
    iconOffset: iconOffset,
    parent: ref,
    className: portalClassName
  };
  var changeVisible = function changeVisible(nextState) {
    var clear = function clear() {
      clearTimeout(timer.current);
      timer.current = undefined;
    };
    var handler = function handler(nextState) {
      setVisible(nextState);
      onVisibleChange(nextState);
      clear();
    };
    clear();
    if (nextState) {
      timer.current = window.setTimeout(function () {
        return handler(true);
      }, enterDelay);
      return;
    }
    var leaveDelayWithoutClick = trigger === 'click' ? 0 : leaveDelay;
    timer.current = window.setTimeout(function () {
      return handler(false);
    }, leaveDelayWithoutClick);
  };
  var mouseEventHandler = function mouseEventHandler(next) {
    return trigger === 'hover' && changeVisible(next);
  };
  var clickEventHandler = function clickEventHandler() {
    return trigger === 'click' && changeVisible(!visible);
  };
  useClickAway(ref, function () {
    return trigger === 'click' && changeVisible(false);
  });
  useEffect(function () {
    if (customVisible === undefined) return;
    changeVisible(customVisible);
  }, [customVisible]);
  return /*#__PURE__*/React.createElement("div", _extends({
    ref: ref,
    onClick: clickEventHandler,
    onMouseEnter: function onMouseEnter() {
      return mouseEventHandler(true);
    },
    onMouseLeave: function onMouseLeave() {
      return mouseEventHandler(false);
    }
  }, props, {
    className: "jsx-418573366" + " " + (props && props.className != null && props.className || useClasses('tooltip', className) || "")
  }), children, /*#__PURE__*/React.createElement(TooltipContent, contentProps, text), /*#__PURE__*/React.createElement(_JSXStyle, {
    id: "418573366"
  }, ".tooltip.jsx-418573366{width:-webkit-max-content;width:-moz-max-content;width:max-content;display:inline-block;}"));
};
TooltipComponent.displayName = 'Tooltip';
var Tooltip = withScale(TooltipComponent);
export default Tooltip;