import React from "react";
import compileClassNames from "../../libraries/compileClassNames";
import Box from "../layout/Box";
import Text from "../text/Text";
import { headerPropTypes } from "./Dialog.propTypes";
export default function Header(props) {
  let defaultCustomId = "header";
  let {
    children,
    customClassNames = {},
    cancelIcon,
    onClose
  } = props; // let headerStyle = customClassNames.header ? customClassNames.header : '';
  // let containerStyle = cancelIcon ? (customClassNames.container ? customClassNames.container : '') : '';
  // let textStyle = cancelIcon ? (customClassNames.label ? customClassNames.label : '') : '';
  // let iconStyle = cancelIcon ? (customClassNames.icon ? customClassNames.icon : '') : '';

  let headerStyle = compileClassNames({
    [customClassNames.header]: !!customClassNames.header
  }),
      containerStyle = compileClassNames({
    [customClassNames.container]: !!customClassNames.container
  }),
      textStyle = compileClassNames({
    [customClassNames.label]: !!customClassNames.label
  }),
      iconStyle = compileClassNames({
    [customClassNames.icon]: !!customClassNames.icon
  });
  return cancelIcon ? /*#__PURE__*/React.createElement(Box, {
    dataId: defaultCustomId,
    className: headerStyle
  }, /*#__PURE__*/React.createElement(Box, {
    className: containerStyle,
    align: "vertical",
    alignBox: "row",
    isCover: false,
    wrap: "wrap"
  }, /*#__PURE__*/React.createElement(Box, {
    flexible: true,
    basis: true,
    className: textStyle
  }, typeof children == 'string' ? /*#__PURE__*/React.createElement(Text, {
    content: children,
    weight: "bold",
    size: "sm",
    tagName: "h4"
  }) : children), /*#__PURE__*/React.createElement(Box, {
    className: iconStyle
  }, typeof cancelIcon == 'boolean' ? /*#__PURE__*/React.createElement(Text, {
    content: "X",
    weight: "bold",
    size: "lg",
    onClick: onClose
  }) : cancelIcon))) : /*#__PURE__*/React.createElement(Box, {
    dataId: defaultCustomId,
    className: headerStyle
  }, typeof children == 'string' ? /*#__PURE__*/React.createElement(Text, {
    content: children,
    weight: "bold",
    size: "lg"
  }) : children);
}
Header.propTypes = headerPropTypes;