ldx-widgets/dist/components/grid_form/grid_form_checkbox.js

widgets

(function() {
  var CheckboxInput, GridFormCheckBox, React, assign, createClass, div, iOSToggle, label, makeGuid, omit, ref;

  React = require('react');

  createClass = require('create-react-class');

  CheckboxInput = React.createFactory(require('../checkbox_input'));

  iOSToggle = React.createFactory(require('../ios_toggle_switch'));

  makeGuid = require('../../utils').makeGuid;

  assign = require('lodash/assign');

  omit = require('lodash/omit');

  ref = require('react-dom-factories'), div = ref.div, label = ref.label;


  /*
  Select Props
  
  @props.formLabel - OPTIONAL - string
    The value of the label that will display to the left of the checkbox
  
  @props.checkboxLabel - OPTIONAL - string
    The value of the label that will display to the right of the checkbox
  
  @props.className - OPTIONAL - string - default 'grid grid-pad'
    optional class to be added the main div
  
  @props.labelColumnClass - OPTIONAL - string
    optional class that will be added to the label column
  
  @props.checkboxColumnClass - OPTIONAL - string
    optional class that will be added to the checkbox column
  
  @props.isFieldRequired - OPTIONAL - boolean
    optional boolean that will display the red asterisk if true
   */

  GridFormCheckBox = createClass({
    displayName: 'GridFormCheckBox',
    getDefaultProps: function() {
      return {
        labelColumnClass: 'col-3-12',
        checkboxColumnClass: 'col-9-12',
        className: 'grid grid-pad',
        formLabel: null,
        useIOSToggle: false
      };
    },
    componentWillMount: function() {
      return this.id = makeGuid();
    },
    render: function() {
      var checkboxColumnClass, checkboxLabel, checkboxProps, className, control, formLabel, isFieldRequired, labelClass, labelColumnClass, labelField, ref1, useIOSToggle;
      ref1 = this.props, formLabel = ref1.formLabel, checkboxLabel = ref1.checkboxLabel, className = ref1.className, labelColumnClass = ref1.labelColumnClass, checkboxColumnClass = ref1.checkboxColumnClass, isFieldRequired = ref1.isFieldRequired, useIOSToggle = ref1.useIOSToggle;
      checkboxProps = omit(assign({}, this.props, {
        ref: 'checkbox',
        id: this.id
      }), ['className']);
      checkboxProps.wrapperLabel = checkboxLabel || '';
      if (formLabel != null) {
        labelClass = 'form-label';
        if (isFieldRequired) {
          labelClass += ' is-required';
        }
        labelField = div({
          key: 'label',
          className: labelColumnClass
        }, label({
          className: labelClass
        }, formLabel));
        checkboxProps.className = 'checkbox-input row-height';
      }
      if (useIOSToggle) {
        control = iOSToggle(checkboxProps);
      } else {
        control = CheckboxInput(checkboxProps);
      }
      return div({
        className: className
      }, [
        formLabel != null ? labelField : void 0, div({
          key: 'select-field',
          className: checkboxColumnClass
        }, control)
      ]);
    },
    getValue: function() {
      return this.refs.checkbox.getValue();
    }
  });

  module.exports = GridFormCheckBox;

}).call(this);