React radio options

fiddle.js

var v = React.DOM

var RadioOptions = React.createClass
( { render: render
  , handleClick: handleClick
  }
)

var props =
{ name: "uniqueName"
, options:
  [ { key: "1", value: "1", label: "one" }
  , { key: "2", value: "2", label: "two" }
  ]
, onOptionChange: onOptionChange
}

React.renderComponent ( RadioOptions (props) , document.body )

function render ()
{
  var selected = this.props.selected || this.props.options[0].value
  return v.span ( {}, this.props.options.map ( input.bind(this, selected) ) )
}

function input (selected, option)
{
  return v.span
  ( {}
  , v.input
    ( { type: "radio"
      , name: this.props.name
      , value: option.value
      , id: this.props.name + "#" + option.value
      , checked: selected === option.value
      , onClick: this.handleClick
      }
    )
  , v.label( {} , option.label )
  )
}

function handleClick (event)
{
  console.log ( event.target.value )
}

function onOptionChange (value)
{
  console.log ( value )
}

fiddle.manifest

name: react-radio
description: React radio options component
authors:
  - Erick Fleming
resources:
  - http://fb.me/react-with-addons-0.8.0.js
normalize_css: no
wrap: b