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

widgets

(function() {
  var GridFormInput, MultiSelect, React, SelectInput2, SelectInputCustom, TextInput2, Textarea, assign, createClass, div, label, omit, ref;

  React = require('react');

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

  assign = require('lodash/assign');

  omit = require('lodash/omit');

  TextInput2 = React.createFactory(require('../text_input_2'));

  Textarea = React.createFactory(require('../textarea'));

  SelectInput2 = React.createFactory(require('../select_input_2'));

  MultiSelect = React.createFactory(require('../multi_select'));

  SelectInputCustom = React.createFactory(require('../select_input_custom'));

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


  /*
  Select Props
  
  @props.type - OPTIONAL - string
    The value that will determine whether to display a text input or select input - default is text
  
  @props.formLabel - OPTIONAL - string
    The value of the label that will display to the left of the input
  
  @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.inputColumnClass - OPTIONAL - string
    optional class that will be added to the input column
  
  @props.inputTextClass - OPTIONAL - string
    optional class that will be added to the input element
  
  @props.isFieldRequired - OPTIONAL - boolean
    optional boolean that will display the red asterisk if true
  
  @props.fullRow - OPTIONAL - boolean
    optional boolean that will determine whether to display the input in a full row with  or without a label
  
  @props.children - OPTIONAL - array
    optional array of children
   */

  GridFormInput = createClass({
    displayName: 'GridFormInput',
    getDefaultProps: function() {
      return {
        type: 'text',
        labelColumnClass: 'col-3-12',
        inputColumnClass: 'col-9-12',
        className: 'grid grid-pad',
        fullRow: true,
        formLabel: null,
        children: []
      };
    },
    render: function() {
      var additionalProps, children, className, content, formLabel, fullRow, input, inputCell, inputColumnClass, inputProps, inputTextClass, isFieldRequired, jsonPath, labelClass, labelColumnClass, labelField, options, ref1, type, value;
      ref1 = this.props, type = ref1.type, formLabel = ref1.formLabel, className = ref1.className, labelColumnClass = ref1.labelColumnClass, inputColumnClass = ref1.inputColumnClass, inputTextClass = ref1.inputTextClass, isFieldRequired = ref1.isFieldRequired, fullRow = ref1.fullRow, children = ref1.children, value = ref1.value, options = ref1.options, jsonPath = ref1.jsonPath;
      if (formLabel != null) {
        labelClass = 'form-label';
        if (isFieldRequired) {
          labelClass += ' is-required';
        }
        labelField = div({
          key: 'label',
          className: labelColumnClass
        }, label({
          className: labelClass
        }, formLabel));
      }
      additionalProps = {
        ref: 'input',
        value: value || ''
      };
      if (type === 'select' || type === 'selectinputcustom' || type === 'multiselect') {
        additionalProps.options = options || [];
      }
      inputProps = omit(assign({}, this.props, additionalProps), ['className']);
      input = (function() {
        switch (type) {
          case 'textarea':
            return Textarea(inputProps);
          case 'select':
            return SelectInput2(inputProps);
          case 'selectinputcustom':
            return SelectInputCustom(inputProps);
          case 'multiselect':
            return MultiSelect(inputProps);
          default:
            return TextInput2(inputProps);
        }
      })();
      inputCell = div({
        key: 'input',
        className: inputColumnClass
      }, input);
      if (fullRow && (formLabel != null)) {
        content = [labelField, inputCell].concat(children);
        return div({
          className: className
        }, content);
      } else if (fullRow) {
        content = [inputCell].concat(children);
        return div({
          className: className
        }, content);
      } else {
        return inputCell;
      }
    },
    getValue: function() {
      return this.refs.input.getValue();
    }
  });

  module.exports = GridFormInput;

}).call(this);