import * as React from 'react';
import SimpleButton from '../../../components/SimpleButton';
import Panel from '../../../components/Panel';
import { Flex, Box } from 'rebass';
import { allIcons } from '../../../components/icons';
import { ButtonInfo } from '../Buttons/ButtonInfo';
export const PanelWithButton = (props) => {
    const { buttonContent } = props;
    const IconCmp = allIcons[props.glyphicon];
    const header = (React.createElement(Flex, { alignItems: "center", width: "100%" },
        React.createElement(Flex, { alignItems: "center" },
            props.glyphicon != null && (IconCmp ? React.createElement(IconCmp, null) : null),
            React.createElement(Box, { marginRight: 2, "data-name": "space-before" }),
            props.headerText,
            React.createElement(Box, { marginRight: 2, "data-name": "space-after" }),
            props.infoLink != null && !props.infoLinkDisabled && (React.createElement(ButtonInfo, { onClick: () => window.open(props.infoLink, '_blank') }))),
        React.createElement(Box, { style: { flex: 1 } }),
        buttonContent ? (React.createElement(SimpleButton, { variant: "raised", tone: "accent", disabled: props.buttonDisabled, onClick: () => (props.buttonClick ? props.buttonClick() : null) }, buttonContent)) : null,
        props.button ? React.cloneElement(props.button) : null));
    return (React.createElement(Panel, { flex: 1, className: props.className, bodyScroll: props.bodyScroll != null ? props.bodyScroll : true, bodyProps: props.bodyProps, variant: props.variant || 'primary', header: header, headerProps: props.headerProps, style: props.style, borderRadius: (props.borderRadius || 'none'), border: (props.border || 'none') }, props.children));
};
