import { Chip as MuiChip } from '@mui/material';
import CancelIcon from '@mui/icons-material/Cancel';

type Tone = 'neutral' | 'info' | 'success' | 'warning' | 'error';

const TONE_MAP: Record<Tone, 'default' | 'info' | 'success' | 'warning' | 'error'> = {
  neutral: 'default',
  info: 'info',
  success: 'success',
  warning: 'warning',
  error: 'error',
};

export interface ChipProps {
  label: string;
  tone?: Tone;
  onDelete?: () => void;
}

export function Chip({ label, tone = 'neutral', onDelete }: ChipProps) {
  return (
    <MuiChip
      label={label}
      color={TONE_MAP[tone]}
      onDelete={onDelete}
      {...(onDelete ? { deleteIcon: <CancelIcon aria-label={`Remove ${label}`} /> } : {})}
    />
  );
}