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

var React = require('react/addons');
var ReactBootstrap = require('react-bootstrap');
var Well = ReactBootstrap.Well;
var Grid = ReactBootstrap.Grid;
var Row = ReactBootstrap.Row;
var Col = ReactBootstrap.Col;
var Tooltip = ReactBootstrap.Tooltip;
var OverlayTrigger = ReactBootstrap.OverlayTrigger;

var CommitInfo = React.createClass({
  styles: {
    imgStyle : {
      height: 48,
      width: 48,
      display: 'block',
      marginLeft: 'auto',
      marginRight: 'auto'
    },
    textStyle: {
      textAlign: 'center',
      display: 'block',
      wordWrap: 'break-word',

{ key: i, bsStyle: 'danger' },
                  err.message
                );
              })
            ),
            _react2.default.createElement(
              _reactBootstrap.Form,
              { horizontal: true },
              _react2.default.createElement(
                _reactBootstrap.Row,
                null,
                _react2.default.createElement(
                  _reactBootstrap.FormGroup,
                  { controlId: 'formRegisterEmail' },
                  _react2.default.createElement(
                    _reactBootstrap.Col,
                    { componentClass: _reactBootstrap.ControlLabel, smOffset: 1, sm: 2 },
                    'Email'
                  ),
                  _react2.default.createElement(
                    _reactBootstrap.Col,
                    { sm: 8 },
                    _react2.default.createElement(_reactBootstrap.FormControl, { type: 'email', placeholder: 'Email', onChange: this._handleRegisterEmailChange })
                  )
                ),
                _react2.default.createElement(
                  _reactBootstrap.FormGroup,
                  { controlId: 'formRegisterPassword' },
                  _react2.default.createElement(
                    _reactBootstrap.Col,
                    { componentClass: _reactBootstrap.ControlLabel, smOffset: 1, sm: 2 },
                    'Password'

var React = require("react");
var Modal = require("react-bootstrap").Modal;
var Row = require("react-bootstrap").Row;
var Col = require("react-bootstrap").Col;
var Input = require("react-bootstrap").Input;
var Button = require("react-bootstrap").Button;
var PlaylistModalsStore = require("../../stores/playlist_modals_store");
var PlaylistActions = require("../../actions/playlist_actions");
var AddedTrack = require("./added_track");
var LinkedStateMixin = require("react-addons-linked-state-mixin");
var History = require("react-router").History;

module.exports = React.createClass({
  mixins: [LinkedStateMixin, History],

  getInitialState: function () {
    return { title: "" };
  },

  componentDidMount: function () {

var $ = require('jquery');
var jqueryUI = require('jquery-ui');
var React = require('react/addons');
var Navigation = require('react-router').Navigation;
var ReactBootstrap = require('react-bootstrap');
var Input = ReactBootstrap.Input;
var Button = ReactBootstrap.Button;
var ButtonToolbar = ReactBootstrap.ButtonToolbar;
var ButtonInput = ReactBootstrap.ButtonInput;
var Grid = ReactBootstrap.Grid;
var Row = ReactBootstrap.Row;
var Col = ReactBootstrap.Col;
var Tooltip = ReactBootstrap.Tooltip;
var OverlayTrigger = ReactBootstrap.OverlayTrigger;

var Landing = React.createClass({
  mixins : [Navigation],
  errorMessages: {badRepo: "Unable to fetch the requested repository. You may only gitualize public repositories. Please try again in a little while if you believe this is a mistake, we're doing our best :)"},
  styles: {
    containerStyle: {
      width: '980',
      marginTop: 25,
      marginLeft: 'auto',
      marginRight: 'auto'
    },
    formStyle: {
      width: 980
    },

value: function render() {
      return _react2.default.createElement(
        _reactBootstrap.Col,
        { className: 'rule--widget rule--widget--' + this.props.name.toUpperCase() },
        this.props.children
      );
    }
  }]);

var React = require('react');
var Bootstrap = require('react-bootstrap');
var Row = Bootstrap.Row;
var Col = Bootstrap.Col;
var HighCharts = require('react-highcharts/bundle/highcharts');;
var _ = require('underscore');
var Input = Bootstrap.Input;
var Button = Bootstrap.Button;


var UnitsGroupedByAvgClarity = React.createClass({

  getInitialState: function(){
    return {
      height: window.innerHeight* this.props.height *0.8,
      clarityRange: 5,
      invalidInput: false
    }
  },

}, _react.default.createElement(_reactBootstrap.Row, null, ['NOW', 'DEPART', 'ARRIVE'].map(function (type, i) {
        return _react.default.createElement(_reactBootstrap.Col, {
          key: i,
          xs: 4
        }, _react.default.createElement(DateOptionButton, {
          type: type,
          active: departArrive === type,
          setDepartArrive: _this2._setDepartArrive
        }));
      })), departArrive !== 'NOW' && !this._supportsDateTimeInputs && _react.default.createElement(_reactBootstrap.Row, {
        style: {

var React = require("react");
var Col = require("react-bootstrap").Col;
var SessionActions = require("../../actions/session_actions");
var PlaylistActions = require("../../actions/playlist_actions");
var AddToQueue = require("../utility/add_to_queue");
var AddToPlaylist = require("../utility/add_to_playlist");
var RoundPlayButton = require("../utility/round_play_button");
var TrackThumbnail = require("../utility/track_thumbnail");

module.exports = React.createClass({
  addToPlaylist: function () {
    if (this.props.isLoggedIn) {
      this.props.setTrackToAdd(this.props.track);
      PlaylistActions.showCreateModal();

    } else {
      SessionActions.showLoginModal();
    }

value: function render() {
      var _this$props = this.props,
          value = _this$props.value,
          label = _this$props.label,
          options = _this$props.options;
      return _react.default.createElement(_reactBootstrap.Row, null, _react.default.createElement(_reactBootstrap.Col, {
        xs: 6,
        className: "setting-label"
      }, label), _react.default.createElement(_reactBootstrap.Col, {
        xs: 6
      }, _react.default.createElement(_reactBootstrap.Form, null, _react.default.createElement(_reactBootstrap.FormGroup, {
        className: "dropdown-selector-container"
      }, _react.default.createElement(_reactBootstrap.FormControl, {
        className: "dropdown-selector",
        componentClass: "select",
        value: value,
        onChange: this._onQueryParamChange
      }, options.map(function (o, i) {
        return _react.default.createElement("option", {
          key: i,
          value: o.value
        }, o.text);

var React = require('react');
var ReactBootstrap = require('react-bootstrap');
var ReactIntl = require('react-intl');
var Reflux = require('reflux');
var QRCodeReader = require('qrcode-reader');
var Base64 = require('js-base64').Base64;

var QRCodeReader = require('./QRCodeReader');

var BlockchainAccountAction = require('../action/BlockchainAccountAction');

var ConfigStore = require('../store/ConfigStore');

var Button = ReactBootstrap.Button,
  ButtonToolbar = ReactBootstrap.ButtonToolbar,
  Col = ReactBootstrap.Col,
  Row = ReactBootstrap.Row;

var VoterCardReader = React.createClass({

  mixins: [
    ReactIntl.IntlMixin,
    Reflux.connect(ConfigStore, 'config'),
  ],

  getInitialState: function() {
    return {
      readFromVideo: false,
    };
  },

  getDefaultProps: function() {