React = require 'react'
ToggleButton = React.createFactory(require './toggle_button')

{div, button} = React.DOM

ToggleButtonArray = React.createClass
  
  displayName: 'ToggleButtonArray'

  propTypes:
    options: React.PropTypes.array.isRequired
    positionClass: React.PropTypes.string
    useTabs: React.PropTypes.bool
    compact: React.PropTypes.bool

  getInitialState: ->
    value: @props.value

  render: ->
    {options, value, compact, positionClass, useTabs} = @props

    className = 'toggle-array'
    className += ' compact' if compact
    className += " #{positionClass}" if positionClass?

    buttons = []
    buttons.push(
      ToggleButton {
        key: index
        ref: option.label
        useTabs: useTabs
        setFormData: @setFormData
        option: option
        options: options
        selected: option.value is value
      }
    ) for option, index in options

    div {
      className: className
    }, buttons

  setFormData: (value) ->
    @setState
      value: value
    , ->
      @props.onChange?(value, @props.detail)

  getFormData: -> 
    return @state.value

  getValue: ->
    @getFormData()


module.exports = ToggleButtonArray