import * as React from 'react';
import styles from './Pill.module.scss';
import { PillKind } from '../types/domain';

interface PillProps {
  kind: PillKind;
  solid?: boolean; // залитая пилюля (напр. «РЕКОМЕНДУЕТСЯ», «Выбран»)
  children: React.ReactNode;
}

// Единая статус-пилюля формы: цвет по kind, залитая/мягкая по solid.
export function Pill({ kind, solid, children }: PillProps): JSX.Element {
  const className = [styles.pill, styles[kind], solid ? styles.solid : ''].filter(Boolean).join(' ');
  return <span className={className}>{children}</span>;
}