Edit tags in the middle of input

templates/select_tag.html

@@ -1,12 +1,14 @@
 <input
   class="tags"
   type="text"
+  id="search-tags"
   name="tags"
   hx-post="/search_tags"
-  hx-trigger="input changed delay:400ms"
+  hx-trigger="input changed"
   hx-target="next .tags-autocomplete"
-  hx-swap="innerHTML"
+  hx-vals="js:{selection_end: event.target.selectionEnd}"
   hx-on::after-settle="this.focus(); this.setSelectionRange(-1, -1);"
   value="{{ tags }}"
+  autofocus
 />
 <ul class="tags-autocomplete" hx-swap-oob="outerHTML:.tags-autocomplete"></ul>