Sha256: 001a13fe7aa67cdabe8734b6e359b092b6934a6b2907f0946dd938e4e853f55a
Contents?: true
Size: 1.43 KB
Versions: 75
Compression:
Stored size: 1.43 KB
Contents
/* @flow */
import React from 'react'
import classnames from 'classnames'
import Title from '../pb_title/_title.jsx'
import Icon from '../pb_icon/_icon.jsx'
import Avatar from '../pb_avatar/_avatar.jsx'
import { globalProps } from '../utilities/globalProps.js'
type FormPillProps = {
className?: string,
id?: string,
text: string,
name: string,
onClick?: EventHandler,
avatar?: boolean,
avatarUrl?: string,
closeProps?: {
onClick?: EventHandler,
onMouseDown?: EventHandler,
onTouchEnd?: EventHandler,
},
}
const FormPill = (props: FormPillProps) => {
const { className, text, name, onClick = () => {}, avatarUrl, closeProps = {} } = props
const css = classnames(
`pb_form_pill_kit_${'primary'}`,
globalProps(props),
className
)
return (
<div className={css}>
<If condition={name}>
<Avatar
imageUrl={avatarUrl}
name={name}
size="xs"
/>
<Title
className="pb_form_pill_text"
size={4}
text={name}
/>
</If>
<If condition={text}>
<Title
className="pb_form_pill_tag"
size={4}
text={text}
/>
</If>
<div
className="pb_form_pill_close"
onClick={onClick}
{...closeProps}
>
<Icon
fixedWidth
icon="times"
/>
</div>
</div>
)
}
export default FormPill
Version data entries
75 entries across 75 versions & 1 rubygems