import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { Box } from '../box';
import { useStyleConfig, vui } from '../core';
import { cs, isJsx, isReactText, isString } from '../utils';
import { useDialogContext } from './context';
import DialogCloseButton from './dialogCloseButton';
import DialogIcon from './dialogIcon';
import DialogTitle from './dialogTitle';
/** Shows title, status icon and close button above the Dialog Body. */
export const DialogHeader = vui((props, ref) => {
    const { children, className, closeButton, icon: iconProp, title: titleProp, ...rest } = props;
    const { onClose, status } = useDialogContext() ?? {};
    const styles = useStyleConfig('Dialog', useDialogContext());
    const icon = isString(iconProp) ? { name: iconProp } : iconProp;
    const showCloseButton = Boolean(closeButton !== undefined ? closeButton : onClose);
    const showIcon = Boolean(icon || status);
    const title = isReactText(titleProp) ? { text: titleProp } : titleProp;
    return (_jsx(Box, { className: cs('vui-dialogHeader', className), icon: icon, pb: 1.5, pl: 3, position: "relative", pr: 8, pt: 3, ref: ref, ...styles.header, ...rest, children: children ?? (_jsxs(_Fragment, { children: [isJsx(icon) ? icon : showIcon && _jsx(DialogIcon, { ...icon }), isJsx(title) ? title : title && _jsx(DialogTitle, { ...title }), isJsx(closeButton) ? closeButton : showCloseButton && _jsx(DialogCloseButton, {})] })) }));
});
DialogHeader.displayName = 'DialogHeader';
export default DialogHeader;
//# sourceMappingURL=dialogHeader.js.map