Pill

import { Pill } from '@mantine/core';

function Demo() {
  return <Pill>React</Pill>;
}

import { Pill, InputBase } from '@mantine/core';

function Demo() {
  const pills = Array(10)
    .fill(0)
    .map((_, index) => (
      <Pill key={index} withRemoveButton>
        Item {index}
      </Pill>
    ));

  return (
    <InputBase component="div" multiline>
      <Pill.Group>{pills}</Pill.Group>
    </InputBase>
  );
}

/*
 * Hover over selectors to apply outline styles
 *
 */