JSFiddle - React, Tailwind, and code Playground

HTML

<div id="cb1"></div><div id="cb2"></div><div id="cb3"></div><br/><br />
<button onclick="$('#cb3').ComboBox('del',0);">Delete 3-1</button>
<button onclick="$('#cb3').ComboBox('disable',1);">Disable 3-2</button>
<button onclick="$('#cb3').ComboBox('enable',1);">Enable 3-2</button>
<button onclick="$('#cb3').ComboBox('clear');">Clear 3</button>

CSS

.toggle-menu {
    font-size: 12px;
    border:#989898 1px solid;
    display: inline-block;
    padding: 5px;
    margin: 5px;
    border-top-left-radius: 4px 4px;
    border-top-right-radius: 4px 4px;
    border-bottom-left-radius: 4px 4px;
    border-bottom-right-radius: 4px 4px;
    cursor: default;
    user-select: none;
    -khtml-user-select: none;
    -o-user-select: none;
    -moz-user-select: -moz-none;
    -webkit-user-select: none;
}
.toggle-menu-selected {
    background: #d8d8d8; /* Old browsers */
    background: -moz-linear-gradient(top,  #d8d8d8 0%, #8e8e8e 100%); /* FF3.6+ */
    background:  -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d8d8d8),  color-stop(100%,#8e8e8e)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #d8d8d8 0%,#8e8e8e 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #d8d8d8 0%,#8e8e8e 100%); /* Opera11.10+ */
    background: -ms-linear-gradient(top,  #d8d8d8 0%,#8e8e8e 100%); /* IE10+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d8d8d8', endColorstr='#8e8e8e',GradientType=0 ); /* IE6-9 */
    background: linear-gradient(top,  #d8d8d8 0%,#8e8e8e 100%); /* W3C */
}
.toggle-menu-collate-right {
    border-top-right-radius: 0px 0px;
    border-bottom-right-radius: 0px 0px;
    margin-right: 0px;
}
.toggle-menu-collate-left {
    border-top-left-radius: 0px 0px;
    border-bottom-left-radius: 0px 0px;
    margin-left: 0px;
}
.toggle-menu .title {
    text-align: center;
    display: inline-block;
}
.toggle-menu .arrow {
    background: url("http://www.freepbx.org/trac/browser/freepbx/trunk/amp_conf/htdocs/recordings/theme/images/arrow-desc.gif?rev=10449&format=raw") no-repeat 50% 50%;
    padding: 6px;
    margin-left: 5px;
    display: none;
}
.toggle-menu div.dropdown {
    position: absolute;
    border:#999999 1px solid;
    background-color:#FFFFFF;
    display: none;
    box-shadow: 0 0 5px gray;
    overflow: auto;
    max-height:...

JavaScript

(function($) {
    $.fn.getHiddenDimensions = function(includeMargin) {
        var $item = this,
            props = { position: 'absolute', visibility: 'hidden', display: 'block' },
            dim = { width:0, height:0, innerWidth: 0, innerHeight: 0,outerWidth: 0,outerHeight: 0 },
            $hiddenParents = $item.parents().andSelf().not(':visible'),
            includeMargin = includeMargin || false;
     
        var oldProps = [];
        $hiddenParents.each(function() {
            var old = {};
     
            for ( var name in props ) {
                old[ name ] = this.style[ name ];
                this.style[ name ] = props[ name ];
            }
     
            oldProps.push(old);
        });
     
        dim.width = $item.width();
        dim.outerWidth = $item.outerWidth(includeMargin);
        dim.innerWidth = $item.innerWidth();
        dim.height = $item.height();
        dim.innerHeight = $item.innerHeight();
        dim.outerHeight = $item.outerHeight(includeMargin);
     
        $hiddenParents.each(function(i) {
            var old = oldProps[i];
            for ( var name in props ) {
                this.style[ name ] = old[ name ];
            }
        });
     
        return dim;
    };
    
    var buttonClickWithItems = function(e) {
        var parent = $(this).closest('.toggle-menu');
        var p = parent.position();
        var isVisible = parent.find('.dropdown').is(':visible');
        var dropdown = $(parent).find('.dropdown');
        
        $('.toggle-menu .dropdown').hide();
        $('.toggle-menu-selected').removeClass('toggle-menu-selected');
        if (!isVisible) {
            parent.addClass('toggle-menu-selected');
            dropdown.show().offset({
                top: p.top + 31,
                left: p.left + parseInt(parent.css('margin-left'))
            });
         }

        if (!e) var e = window.event;
        e.cancelBubble = true;
        e.stopPropagation();
    };
    
    var...