/**
 * 单列cell
 */
import React, { FC } from "react";
import clsx from "clsx";

export interface CellProps {
  /** label */
  label: React.ReactNode | string;
  value: React.ReactNode | string;
  unit?: string;
  className?: string;
}
export const Cell: FC<CellProps> = props => {
  const { unit } = props;
  return (
    <div className={clsx("flex  justify-between items-center", props.className)}>
      <div>{props.label}</div>
      <div className="text-gray-16 font-medium">
        {props.value}
        {unit ? <span className="ml-[2px]">{unit}</span> : ""}
      </div>
    </div>
  );
};