How to use the react-bootstrap.FormControl function in react-bootstrap

"use strict";

var moment = require('moment');

var React = require('react');

// var Grid = require('react-bootstrap').Grid;
var Col = require('react-bootstrap').Col;
var Row = require('react-bootstrap').Row;
var Modal = require('react-bootstrap').Modal;
var Button = require('react-bootstrap').Button;

var Form = require('react-bootstrap').Form;
var FormControl = require('react-bootstrap').FormControl;
var FormGroup = require('react-bootstrap').FormGroup;
var ControlLabel = require('react-bootstrap').ControlLabel;
var Radio = require('react-bootstrap').Radio;

var Switch = require('react-bootstrap-switch');

var Blink1SerialOption = require('./blink1SerialOption');

var TimeForm = React.createClass({
    propTypes: {
        rule: React.PropTypes.object.isRequired,
        allowMultiBlink1: React.PropTypes.bool,
        patterns: React.PropTypes.array,
        onSave: React.PropTypes.func,
        onCancel: React.PropTypes.func,
        onDelete: React.PropTypes.func,

this.locationSelectedLookup[itemIndex] = locationSelected;

      if (!suppressNearby) {
        // Create and add the option item to the menu items array
        var currentLocationOption = createOption(optionIcon, optionTitle, locationSelected, itemIndex === activeIndex);
        menuItems.push(currentLocationOption);
        itemIndex++;
      } // Store the number of location-associated items for reference in the _onKeyDown method


      this.menuItemCount = itemIndex;
      /** the text input element **/

      var placeholder = currentPosition.fetching === type ? 'Fetching location...' : label || type;

      var textControl = _react.default.createElement(_reactBootstrap.FormControl, {
        autoFocus: isStatic // focuses the input when the component mounts if static
        ,
        ref: function ref(ctl) {
          _this3.formControl = ctl;
        },
        className: this._getFormControlClassname(),
        type: "text",
        value: this.state.value,
        placeholder: placeholder,
        onChange: this._onTextInputChange,
        onClick: this._onTextInputClick,
        onKeyDown: this._onKeyDown
      }); // Only include the clear ('X') button add-on if a location is selected
      // or if the input field has text.

"use strict";

// import React from 'react';
var React = require('react');

var Col = require('react-bootstrap').Col;
var Row = require('react-bootstrap').Row;
var Modal = require('react-bootstrap').Modal;
var ButtonInput = require('react-bootstrap').ButtonInput;
var Button = require('react-bootstrap').Button;

var Form = require('react-bootstrap').Form;
var FormControl = require('react-bootstrap').FormControl;
var FormGroup = require('react-bootstrap').FormGroup;
var ControlLabel = require('react-bootstrap').ControlLabel;
var Radio = require('react-bootstrap').Radio;
var Checkbox = require('react-bootstrap').Checkbox;

var isAccelerator = require("electron-is-accelerator");

var PatternsService = require('../../server/patternsService');
var Blink1Service   = require('../../server/blink1Service');
var ApiServer   = require('../../server/apiServer');
var MenuMaker = require('../../menuMaker');

var conf = require('../../configuration');
var log = require('../../logger');
var Eventer = require('../../eventer');

value: function render() {
      if (this.props.static === true) {
        return _react3.default.createElement(
          _reactBootstrap.FormControl.Static,
          { type: 'text', placeholder: _lodash2.default.get(this.props.field, 'placeholder', '')
          },
          this.getValue()
        );
      }

      return _react3.default.createElement(
        'div',
        null,
        this.searchBox(),
        this.radioButtons()
      );
    }
  }]);

'use strict';

const React = require('react');
const ReactDOM = require('react-dom');

const ListGroup = require('react-bootstrap').ListGroup;
const ListGroupItem = require('react-bootstrap').ListGroupItem;
const FormControl = require('react-bootstrap').FormControl;
const FormGroup = require('react-bootstrap').FormGroup;
const ControlLabel = require('react-bootstrap').ControlLabel;
const Button = require('react-bootstrap').Button;
const InputGroup = require('react-bootstrap').InputGroup;
const Checkbox = require('react-bootstrap').Checkbox;

class App extends React.Component {

