ldx-widgets/src/components/ios_toggle_switch.coffee

widgets

React = require 'react'

{button, input, label, span} = React.DOM

IOSToggleSwitch = React.createClass
  
  displayName: 'IOSToggleSwitch'

  getDefaultProps: ->
    tabIndex: -1
  
  render: ->
    {checked, onChange, tabIndex} = @props

    button {
      key: 'ios-toggle-switch'
      className: 'ios-toggle-switch'
      onClick: onChange  # Need to put click event here because checkbox is hidden and does not get fired
      tabIndex: tabIndex
    }, [
      label {
        key: 'switch-label'
        className: 'ios-toggle-switch-label'
        htmlFor: 'myios-toggle-switch'
      }, [
        span {
          key: 'switch-inner'
          className: 'ios-toggle-switch-inner'
        }
        span {
          key: 'switch-switch'
          className: 'ios-toggle-switch-switch'
        }
      ]
    ]

  getValue: -> not @props.checked


module.exports = IOSToggleSwitch