Make Autocomplete dismount along with TagInput on blur

This commit is contained in:
Henrik Giesel 2021-06-28 02:08:30 +02:00
parent b4e84e8043
commit ba64f50593

View file

@ -219,16 +219,16 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
<ButtonToolbar class="dropup d-flex flex-wrap align-items-center" {size}> <ButtonToolbar class="dropup d-flex flex-wrap align-items-center" {size}>
<AddTagBadge on:click={appendEmptyTag} /> <AddTagBadge on:click={appendEmptyTag} />
<TagAutocomplete {#each tags as tag, index (tag.id)}
class="d-flex flex-column-reverse" {#if index === active}
{suggestions} <TagAutocomplete
search={tags[active ?? -1]?.name ?? ""} class="d-flex flex-column-reverse"
on:autocomplete={onAutocomplete} {suggestions}
let:updateAutocomplete search={tags[active ?? -1]?.name ?? ""}
let:destroyAutocomplete on:autocomplete={onAutocomplete}
> let:updateAutocomplete
{#each tags as tag, index (tag.id)} let:destroyAutocomplete
{#if index === active} >
<TagInput <TagInput
id={tag.id} id={tag.id}
bind:name={activeName} bind:name={activeName}
@ -252,21 +252,21 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
tag.name = activeName; tag.name = activeName;
}} }}
/> />
{:else} </TagAutocomplete>
<Tag {:else}
name={tag.name} <Tag
bind:blink={tag.blink} name={tag.name}
on:click={() => (active = index)} bind:blink={tag.blink}
on:tagdelete={() => deleteTag(index)} on:click={() => (active = index)}
/> on:tagdelete={() => deleteTag(index)}
{/if} />
{/each} {/if}
{/each}
<div <div
class="tag-spacer flex-grow-1 align-self-stretch" class="tag-spacer flex-grow-1 align-self-stretch"
on:click={appendEmptyTag} on:click={appendEmptyTag}
/> />
</TagAutocomplete>
<div> <div>
a, aab, an, ac: {active} a, aab, an, ac: {active}