"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.AdaptablePopover = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const StringExtensions_1 = require("../../Utilities/Extensions/StringExtensions");
const UIHelper_1 = require("../UIHelper");
const ButtonInfo_1 = require("../Components/Buttons/ButtonInfo");
const icons_1 = require("../../components/icons");
const OverlayTrigger_1 = tslib_1.__importDefault(require("../../components/OverlayTrigger"));
const rebass_1 = require("rebass");
class AdaptablePopover extends React.Component {
    render() {
        let messageType = this.props.MessageType != null ? this.props.MessageType : 'Info';
        const showIcon = this.props.showIcon ?? true;
        let useButton = this.props.useButton != null ? this.props.useButton : false;
        let popoverMinWidth = this.props.popoverMinWidth != null ? this.props.popoverMinWidth.toString() + 'px' : 'auto';
        const title = StringExtensions_1.StringExtensions.IsNotNullOrEmpty(this.props.headerText)
            ? this.props.headerText
            : '';
        const popoverClickRootClose = (React.createElement(rebass_1.Box, { className: "ab-Popover", style: {
                margin: '0px',
                padding: '0px',
                minWidth: popoverMinWidth,
                maxWidth: this.props.popoverMaxWidth ?? 300,
            } },
            title ? (React.createElement(rebass_1.Text, { fontSize: 4, padding: 2 }, title)) : null,
            React.createElement(rebass_1.Box, { className: "ab-Popover__body", padding: this.props.popupPadding ?? 2 }, this.props.bodyText.map((textOrHTML, index) => (React.createElement("span", { key: index }, textOrHTML))))));
        const icon = 'info'; // - think this is wrong - UIHelper.getGlyphByMessageType(messageType);
        const color = UIHelper_1.UIHelper.getColorByMessageType(messageType);
        const iconStyle = {
            color,
            fill: 'currentColor',
        };
        return (React.createElement(rebass_1.Flex, { alignItems: "center", className: this.props.className },
            React.createElement(OverlayTrigger_1.default
            // showTriangle
            , { 
                // showTriangle
                visible: this.props.visible, render: () => popoverClickRootClose, showEvent: (this.props.showEvent || 'mouseenter'), hideEvent: (this.props.hideEvent || 'mouseleave'), style: {
                    overflow: 'visible',
                }, defaultZIndex: 100000, alignPosition: this.props.alignPosition }, useButton ? (React.createElement(ButtonInfo_1.ButtonInfo, { style: iconStyle, variant: "text", onClick: () => null, icon: showIcon && icon, tooltip: this.props.tooltipText }, this.props.children)) : (React.createElement("div", { title: this.props.tooltipText, tabIndex: 0, style: { cursor: 'pointer', display: 'inline-block' } },
                this.props.children,
                showIcon && React.createElement(icons_1.Icon, { name: icon, style: iconStyle }))))));
    }
}
exports.AdaptablePopover = AdaptablePopover;
