import './Tooltip.css';

export type TooltipData = { label: string; value?: string | number } & {
  formattedValue?: string;
};

export const Tooltip = ({ data }: { data: TooltipData }) => {
  const label = data.label;
  const value = data.formattedValue || data.value;
  return (
    <div className="infografika infografika-tooltip">
      <div className="infografika-tooltip__item">
        {label && <div className="infografika-tooltip__label">{label}</div>}
        {value && <div className="infografika-tooltip__value">{value}</div>}
      </div>
    </div>
  );
};