ldx-widgets/dist/components/ios_toggle_switch.js

widgets

(function() {
  var IOSToggleSwitch, React, button, input, label, ref, span;

  React = require('react');

  ref = React.DOM, button = ref.button, input = ref.input, label = ref.label, span = ref.span;

  IOSToggleSwitch = React.createClass({
    displayName: 'IOSToggleSwitch',
    getDefaultProps: function() {
      return {
        tabIndex: -1,
        disabled: false
      };
    },
    getInitialState: function() {
      return {
        checked: this.props.checked
      };
    },
    componentWillReceiveProps: function(nextProps) {
      var checked;
      checked = nextProps.checked;
      if (checked !== this.state.checked) {
        return this.setState({
          checked: checked
        });
      }
    },
    render: function() {
      var checked, className, disabled, ref1, tabIndex;
      ref1 = this.props, tabIndex = ref1.tabIndex, disabled = ref1.disabled;
      checked = this.state.checked;
      className = 'ios-toggle-switch';
      if (checked) {
        className += ' is-checked';
      }
      return button({
        key: 'ios-toggle-switch',
        className: className,
        onClick: this.handleChange,
        tabIndex: tabIndex,
        disabled: disabled
      }, [
        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'
          })
        ])
      ]);
    },
    handleChange: function() {
      var checked, onChange;
      checked = this.state.checked;
      onChange = this.props.onChange;
      return this.setState({
        checked: !checked
      }, onChange);
    },
    getValue: function() {
      return this.state.checked;
    }
  });

  module.exports = IOSToggleSwitch;

}).call(this);