ldx-widgets
Version:
widgets
82 lines (75 loc) • 2.24 kB
JavaScript
(function() {
var IOSToggleSwitch, React, button, createClass, input, label, ref, span;
React = require('react');
createClass = require('create-react-class');
ref = require('react-dom-factories'), button = ref.button, input = ref.input, label = ref.label, span = ref.span;
IOSToggleSwitch = 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, jsonPath, onChange, ref1;
checked = this.state.checked;
ref1 = this.props, onChange = ref1.onChange, jsonPath = ref1.jsonPath;
return this.setState({
checked: !checked
}, (function(_this) {
return function() {
return typeof onChange === "function" ? onChange(_this.getValue, jsonPath) : void 0;
};
})(this));
},
getValue: function() {
return this.state.checked;
}
});
module.exports = IOSToggleSwitch;
}).call(this);