Sha256: db99297348d6c3d893c39b2aa7e564f49cd3daecbe321307599e0aac219ccc15
Contents?: true
Size: 1.73 KB
Versions: 7
Compression:
Stored size: 1.73 KB
Contents
/* @flow */
import React from 'react'
import Body from '../pb_body/_body.jsx'
import Icon from '../pb_icon/_icon.jsx'
import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
import classnames from 'classnames'
import { globalProps } from '../utilities/globalProps.js'
type CheckboxProps = {
aria?: object,
checked?: Boolean,
className?: String,
dark?: Boolean,
data?: object,
error?: Boolean,
id?: String,
name: String,
text: String,
value: String,
children: Node,
onChange: (Boolean) => void,
}
const Checkbox = (props: CheckboxProps) => {
const {
aria = {},
checked = false,
className,
dark = false,
data = {},
error = false,
id,
name = '',
text = '',
value = '',
children = null,
onChange = () => {},
} = props
const dataProps = buildDataProps(data)
const ariaProps = buildAriaProps(aria)
const classes = classnames(buildCss('pb_checkbox_kit',
{ checked: checked, error: error }), className, globalProps(props))
return (
<label
{...ariaProps}
{...dataProps}
className={classes}
id={id}
>
<If condition={children}>
{children}
<Else />
<input
defaultChecked={checked}
name={name}
onChange={onChange}
type="checkbox"
value={value}
/>
</If>
<span className="pb_checkbox_checkmark">
<Icon
className="check_icon"
fixedWidth
icon="check"
/>
</span>
<Body
className="pb_checkbox_label"
dark={dark}
status={error ? 'negative' : null}
>
{text}
</Body>
</label>
)
}
export default Checkbox
Version data entries
7 entries across 7 versions & 1 rubygems