Don't highlight suggestion items

Other suggestions menus don't do it either
This commit is contained in:
Henrik Giesel 2021-06-28 00:55:10 +02:00
parent 9fd985760c
commit 146a901d91
2 changed files with 28 additions and 11 deletions

View file

@ -64,7 +64,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
event.preventDefault(); event.preventDefault();
active = true; active = true;
} else { } else {
original = target.value; search = target.value;
} }
return autocomplete; return autocomplete;
@ -89,11 +89,21 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
<DropdownMenu id={menuId} class={className}> <DropdownMenu id={menuId} class={className}>
{#each displayed as tag, i} {#each displayed as tag, i}
<div class="suggestion-item">
<DropdownItem <DropdownItem
class={i === selected ? (active ? "active" : "focus") : ""} class={i === selected ? (active ? "active" : "focus") : ""}
on:mouseenter={() => select(i)}
on:click>{tag}</DropdownItem on:click>{tag}</DropdownItem
> >
</div>
{/each} {/each}
</DropdownMenu> </DropdownMenu>
</WithDropdownMenu> </WithDropdownMenu>
<style lang="scss">
.suggestion-item {
:global(.dropdown-item:hover) {
background-color: inherit !important;
border-color: inherit !important;
}
}
</style>

View file

@ -67,11 +67,18 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
} }
function isActiveNameUniqueAt(index: number): boolean { function isActiveNameUniqueAt(index: number): boolean {
const names = tags.map(getName) const names = tags.map(getName);
names.splice(index, 1); names.splice(index, 1);
const contained = names.indexOf(activeName); const contained = names.indexOf(activeName);
console.log('isActiveUnique', active, index, activeName, JSON.stringify(names), contained) console.log(
"isActiveUnique",
active,
index,
activeName,
JSON.stringify(names),
contained
);
if (contained >= 0) { if (contained >= 0) {
tags[contained].blink(); tags[contained].blink();
return false; return false;
@ -131,7 +138,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
const deleted = deleteTag(index - 1); const deleted = deleteTag(index - 1);
activeName = deleted.name + activeName; activeName = deleted.name + activeName;
console.log('joinprevious', activeName, active); console.log("joinprevious", activeName, active);
tags = tags; tags = tags;
} }
@ -146,7 +153,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
} }
function moveToPreviousTag(index: number): void { function moveToPreviousTag(index: number): void {
console.log('moveprevious', active, index) console.log("moveprevious", active, index);
if (isFirst(index)) { if (isFirst(index)) {
return; return;
@ -220,7 +227,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
on:tagmoveprevious={() => moveToPreviousTag(index)} on:tagmoveprevious={() => moveToPreviousTag(index)}
on:tagmovenext={() => moveToNextTag(index)} on:tagmovenext={() => moveToNextTag(index)}
on:tagaccept={() => { on:tagaccept={() => {
console.log('accept', tag, index, activeName); console.log("accept", tag, index, activeName);
deleteActiveTagIfNotUnique(tag, index); deleteActiveTagIfNotUnique(tag, index);
destroyAutocomplete(); destroyAutocomplete();
decideNextActive(); decideNextActive();