import { __read } from "tslib";
import React, { useState, useEffect, useRef, useMemo } from "react";
import { createPortal } from "react-dom";
import { calculateSizeAnPositionElement } from "../helpers/getPosition/helpers";
import TooltipContent from "./components/TooltipContent";
import { TooltipStyled } from "./styles";
var Tooltip = function (_a) {
    var children = _a.children, _b = _a.direction, direction = _b === void 0 ? "top" : _b, text = _a.text, onVisibleChange = _a.onVisibleChange, isTrail = _a.isTrail, trailText = _a.trailText, isShadow = _a.isShadow, _c = _a.defaultIsVisible, defaultIsVisible = _c === void 0 ? false : _c, className = _a.className, _d = _a.isShow, isShow = _d === void 0 ? true : _d;
    var _e = __read(useState(typeof defaultIsVisible === "undefined" ? false : defaultIsVisible), 2), isVisible = _e[0], setIsVisible = _e[1];
    var _f = __read(useState(null), 2), containerTooltip = _f[0], setContainerTooltip = _f[1];
    var anchorComponentRef = useRef(null);
    var anchorSizeAndPosition = useMemo(function () { return calculateSizeAnPositionElement(anchorComponentRef.current); }, [isVisible]);
    useEffect(function () {
        var container = document.getElementsByTagName("body").item(0);
        setContainerTooltip(container);
    }, []);
    useEffect(function () {
        onVisibleChange && onVisibleChange(isVisible || false);
    }, [isVisible]);
    var isTouch = "ontouchstart" in window || navigator.maxTouchPoints > 0;
    var handleMouseEnter = function () {
        if (isShow) {
            setIsVisible(true);
        }
    };
    var handleMouseLeave = function () {
        setIsVisible(false);
    };
    return isTouch ? (children) : (React.createElement(TooltipStyled, { ref: anchorComponentRef, onMouseOver: handleMouseEnter, onMouseOut: handleMouseLeave, className: className },
        children,
        containerTooltip &&
            isVisible &&
            text &&
            createPortal(React.createElement(TooltipContent, { direction: direction, anchorSizeAndPosition: anchorSizeAndPosition, text: text, trailText: trailText, isShadow: isShadow, isTrail: isTrail }), containerTooltip)));
};
Tooltip.displayName = "Tooltip";
export default Tooltip;
