(searchFieldFocused = true)} onblur={() => { searchFieldFocused = false; if (renderedObjectIdName) searchQuery = renderedObjectIdName; }} onkeydown={(e) => { const resultIdx = Math.max( Math.min(searchSuggestionIdx, searchResults.length - 1), 0 ); let dir = 1; switch (e.key) { case 'Enter': case 'Return': { const result = searchResults[resultIdx]; if (result) { objectId = result.id; objectIdName = result.name; searchQuery = result.name; e.currentTarget.blur(); pushHistory(); setTimeout(() => refetchResultsLoop(true), 10); } break; } case 'ArrowUp': dir = -1; // fall through case 'ArrowDown': { if (searchResults.length !== 0) { e.preventDefault(); searchSuggestionIdx = dir === -1 && resultIdx % 1 !== 0 ? Math.floor(resultIdx) : Math.floor(resultIdx + dir); if (searchSuggestionIdx < 0) searchSuggestionIdx = searchResults.length - 1; else if (searchSuggestionIdx >= searchResults.length) searchSuggestionIdx = 0; } break; } } }} />

{#if searchFieldFocused && searchResults.length !== 0}

{#each searchResults as result, idx}

{ searchSuggestionIdx = idx; }} onmouseleave={() => { searchSuggestionIdx = idx + 0.000001; }} onmousedown={(e) => { e.preventDefault(); // prevent early unfocusing }} onclick={(e) => { objectId = result.id; objectIdName = result.name; searchQuery = result.name; pushHistory(); if (searchField) { setTimeout(() => { searchField?.blur(); }, 10); searchField.value = result.name; setTimeout(() => refetchResultsLoop(true), 10); } }} > {result.name} {[ result.areas.find((v) => v.default)?.name, result.type.charAt(0).toUpperCase() + result.type.substring(1).toLowerCase(), ] .filter((v) => v) .join(', ')}

{/each}

{/if}

{#if progressKind === 'fetch'}

{:else if progressKind === 'waiting'}

{/if}

{ searchQuery = q; searchField?.focus(); }} />