import React from "react";
import Box from "../layout/Box";
import { footerPropTypes } from "./Dialog.propTypes";
import style from "./Dialog.module.css";
import compileClassNames from "../../libraries/compileClassNames";

export default function Footer(props) {
  let defaultCustomId = "footer";
  let { children, customClassName, align, alignContent, alignBox } = props;
  let customClass = compileClassNames(
    {
      [style["footer"]]: true
    },
    {
      [customClassName]: !!customClassName
    }
  );
  return (
    <Box className={customClass} dataId={defaultCustomId}>
      <Box
        alignBox={alignBox}
        isCover={false}
        align={align}
        alignContent={alignContent}
      >
        {children}
      </Box>
    </Box>
  );
}
Footer.defaultProps = {
  align: "vertical",
  alignContent: "start",
  alignBox: "row"
};
Footer.propTypes = footerPropTypes;
