apeman-react-radio/lib/ap_radio_group.jsx

/**
 * Radio component.
 * @class ApRadio
 */

'use strict'

import React, {PropTypes as types} from 'react'
import classnames from 'classnames'
import {ApUUIDMixin} from 'apeman-react-mixins'
import ApRadio from './ap_radio'

/** @lends ApRadioGroup */
const ApRadioGroup = React.createClass({

  // --------------------
  // Specs
  // --------------------

  propTypes: {
    /** Document id prefix */
    prefix: types.string,
    /** Name of Radio input */
    name: types.string.isRequired,
    /** Value and label titles */
    options: types.object.isRequired,
    /** Checked state for each values */
    checked: types.object.isRequired,
    /** Handle for change event */
    onChange: types.func,
    /** Icon class name for normal state */
    icon: types.string,
    /** Icon class name for checked state */
    checkedIcon: types.string
  },

  mixins: [
    ApUUIDMixin
  ],

  getInitialState () {
    return {}
  },

  getDefaultProps () {
    return {
      prefix: null,
      name: null,
      title: '',
      checked: {},
      options: {},
      onChange: null,
      icon: ApRadio.DEFAULT_ICON,
      checkedIcon: ApRadio.DEFAULT_CHECKED_ICON
    }
  },

  render () {
    const s = this
    let { props } = s

    let {
      prefix,
      name,
      options,
      checked,
      icon,
      checkedIcon
    } = props

    prefix = prefix || s.uuid

    return (
      <div className={ classnames('ap-Radio-group', props.className) }>
        {
          Object.keys(options || {}).map((value) => (
            <ApRadio key={ value }
                        name={ name }
                        value={ value }
                        id={ `${prefix}-${value}`}
                        checked={ !!checked[value] }
                        title={ options[value] }
                        icon={ icon }
                        checkedIcon={ checkedIcon }
                        onChange={ s.handleChange }
            />
          ))
        }
      </div>
    )
  },

  // --------------------
  // Handle
  // --------------------

  handleChange (e) {
    const s = this
    let { props } = s
    if (props.onChange) {
      props.onChange(e)
    }
  }
})

export default ApRadioGroup