diff --git a/ts/components/ButtonToolbar.svelte b/ts/components/ButtonToolbar.svelte
index a81e3cc6f..245e8c950 100644
--- a/ts/components/ButtonToolbar.svelte
+++ b/ts/components/ButtonToolbar.svelte
@@ -81,6 +81,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
class={`btn-toolbar container wrap-variable ${className}`}
{style}
role="toolbar"
+ on:focusout
>
{#each $dynamicItems as item}
diff --git a/ts/editor/TagEditor.svelte b/ts/editor/TagEditor.svelte
index c5388e499..d0aec2b98 100644
--- a/ts/editor/TagEditor.svelte
+++ b/ts/editor/TagEditor.svelte
@@ -278,10 +278,25 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
autocomplete.hide();
}
}
+
+ function deselect() {
+ tags = tags.map((tag: TagType): TagType => ({ ...tag, selected: false }));
+ }
+
+ function deselectIfLeave(event: FocusEvent) {
+ const toolbar = event.currentTarget as HTMLDivElement;
+ if (!toolbar.contains(event.relatedTarget as Element)) {
+ deselect();
+ }
+ }
-
+
@@ -338,7 +353,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
name={tag.name}
bind:flash={tag.flash}
bind:selected={tag.selected}
- on:tagedit={() => (active = index)}
+ on:tagedit={() => {
+ active = index;
+ deselect();
+ }}
on:tagrange={console.log}
on:tagdelete={() => {
deleteTagAt(index);