"use strict";
// @ts-nocheck
exports.__esModule = true;
exports.Tooltip = exports.tooltipPropStatus = exports.tooltipPropSizesDefault = exports.tooltipPropSizes = void 0;
var tslib_1 = require("tslib");
require("./Tooltip.css");
var react_1 = (0, tslib_1.__importStar)(require("react"));
var bem_1 = require("../../utils/bem");
var Popover_1 = require("../Popover/Popover");
var Theme_1 = require("../Theme/Theme");
var Typography_1 = require("../Typography");
var ARROW_SIZE = 6;
var cnTooltip = (0, bem_1.cn)('Tooltip');
exports.tooltipPropSizes = ['m', 's', 'l'];
exports.tooltipPropSizesDefault = exports.tooltipPropSizes[0];
exports.tooltipPropStatus = ['normal', 'alert', 'success', 'warning'];
function renderChildren(children) {
    return typeof children === 'string' || typeof children === 'number' ? (react_1["default"].createElement(Typography_1.Typography.Text, { weight: "bold" }, children)) : (children);
}
exports.Tooltip = react_1["default"].forwardRef(function (props, ref) {
    var _a;
    var children = props.children, _b = props.size, size = _b === void 0 ? exports.tooltipPropSizesDefault : _b, className = props.className, status = props.status, onSetDirectionProp = props.onSetDirection, style = props.style, staticPosition = props.staticPosition, directionPosition = props.directionPosition, opacity = props.opacity, view = props.view, rest = (0, tslib_1.__rest)(props, ["children", "size", "className", "status", "onSetDirection", "style", "staticPosition", "directionPosition", "opacity", "view"]);
    var theme = (0, Theme_1.useTheme)().theme;
    var _c = (0, tslib_1.__read)((0, react_1.useState)(undefined), 2), direction = _c[0], setDirection = _c[1];
    var tooltipTheme = status
        ? (0, tslib_1.__assign)((0, tslib_1.__assign)({}, theme), { color: {
                primary: theme.color.primary
            } }) : (0, tslib_1.__assign)((0, tslib_1.__assign)({}, theme), { color: {
            primary: theme.color.primary
        } });
    var tooltipThemeClassNames = (0, Theme_1.generateThemeClassNames)(tooltipTheme);
    var onSetDirection = function (direction) {
        onSetDirectionProp && onSetDirectionProp(direction);
        setDirection(direction);
    };
    if (staticPosition) {
        return (react_1["default"].createElement("div", (0, tslib_1.__assign)({}, rest, { ref: ref, className: cnTooltip({ status: status, staticPosition: staticPosition, view: view, size: size }, [className]), style: (0, tslib_1.__assign)({}, style) }),
            react_1["default"].createElement("div", { className: cnTooltip('Background') }),
            react_1["default"].createElement("div", { className: cnTooltip('Arrow', { direction: directionPosition }) }),
            react_1["default"].createElement("div", { className: cnTooltip('Content', { size: size }) }, renderChildren(children))));
    }
    return (react_1["default"].createElement(Theme_1.ThemeContext.Provider, { value: { theme: tooltipTheme, themeClassNames: tooltipThemeClassNames } },
        react_1["default"].createElement(Popover_1.Popover, (0, tslib_1.__assign)({}, rest, { offset: ARROW_SIZE + 10, onSetDirection: onSetDirection, ref: ref, className: cnTooltip({ status: status }, [className]), style: (0, tslib_1.__assign)((_a = {}, _a['--tooltip-arrow-size'] = "".concat(ARROW_SIZE, "px"), _a), style) }),
            react_1["default"].createElement("div", { className: cnTooltip('Background') }),
            react_1["default"].createElement("div", { className: cnTooltip('Arrow', { direction: direction }) }),
            react_1["default"].createElement("div", { className: cnTooltip('Content', { size: size }) }, renderChildren(children)))));
});
