@patreon/studio
Version:
Patreon Studio Design System
16 lines • 871 B
JSX
import React from 'react';
import { BodyText } from '~/components/BodyText';
import { getIconSize } from '~/components/Button/theme';
import { StyledPill } from './styled-components';
export const Pill = ({ children, icon, disclosureIcon, selected = false, size = 'md', ...props }) => {
const Icon = icon && icon;
const DisclosureIcon = disclosureIcon && disclosureIcon;
return (<StyledPill selected={selected} size={size} hasLabel={!!children} icon={icon} disclosureIcon={disclosureIcon} role="checkbox" aria-checked={selected} {...props}>
{Icon && <Icon color="inherit" size={getIconSize(size)}/>}
{children && (<BodyText as="span" size={size} color="inherit">
{children}
</BodyText>)}
{DisclosureIcon && <DisclosureIcon size={getIconSize(size)} color="inherit"/>}
</StyledPill>);
};
//# sourceMappingURL=Pill.jsx.map