<div class="btn-group w-product-filter-component-ui" uib-dropdown is-open="isOpen" on-toggle="toggleDropDown(isOpen)">


	<span class="dropdown pull-left" uib-dropdown is-open="status.isopen">

        <button id="single-button" type="button" class="btn btn-primary w-open-product-filter-component-ui" uib-dropdown-toggle auto-close="always" >
            <span ng-if="currentProduct.productName">{{currentProduct.brandName}} - {{currentProduct.productName}}</span>
            <span ng-if="!currentProduct.productName">Filter by product</span>
            <span class="caret"></span>
        </button>
      <ul class="dropdown-menu" uib-dropdown-menu >
        <li role="menuitem" ng-if="products.length>0">
			<input ng-model="query" class="form-control product-filter-input" style="border:none;" ng-change="updateProductList(query)"/>
		</li>
        <li role="menuitem" ng-if="products.length>0">
			<a ng-click="removeFilter(product)">
				<b>Remove filter</b>
			</a>
		</li>
        <li role="separator" class="divider"></li>
		<li role="menuitem" ng-repeat="product in productsToShow" class="w-product-human-id"><a ng-click="addFilter(product)">{{product.brandName}} - {{product.productName}}</a></li>
	
      </ul>
    </span>

</div>