Usage
import { Pill } from '@loomhq/lens'
<Pill color='white' backgroundColor='grey7'>Pill</Pill>
Color
Use one of the pallete colors.
<Distribute gap='small' alignment='center'>
<Pill color='grey8' backgroundColor='yellow'>Pill</Pill>
<Pill color='white' backgroundColor='grey7'>Pill</Pill>
<Pill color='grey8' backgroundColor='blue'>Pill</Pill>
</Distribute>
Icon
<Distribute gap='small' alignment='center'>
<Pill
icon={<SvgArrowForward />}
iconPosition='left'
color='grey8'
backgroundColor='grey2'
>
Icon on left
</Pill>
<Pill
icon={<SvgArrowForward />}
iconPosition='right'
color='grey8'
backgroundColor='grey2'
>
Icon on right
</Pill>
</Distribute>
Props
iconPosition
oneOf: 'left', 'right'
'left'