Sha256: 8d4dca357cc4c121201de946fa47ba69351b4b60f30df87866694b7a000d46c1

Contents?: true

Size: 1.14 KB

Versions: 2

Compression:

Stored size: 1.14 KB

Contents

/* @flow */

import React from 'react'
import Body from '../pb_body/_body.jsx'
import Icon from '../pb_icon/_icon.jsx'

type CheckboxProps = {
  checked?: Boolean,
  dark?: Boolean,
  name: String,
  text: String,
  value: String,
  children: Node,
  onChange: (Boolean) => void,
}

const Checkbox = ({
  checked = false,
  dark = false,
  name = '',
  text = '',
  value = '',
  children = null,
  onChange = () => {},

}: CheckboxProps) => {
  const bodyClassName = {
    'pb_checkbox_label': true,
    '_dark': dark,
  }

  return (
    <label
        className={
        'pb_checkbox_kit' +
        (dark === true ? '_dark' : '')
      }
    >
      <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={bodyClassName}>{text}</Body>
    </label>
  )
}

export default Checkbox

Version data entries

2 entries across 2 versions & 1 rubygems

Version Path
playbook_ui-3.4.0 app/pb_kits/playbook/pb_checkbox/_checkbox.jsx
playbook_ui-3.3.0 app/pb_kits/playbook/pb_checkbox/_checkbox.jsx