import React from "react";

export default function DataLabel({
  label,
  hideIfNull,
  children,
  vertical,
  visible = true,
  ...props
}) {
  if (!visible || (hideIfNull && !!!children)) return null;

  return (
    <div {...props}>
      <div
        style={{
          display: vertical ? "block" : "inline-block",
          marginRight: ".2rem",
        }}
      >{`${label}: `}</div>
      <div style={{ display: vertical ? "block" : "inline-block" }}>
        {children}
      </div>
    </div>
  );
}
