import { Box, Chip } from '@mui/material';

export const StageStatusChip = ({ label, bg, color, border }) => {
  return (
    <Chip
      label={label}
      size="small"
      icon={
        <Box
          sx={{
            width: '0.25rem',
            height: '0.25rem',
            borderRadius: '50%',
            backgroundColor: color,
          }}
        />
      }
      sx={{
        border: `0.0625rem solid ${border}`,
        borderRadius: '0.5rem',
        height: '1.25rem',
        background: bg,
        color: color,
        fontSize: '0.75rem',
        '& .MuiChip-icon': {
          marginLeft: '0.5rem',
        },
        '& .MuiChip-label': {
          padding: '0.125rem 0.5rem',
          marginLeft: '0.2rem',
        },
      }}
    />
  );
};
