"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.PanelWithImage = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const styled_components_1 = require("styled-components");
const Panel_1 = tslib_1.__importDefault(require("../../../components/Panel"));
const rebass_1 = require("rebass");
const icons_1 = require("../../../components/icons");
const ButtonInfo_1 = require("../Buttons/ButtonInfo");
//We cannot destructure this.props using the react way in typescript which is a real pain as you
//need to transfer props individually as a consequence
//let { buttonContent, ...other } = this.props
class PanelWithImageCmp extends React.Component {
    render() {
        const IconCmp = icons_1.allIcons[(this.props.icon || this.props.glyphicon)];
        const headerStyle = {};
        if (this.props.headerColor) {
            headerStyle.color = this.props.headerColor;
            headerStyle.fill = this.props.headerColor;
        }
        let headerRow = (React.createElement(rebass_1.Flex, { flex: 1 },
            React.createElement(rebass_1.Flex, { alignItems: "center" },
                React.createElement(rebass_1.Flex, { minHeight: 15, alignItems: "center", style: headerStyle },
                    IconCmp ? React.createElement(IconCmp, null) : null,
                    React.createElement(rebass_1.Box, { marginRight: 2 }),
                    this.props.header ?? '',
                    React.createElement(rebass_1.Box, { marginRight: 2, "data-name": "space-after" }),
                    this.props.infoLink != null && !this.props.infoLinkDisabled && (React.createElement(ButtonInfo_1.ButtonInfo, { onClick: () => window.open(this.props.infoLink, '_blank' // <- opens the link in a new tab or window.
                        ) }))),
                React.createElement(rebass_1.Box, { flex: 1 }),
                this.props.button && React.cloneElement(this.props.button))));
        return (React.createElement(Panel_1.default, { flex: this.props.flex, header: headerRow, variant: this.props.variant, style: this.props.style, bodyScroll: this.props.bodyScroll !== undefined ? this.props.bodyScroll : true, border: "none", borderRadius: this.props.borderRadius || 'none', bodyProps: {
                padding: 0,
                ...this.props.bodyProps,
            } }, this.props.children));
    }
}
// apparently it's very hard to type `withTheme()` result in typescript
// @ts-ignore
exports.PanelWithImage = (0, styled_components_1.withTheme)(PanelWithImageCmp);
