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

To help you get started, we’ve selected a few react-bootstrap examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github RacingTadpole / react-dropdown-input / index.js View on Github external
//

"use strict";

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var React = require("react/addons");
var ReactBootstrap = require("react-bootstrap");
var joinClasses = require("react/lib/joinClasses");
var cx = require("classnames");

var BootstrapMixin = ReactBootstrap.BootstrapMixin;
var DropdownStateMixin = ReactBootstrap.DropdownStateMixin;
var DropdownMenu = ReactBootstrap.DropdownMenu;
var Input = ReactBootstrap.Input;
var MenuItem = ReactBootstrap.MenuItem;

var defaultMaxText = "+# more not shown";

var defaultFilter = function defaultFilter(filterText, optionName) {
  // also optionIndex as third arg
  return optionName.toLowerCase().indexOf(filterText.toLowerCase()) >= 0;
};

var genLength = function genLength(list) {
  // deal with both regular arrays and immutablejs objects, which have .count() instead of length
  return typeof list.count !== "undefined" ? list.count() : list.length;
};

var genGet = function genGet(list, i) {
  // deal with both regular arrays and immutablejs objects, which have list.get(i) instead of list[i]
  return typeof list.get !== "undefined" ? list.get(i) : list[i];
github opentripplanner / otp-react-redux / build / components / form / location-field.js View on Github external
function createOption(icon, title, onSelect, isActive, isLast) {
  return _react.default.createElement(_reactBootstrap.MenuItem, {
    className: "location-option".concat(isLast ? ' last-option' : ''),
    onSelect: onSelect // style={{ borderBottom: '1px solid lightgrey' }}
    ,
    key: itemKey++,
    active: isActive
  }, (0, _ui.isIE)() // In internet explorer 11, some really weird stuff is happening where it
  // is not possible to click the text of the title, but if you click just
  // above it, then it works. So, if using IE 11, just return the title text
  // and avoid all the extra fancy stuff.
  // See https://github.com/ibi-group/trimet-mod-otp/issues/237
  ? title : _react.default.createElement("div", {
    style: {
      paddingTop: '5px',
      paddingBottom: '3px'
    }
  }, _react.default.createElement("div", {
github opentripplanner / otp-react-redux / build / components / app / app-menu.js View on Github external
value: function render() {
      var languageConfig = this.props.languageConfig;
      return _react.default.createElement("div", {
        className: "app-menu"
      }, _react.default.createElement(_reactBootstrap.DropdownButton, {
        title: _react.default.createElement(_icon.default, {
          type: "bars"
        }),
        noCaret: true,
        className: "app-menu-button",
        id: "app-menu"
      }, _react.default.createElement(_reactBootstrap.MenuItem, {
        onClick: this._showRouteViewer
      }, _react.default.createElement(_icon.default, {
        type: "bus"
      }), " ", languageConfig.routeViewer || 'Route Viewer'), _react.default.createElement(_reactBootstrap.MenuItem, {
        onClick: this._startOver
      }, _react.default.createElement(_icon.default, {
        type: "undo"
      }), " Start Over")));
    }
  }]);
github lemonCMS / redux-form-generator / lib / types / dropDown.js View on Github external
_lodash2.default.map(this.props.field.items, function (item, key) {
        var select = function select() {
          _this3.dropDownSelect(_this3.props.field.name, item);
        };

        if (item.hasOwnProperty('default')) {
          dropDownTitle = item.default;
          menuItem.push(_react3.default.createElement(
            _reactBootstrap.MenuItem,
            { key: key, onSelect: select },
            item.default
          ));
          menuItem.push(_react3.default.createElement(_reactBootstrap.MenuItem, { key: key + '_div', divider: true }));
        } else {
          if (_lodash2.default.get(_this3.props, ['properties', 'initialValue']) === item.field) {
            dropDownTitle = item.desc;
          }
          menuItem.push(_react3.default.createElement(
            _reactBootstrap.MenuItem,
            { key: key, onSelect: select },
            item.desc
          ));
        }
      });
      return { dropDownTitle: dropDownTitle, menuItem: menuItem };
github laopunk / KeyFinder / src / jsx / scalePlayer.jsx View on Github external
, _ = require('lodash')
	, np = require('noteplayer')
	, cp = require('chordplayer')
;

//bootstrap specific
var RB = require('react-bootstrap')
	, ButtonToolbar = RB.ButtonToolbar
	, Button = RB.Button
	, Glyphicon = RB.Glyphicon
	, Input = RB.Input
	, Row = RB.Row
	, Col = RB.Col
	, Glyphicon = RB.Glyphicon
	, DropdownButton = RB.DropdownButton
	, MenuItem = RB.MenuItem
;

var scalePlayer = React.createClass({
	getInitialState: function() {
		return {
			//array of web audio chords
			  audioChords: []
			//array of web audio notes
			, audioNotes: []
			//audiocontext
			, audioContext: null
			//octaves
			, chordOctave: null
			, notesOctave: null
			//time between each note/chord being played (in seconds)
			, transitionTime: 0.1
github appbaseio / dejavu / src / js / table / filterDropdown.jsx View on Github external
render: function() {
        var ButtonToolbar = ReactBootstrap.ButtonToolbar;
        var DropdownButton = ReactBootstrap.DropdownButton;
        var MenuItem = ReactBootstrap.MenuItem;
        var Dropdown = ReactBootstrap.Dropdown;
        var datatype = this.props.datatype;
        var applyBtn = this.state.filterValue == '' ? 'true' : 'false';
        var stringFilter = (
            
                                    
                                    
                                    
                                    <div>
                                        <button>Apply</button>
                                    </div>
                                
        );

        var numberFilter = (
github todbot / Blink1Control2 / src / components / gui / patternDropdown.js View on Github external
/**
 * Show a drop-down list of available patterns
 *
 */

 "use strict";

var React = require('react');
var _ = require('lodash');

var DropdownButton = require('react-bootstrap').DropdownButton;
var MenuItem = require('react-bootstrap').MenuItem;

var PatternDropdown = React.createClass({

	propTypes: {
		patterns: React.PropTypes.array.isRequired,
        patternId: React.PropTypes.string.isRequired,
        onPatternUpdated: React.PropTypes.func.isRequired
	},

    onSelect: function(eventkey) { //
        this.props.onPatternUpdated(this.props.patterns[eventkey].id);
    },

    render: function() {
        var createMenuItem = function(item, idx) {
            return (
github SignalK / instrumentpanel / lib / ui / connectform.js View on Github external
var React = require('react');
var rb = require('react-bootstrap');

var DropdownButton = rb.DropdownButton,
    MenuItem = rb.MenuItem,
    Button = rb.Button,
    Input = rb.Input;

var Icon = require('react-font-awesome').Icon;    

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

var ConnectionIndicator = require('./connectionindicator');




var ConnectForm = React.createClass({
  getInitialState: function() {
    try {
      var storedHosts = JSON.parse(window.localStorage['signalKHosts']);
github networknt / light / efg / app / components / Header.js View on Github external
*/
var React = require('react');
var Router = require('react-router')
    , RouteHandler = Router.RouteHandler
    , Route = Router.Route;

var ReactPropTypes = React.PropTypes;
var AuthActionCreators = require('../actions/AuthActionCreators.js');

var ReactBootstrap = require('react-bootstrap')
    , Nav = ReactBootstrap.Nav
    , Navbar = ReactBootstrap.Navbar
    , CollapsibleNav = ReactBootstrap.CollapsibleNav
    , NavItem = ReactBootstrap.NavItem
    , DropdownButton = ReactBootstrap.DropdownButton
    , MenuItem = ReactBootstrap.MenuItem
    , ListGroup = ReactBootstrap.ListGroup;

var ReactRouterBootstrap = require('react-router-bootstrap')
    , NavItemLink = ReactRouterBootstrap.NavItemLink
    , MenuItemLink = ReactRouterBootstrap.MenuItemLink
    , ButtonLink = ReactRouterBootstrap.ButtonLink
    , ListGroupItemLink = ReactRouterBootstrap.ListGroupItemLink;



var Header = React.createClass({

    propTypes: {
        isLoggedIn: ReactPropTypes.bool,
        email: ReactPropTypes.string
    },
github walkdoer / Life-Time-Tracker / components / editor / LogEditor.js View on Github external
'use strict';
var React = require('react');
var cx = React.addons.classSet;
var Router = require('react-router');
var _ = require('lodash');
var Q = require('q');
var RB = require('react-bootstrap');
var Button = RB.Button;
var ButtonToolbar = RB.ButtonToolbar;
var DropdownButton = RB.DropdownButton;
var OverlayTrigger = RB.OverlayTrigger;
var TabbedArea = RB.TabbedArea;
var TabPane = RB.TabPane;
var Link = RB.Link;
var Popover = RB.Popover;
var MenuItem = RB.MenuItem;
var Moment = require('moment');
var Color = require('color');
var TrackerHelper = require('tracker/helper');
var SlidePanel = require('../SlidePanel');
var Scroller = require('../Scroller');
var mui = require('material-ui');
var DefaultRawTheme = require('material-ui/lib/styles/raw-themes/light-raw-theme');
var md5 = require('blueimp-md5').md5;



/**Components*/
var TodayReport = require('../../reports/TodayReport');
var HelpDocument= require('../HelpDocument');
var Progress = require('../Progress');
var RecentActivities = require('../RecentActivities');