#requireResource("com.atlassian.auiplugin:aui-select")

## Draw pickers for each of the filter groups
#if ($filterGroups && !$filterGroups.empty)
	<p class="filter-by-heading">$searchCore.text("com.brikit.targetedsearch.filter.by")</p>
#end
#foreach ($filterGroup in $filterGroups)
	<div class="search-select filter-group-select">
		#set ($dropdownId = "filter-group-${uniqueId}-$filterGroup.key")
        #if ($displaySearchableFilterGroups)
            <aui-select id="${dropdownId}-2" class="filter-group-picker filter-options" placeholder="$filterGroup.displayName">
    			#foreach ($filter in $filterGroup.filtersWithSubcategories)
    				<aui-option class="filter-picker-option" value="$filter.label">#if($filter.depth > 0)#foreach($depth in [1 .. $filter.depth])&nbsp;&nbsp;&nbsp;#end#end$filter.displayName</aui-option>
    			#end
            </aui-select>
        #else
    		<a href="#$dropdownId" aria-owns="$dropdownId" aria-haspopup="true" class="aui-button aui-style-default aui-dropdown2-trigger">$filterGroup.displayName</a>
    		<div id="$dropdownId" class="aui-style-default aui-dropdown2 filter-options">
    		    <ul class="aui-list-truncate">
    				#foreach ($filter in $filterGroup.filtersWithSubcategories)
    					<li><a data-label="$filter.label">#if($filter.depth > 0)#foreach($depth in [1 .. $filter.depth])&nbsp;&nbsp;&nbsp;#end#end$filter.displayName</a></li>
    					## <option value="$filter.label" #if ($isSelected) selected="selected" #end>#if($filter.depth > 0)#foreach($depth in [1 .. $filter.depth])&nbsp;&nbsp;#end#end $filter.displayName</option>
    				#end
    		    </ul>
    		</div>
        #end
##        <select class="filter-group-picker" data-placeholder="$filterGroup.displayName">
##            <option></option>
##			#foreach ($filter in $filterGroup.filtersWithSubcategories)
##				<option value="$filter.label" data-label="$filter.label">#if($filter.depth > 0)#foreach($depth in [1 .. $filter.depth])&nbsp;&nbsp;&nbsp;#end#end$filter.displayName</option>
##			#end
##        </select>
	</div>
#end