text: var React = require('react');
  var util = require('./util');
  var TabMgr = require('./tab-mgr');
  
  var PluginsTabs = React.createClass({
    getInitialState: function () {
      var tab = this.props.tabs[0];
      return {
        active: tab && tab.plugin
      };
    },
    shouldComponentUpdate: function (nextProps) {
      var hide = util.getBoolean(this.props.hide);
      return hide != util.getBoolean(nextProps.hide) || !hide;
    },
    onSelect: function (tab) {
      this.setState({ active: tab.plugin });
    },
    render: function () {
      var self = this;
      var props = self.props;
      var tabs = props.tabs;
      var hide = props.hide;
      var active = this.state.active;
      var single = tabs.length < 2;
      if (single) {
        active = tabs[0] && tabs[0].plugin;
        if (active) {
          this.state.active = active;
        }
      }
      return (
        <div className={'fill box w-plugins-tabs' + (hide ? ' hide' : '')}>
          <div className={'w-plugins-tabs-list' + (single ? ' hide' : '')}>
            {tabs.map(function (tab) {
              return (
                <button
                  key={tab.plugin}
                  onClick={function () {
                    self.onSelect(tab);
                  }}
                  className={
                    'btn btn-default' + (active == tab.plugin ? ' active' : '')
                  }
                  title={'[' + tab.plugin + '] ' + tab.name}
                >
                  {tab.name}
                </button>
              );
            })}
          </div>
          <TabMgr active={active} hide={hide} tabs={tabs} />
        </div>
      );
    }
  });
  
  module.exports = PluginsTabs;
  