{ dispatch('input'); }} on:focus={() => { focused = true; }} on:keydown={(e) => { if (e.key === 'Enter') { if (filteredTags.length > 0) { const tagElement = document.getElementById(`search-tag-${selectedIdx}`); tagElement.click(); return; } if (filteredOptions.length > 0) { const optionElement = document.getElementById(`search-option-${selectedIdx}`); optionElement.click(); return; } } if (e.key === 'ArrowUp') { e.preventDefault(); selectedIdx = Math.max(0, selectedIdx - 1); } else if (e.key === 'ArrowDown') { e.preventDefault(); if (filteredTags.length > 0) { selectedIdx = Math.min(selectedIdx + 1, filteredTags.length - 1); } else { selectedIdx = Math.min(selectedIdx + 1, filteredOptions.length - 1); } } else { // if the user types something, reset to the top selection. selectedIdx = 0; } }} />