(function (factory) {
    if (typeof module === "object" && typeof module.exports === "object") {
        var v = factory(require, exports);
        if (v !== undefined) module.exports = v;
    }
    else if (typeof define === "function" && define.amd) {
        define(["require", "exports", "tslib", "react", "react-transition-group", "../../styles", "../../../typography/P2", "../../../typography/H", "../../../helpers/getPosition/helpers", "../../../hooks/useReposition", "../../../Button"], factory);
    }
})(function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var tslib_1 = require("tslib");
    var react_1 = (0, tslib_1.__importStar)(require("react"));
    var react_transition_group_1 = require("react-transition-group");
    var styles_1 = require("../../styles");
    var P2_1 = (0, tslib_1.__importDefault)(require("../../../typography/P2"));
    var H_1 = (0, tslib_1.__importDefault)(require("../../../typography/H"));
    var helpers_1 = require("../../../helpers/getPosition/helpers");
    var useReposition_1 = require("../../../hooks/useReposition");
    var Button_1 = (0, tslib_1.__importDefault)(require("../../../Button"));
    var DEFAULT_DIRECTION = "top";
    var TIMEOUT_TRANSITION = 100;
    var PopoverContent = function (_a) {
        var title = _a.title, description = _a.description, direction = _a.direction, anchorSizeAndPosition = _a.anchorSizeAndPosition, onPrimaryButton = _a.onPrimaryButton, onSecondaryButton = _a.onSecondaryButton, handleClose = _a.handleClose, primaryButtonContent = _a.primaryButtonContent, secondaryButtonContent = _a.secondaryButtonContent, isPrimaryButton = _a.isPrimaryButton, isSecondaryButton = _a.isSecondaryButton, className = _a.className;
        var _b = (0, tslib_1.__read)((0, react_1.useState)(direction || DEFAULT_DIRECTION), 2), _direction = _b[0], setDirection = _b[1];
        var _c = (0, tslib_1.__read)((0, react_1.useState)(helpers_1.DEFAULT_SIZE_AND_POSITION_ELEMENT), 2), textContentSize = _c[0], setTextContentSize = _c[1];
        var textContentRef = (0, react_1.useRef)(null);
        (0, react_1.useEffect)(function () {
            setTextContentSize((0, helpers_1.calculateSizeAnPositionElement)(textContentRef.current));
        }, []);
        var callComputedDirection = function () {
            var computedDirection = (0, helpers_1.getComputedDirection)({
                componentSizeAndPosition: anchorSizeAndPosition,
                textContentSize: textContentSize,
                offset: styles_1.MARGIN,
                direction: direction || DEFAULT_DIRECTION
            });
            setDirection(computedDirection);
        };
        (0, react_1.useEffect)(function () {
            callComputedDirection();
        }, [textContentSize]);
        var handlePrimaryClick = function (event) {
            onPrimaryButton === null || onPrimaryButton === void 0 ? void 0 : onPrimaryButton(event);
            handleClose === null || handleClose === void 0 ? void 0 : handleClose();
        };
        var handleSecondaryClick = function (event) {
            onSecondaryButton === null || onSecondaryButton === void 0 ? void 0 : onSecondaryButton(event);
            handleClose === null || handleClose === void 0 ? void 0 : handleClose();
        };
        (0, react_1.useEffect)(function () {
            setDirection(direction || DEFAULT_DIRECTION);
        }, [direction]);
        (0, useReposition_1.useReposition)(callComputedDirection);
        return (react_1.default.createElement(react_transition_group_1.CSSTransition, { in: textContentSize.width !== 0, timeout: TIMEOUT_TRANSITION, classNames: "Popover-content" },
            react_1.default.createElement(styles_1.PopoverContentWrapper, { onMouseDown: function (e) { return e.preventDefault(); }, className: className, ref: textContentRef, direction: _direction, componentSizeAndPosition: anchorSizeAndPosition, textContentSize: textContentSize },
                react_1.default.createElement("div", { className: "popoverHeader" },
                    title && react_1.default.createElement(H_1.default, { type: "capricornus" }, title),
                    description && react_1.default.createElement(P2_1.default, { type: "corvus" }, description)),
                react_1.default.createElement("div", { className: "buttonHolder" },
                    isSecondaryButton && secondaryButtonContent && (react_1.default.createElement(Button_1.default, { size: "s", viewType: "ghost", onClick: function (e) { return handleSecondaryClick(e); } }, secondaryButtonContent)),
                    isPrimaryButton && primaryButtonContent && (react_1.default.createElement(Button_1.default, { size: "s", viewType: "link", onClick: function (e) { return handlePrimaryClick(e); } }, primaryButtonContent))))));
    };
    exports.default = PopoverContent;
});