    constructor(props) {
        super(props);
        this.state = {todoLists: [], newListName: '', updatedListName: '', todoItemAdders: []};
        this.handleNewListNameChange = this.handleNewListNameChange.bind(this);
        this.handleUpdatedListNameChange = this.handleUpdatedListNameChange.bind(this);
        this.handleItemAdderNameChange = this.handleItemAdderNameChange.bind(this);
        this.handleNewList = this.handleNewList.bind(this);
        this.handleDeleteList = this.handleDeleteList.bind(this);

value: function render() {
      var _this2 = this;

      var value = function value() {
        if (!_lodash2.default.isEmpty(_lodash2.default.get(_this2.props.properties, 'value', ''))) {
          return _lodash2.default.get(_this2.props.properties, 'value');
        }

        return _lodash2.default.get(_this2.props.properties, 'initialValue', '');
      };

      if (this.props.static === true) {
        return _react3.default.createElement(
          _reactBootstrap.FormControl.Static,
          { type: 'text' },
          value()
        );
      }

      var spread = _lodash2.default.pick(this.props.field, ['disabled', 'placeholder']);

      return _react3.default.createElement(_reactBootstrap.FormControl, (0, _extends3.default)({
        type: 'text'
      }, spread, this.props.properties));
    }
  }]);

if (!_lodash2.default.isEmpty(_lodash2.default.get(_this2.props.properties, 'value', ''))) {
          return _lodash2.default.get(_this2.props.properties, 'value');
        }

        return _lodash2.default.get(_this2.props.properties, 'initialValue', '');
      };

      if (this.props.static === true) {
        return _react3.default.createElement(
          _reactBootstrap.FormControl.Static,
          { type: 'text' },
          value()
        );
      }

      return _react3.default.createElement(_reactBootstrap.FormControl, (0, _extends3.default)({ type: 'password', placeholder: _lodash2.default.get(this.props.field, 'placeholder', '')
      }, this.props.properties));
    }
  }]);

"use strict";

var React = require('react');

var Modal = require('react-bootstrap').Modal;
var Button = require('react-bootstrap').Button;

var Form = require('react-bootstrap').Form;
var FormControl = require('react-bootstrap').FormControl;
var FormGroup = require('react-bootstrap').FormGroup;

var config = require('../../configuration');
var log = require('../../logger');
var Eventer = require('../../eventer');

var Blink1Service = require('../../server/blink1Service');
var PatternsService = require('../../server/patternsService');

var ButtonToolbar = require('react-bootstrap').ButtonToolbar;

var BigButton = require('./bigButton');


var buttonsUserDefault = [
  { name: "Available", type: "color", color: "#00FF00", ledn: 0 },

var VoteAction = require('../action/VoteAction'),
  BallotAction = require('../action/BallotAction'),
  ProofOfVoteAction = require('../action/ProofOfVoteAction');

var TransactionStore = require('../store/TransactionStore'),
  ProofOfVoteStore = require('../store/ProofOfVoteStore');

var Grid = ReactBootstrap.Grid,
  Col = ReactBootstrap.Col,
  Row = ReactBootstrap.Row,
  Button = ReactBootstrap.Button,
  Pagination = ReactBootstrap.Pagination,
  FormGroup = ReactBootstrap.FormGroup,
  InputGroup = ReactBootstrap.InputGroup,
  FormControl = ReactBootstrap.FormControl,
  DropdownButton = ReactBootstrap.DropdownButton,
  MenuItem = ReactBootstrap.MenuItem,
  ButtonToolbar = ReactBootstrap.ButtonToolbar,
  Modal = ReactBootstrap.Modal,
  Button = ReactBootstrap.Button,
  OverlayTrigger = ReactBootstrap.OverlayTrigger,
  Tooltip = ReactBootstrap.Tooltip;

module.exports = React.createClass({
  mixins: [
    ReactIntl.IntlMixin,
    Reflux.connect(TransactionStore, 'transactions'),
    Reflux.connect(ProofOfVoteStore, 'proofsOfVote'),
    Reflux.listenTo(TransactionStore, 'transactionStoreChangedHandler'),
    Reflux.listenTo(ProofOfVoteStore, 'proofOfVoteStoreChangedHandler'),
  ],

/**
 *
 */
"use strict";

var React = require('react');

var Col = require('react-bootstrap').Col;
var FormControl = require('react-bootstrap').FormControl;
var FormGroup = require('react-bootstrap').FormGroup;
var ControlLabel = require('react-bootstrap').ControlLabel;

var Blink1Service = require('../../server/blink1Service');

var Blink1SerialOption = React.createClass({
    propTypes: {
        label: React.PropTypes.string,
        labelColWidth: React.PropTypes.number,
        controlColWidth: React.PropTypes.number,
        bsSize: React.PropTypes.string,
        defaultText: React.PropTypes.string,
        serial: React.PropTypes.string,
        onChange: React.PropTypes.func.isRequired
    },
    getInitialState: function() {