import { IfActive } from "../../../application/index.js";
import classnames from 'classnames';
import { useContestMetadata } from "../../../../hooks/election/index.js";
import { useResultsTableFormatContext } from '../context';
import classes from './styles.module.scss';
import Header from '../Header';
import Body from '../Body';
import Footer from '../Footer';
import typography from '../typography.module.scss';
const Table = function Table(props) {
  const {
    id
  } = props;
  const {
    size,
    showVotes,
    disableFooter,
    format
  } = useResultsTableFormatContext();
  const meta = useContestMetadata(id);
  if (!meta) {
    return null;
  }
  const {
    isUncontested
  } = meta;
  return <div role="table" className={classnames(classes.container, classes[size], classes[format], typography[format], typography[size], {
    [classes.uncontested]: isUncontested
  })}>
      <IfActive active={showVotes}>
        <Header id={id} />
      </IfActive>
      <Body id={id} />
      <IfActive active={!disableFooter}>
        <Footer id={id} />
      </IfActive>
    </div>;
};
export default Table;