"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.baseClassName = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const rebass_1 = require("rebass");
const join_1 = tslib_1.__importDefault(require("../utils/join"));
exports.baseClassName = 'ab-Panel';
const Header = ({ children, variant = 'default', ...headerProps }) => {
    if (!children) {
        return null;
    }
    const style = {};
    return (React.createElement(rebass_1.Flex, { flexDirection: "row", alignItems: "center", ...headerProps, style: { ...style, ...headerProps.style }, className: (0, join_1.default)(`${exports.baseClassName}__header`, `${exports.baseClassName}__header--variant-${variant}`) }, children));
};
const Body = ({ children, bodyScroll, variant, ...bodyProps }) => {
    if (!children) {
        return null;
    }
    if (bodyScroll === true) {
        bodyScroll = 'auto';
    }
    return (React.createElement(rebass_1.Box, { ...bodyProps, className: (0, join_1.default)(`${exports.baseClassName}__body`, variant && `${exports.baseClassName}__body--variant-${variant}`, bodyScroll ? `${exports.baseClassName}__body--scroll-${bodyScroll}` : null) }, children));
};
const Panel = (props) => {
    const { borderRadius, border, className, header, children, headerProps, bodyProps, bodyScroll, variant = 'default', ...boxProps } = props;
    const style = {};
    if (borderRadius !== undefined) {
        style['--ab-cmp-panel__border-radius'] =
            typeof borderRadius == 'number' ? `var(--ab-space-${borderRadius})` : borderRadius;
    }
    const headerStyle = {
        border,
        ...(headerProps ? headerProps.style : null),
    };
    const bodyStyle = {
        border,
        ...(bodyProps ? bodyProps.style : null),
    };
    return (React.createElement(rebass_1.Box, { ...boxProps, style: { ...style, ...boxProps.style }, className: (0, join_1.default)(className, exports.baseClassName, `${exports.baseClassName}--variant-${variant}`, !header ? `${exports.baseClassName}--no-header` : `${exports.baseClassName}--with-header`) },
        React.createElement(Header, { ...headerProps, style: headerStyle, variant: variant }, header),
        React.createElement(Body, { ...bodyProps, style: bodyStyle, bodyScroll: bodyScroll, variant: variant }, children)));
};
exports.default = Panel;
