public/src/js/widgets/autocomplete.html

<div class="autocompleter dropdown" data-bind="css: {
    'dropdown-open': open
}">
    <select class="search--filterType" data-bind="
        event: { change: clear },
        options: filterTypes,
        optionsText: 'display',
        value: filterType"></select>

    <input type="text" class="search--filter" placeholder="filter" data-bind='
        attr: { placeholder: placeholder},
        textInput: filter'/>

    <ul class="suggestions">
        <!-- ko if: alertMessage -->
        <li>
            <span data-bind="text: alertMessage"></span>
        </li>
        <!-- /ko -->
        <!-- ko foreach: suggestions -->
            <li data-bind="click: $parent.select.bind($parent)">
                <a data-bind="text: id"></a>
            </li>
        <!-- /ko -->
        <!-- ko if: hasMoreSuggestions -->
            <li class="suggestions--more" data-bind="click: nextPage">
                <a>&hellip;more</a>
            </li>
        <!-- /ko -->
    </ul>
</div>