@ozdao/martyrs 0.2.476 → 0.2.478

package/dist/martyrs/src/components/FieldTags/FieldTags.vue.cjs

@@ -1,9 +1,11 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const vueTagsInput_js_vue_type_script_src_true_lang = require("./vue-tags-input.cjs");
 const vue = require("vue");
+const index = require("../../../../_virtual/index.cjs");
+const createTags = require("./create-tags.cjs");
+const tagInput = require("./tag-input.vue2.cjs");
+const vueTagsInput_props = require("./vue-tags-input.props.cjs");
 ;/* empty css                      */
-const _pluginVue_exportHelper = require("../../../../_virtual/_plugin-vue_export-helper.cjs");
 const _hoisted_1 = { class: "ti-input" };
 const _hoisted_2 = {
   key: 0,
@@ -25,183 +27,456 @@ const _hoisted_9 = ["onClick"];
 const _hoisted_10 = ["onClick"];
 const _hoisted_11 = { class: "ti-new-tag-input-wrapper" };
 const _hoisted_12 = ["placeholder", "value", "maxlength", "disabled"];
-const _hoisted_13 = ["onMouseover"];
+const _hoisted_13 = ["onMouseenter"];
 const _hoisted_14 = ["onClick"];
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_tag_input = vue.resolveComponent("tag-input");
-  return vue.openBlock(), vue.createElementBlock("div", {
-    class: vue.normalizeClass(["vue-tags-input pos-relative", [{ "ti-disabled": _ctx.disabled }, { "ti-focus": _ctx.focused }, _ctx.$attrs.class]]),
-    style: vue.normalizeStyle(_ctx.$attrs.style)
-  }, [
-    vue.createElementVNode("div", _hoisted_1, [
-      _ctx.tagsCopy ? (vue.openBlock(), vue.createElementBlock("ul", _hoisted_2, [
-        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.tagsCopy, (tag, index) => {
-          return vue.openBlock(), vue.createElementBlock("li", {
-            key: index,
-            style: vue.normalizeStyle(tag.style),
-            class: vue.normalizeClass([[
-              { "ti-editing": _ctx.tagsEditStatus[index] },
-              tag.tiClasses,
-              tag.classes,
-              { "ti-deletion-mark": _ctx.isMarked(index) }
-            ], "ti-tag t-medium"]),
-            tabindex: "0",
-            onClick: ($event) => _ctx.$emit("tag-clicked", { tag, index })
-          }, [
-            vue.createElementVNode("div", _hoisted_4, [
-              _ctx.$slots["tag-left"] ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, [
-                vue.renderSlot(_ctx.$slots, "tag-left", {
-                  tag,
-                  index,
-                  edit: _ctx.tagsEditStatus[index],
-                  performSaveEdit: _ctx.performSaveTag,
-                  performDelete: _ctx.performDeleteTag,
-                  performCancelEdit: _ctx.cancelEdit,
-                  performOpenEdit: _ctx.performEditTag,
-                  deletionMark: _ctx.isMarked(index)
-                })
-              ])) : vue.createCommentVNode("", true),
-              vue.createElementVNode("div", {
-                ref_for: true,
-                ref: _ctx.setTagCenter,
-                class: "ti-tag-center"
+const _sfc_main = {
+  __name: "FieldTags",
+  props: vueTagsInput_props.default,
+  emits: [
+    "adding-duplicate",
+    "before-adding-tag",
+    "before-deleting-tag",
+    "before-editing-tag",
+    "before-saving-tag",
+    "max-tags-reached",
+    "saving-duplicate",
+    "tags-changed",
+    "tag-clicked",
+    "update:modelValue",
+    "update:tags"
+  ],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const propsObj = __props;
+    const emit = __emit;
+    const tagCenterRefs = vue.ref(/* @__PURE__ */ new Map());
+    const newTag = vue.ref(propsObj.modelValue || "");
+    const tagsCopy = vue.shallowRef([]);
+    const tagsEditStatus = vue.ref([]);
+    const deletionMark = vue.ref(null);
+    const deletionMarkTimer = vue.ref(null);
+    const selectedItem = vue.ref(null);
+    const focused = vue.ref(false);
+    const newTagInputRef = vue.ref(null);
+    const autocompleteOpen = vue.computed(() => {
+      if (propsObj.autocompleteAlwaysOpen) return true;
+      return newTag.value !== null && newTag.value.length >= propsObj.autocompleteMinLength && filteredAutocompleteItems.value.length > 0 && focused.value;
+    });
+    const filteredAutocompleteItems = vue.computed(() => {
+      const items = propsObj.autocompleteItems.map(
+        (i) => createTags.createTag(i, propsObj.tags, propsObj.validation, propsObj.isDuplicate)
+      );
+      if (!propsObj.autocompleteFilterDuplicates) return items;
+      return items.filter(duplicateFilter);
+    });
+    const getSelectedIndex = (method) => {
+      const items = filteredAutocompleteItems.value;
+      const current = selectedItem.value;
+      const lastItem = items.length - 1;
+      if (items.length === 0) return;
+      if (current === null) return 0;
+      if (method === "before" && current === 0) return lastItem;
+      if (method === "after" && current === lastItem) return 0;
+      return method === "after" ? current + 1 : current - 1;
+    };
+    const selectDefaultItem = () => {
+      selectedItem.value = propsObj.addOnlyFromAutocomplete && filteredAutocompleteItems.value.length > 0 ? 0 : null;
+    };
+    const selectItem = (method) => {
+      selectedItem.value = getSelectedIndex(method);
+    };
+    const isSelected = (index2) => selectedItem.value === index2;
+    const isMarked = (index2) => deletionMark.value === index2;
+    const setTagCenter = (el, index2) => {
+      if (el) {
+        tagCenterRefs.value.set(index2, el);
+      } else {
+        tagCenterRefs.value.delete(index2);
+      }
+    };
+    const invokeDelete = () => {
+      if (!propsObj.deleteOnBackspace || newTag.value.length > 0) return;
+      const lastIndex = tagsCopy.value.length - 1;
+      if (deletionMark.value === null) {
+        clearTimeout(deletionMarkTimer.value);
+        deletionMarkTimer.value = setTimeout(() => deletionMark.value = null, 1e3);
+        deletionMark.value = lastIndex;
+      } else {
+        performDeleteTag(lastIndex);
+      }
+    };
+    const addTagsFromPaste = () => {
+      if (!propsObj.addFromPaste) return;
+      setTimeout(() => performAddTags(newTag.value), 10);
+    };
+    const performEditTag = (index2) => {
+      if (!propsObj.allowEditTags) return;
+      if (!propsObj.onBeforeEditingTag) {
+        editTag(index2);
+      } else {
+        emit("before-editing-tag", {
+          index: index2,
+          tag: tagsCopy.value[index2],
+          editTag: () => editTag(index2)
+        });
+      }
+    };
+    const editTag = (index2) => {
+      if (!propsObj.allowEditTags) return;
+      toggleEditMode(index2);
+      focus(index2);
+    };
+    const toggleEditMode = (index2) => {
+      if (!propsObj.allowEditTags || propsObj.disabled) return;
+      tagsEditStatus.value[index2] = !tagsEditStatus.value[index2];
+    };
+    const createChangedTag = (index2, event) => {
+      const tag = tagsCopy.value[index2];
+      tag.text = event ? event.target.value : tagsCopy.value[index2].text;
+      const newTags = [...tagsCopy.value];
+      newTags[index2] = createTags.createTag(tag, tagsCopy.value, propsObj.validation, propsObj.isDuplicate);
+      tagsCopy.value = newTags;
+    };
+    const focus = (index2) => {
+      vue.nextTick(() => {
+        var _a;
+        const el = (_a = tagCenterRefs.value.get(index2)) == null ? void 0 : _a.querySelector("input.ti-tag-input");
+        if (el) el.focus();
+      });
+    };
+    const quote = (regex) => regex.replace(/([()[{*+.$^\\|?])/g, "\\$1");
+    const cancelEdit = (index2) => {
+      if (!propsObj.tags[index2]) return;
+      const newTags = [...tagsCopy.value];
+      newTags[index2] = createTags.clone(createTags.createTag(propsObj.tags[index2], propsObj.tags, propsObj.validation, propsObj.isDuplicate));
+      tagsCopy.value = newTags;
+      tagsEditStatus.value[index2] = false;
+    };
+    const hasForbiddingAddRule = (tiClasses) => {
+      return tiClasses.some((type) => {
+        const rule = propsObj.validation.find((rule2) => type === rule2.classes);
+        return rule ? rule.disableAdd : false;
+      });
+    };
+    const createTagTexts = (string) => {
+      const regex = new RegExp(propsObj.separators.map((s) => quote(s)).join("|"));
+      return string.split(regex).map((text) => ({ text }));
+    };
+    const performDeleteTag = (index2) => {
+      if (!propsObj.onBeforeDeletingTag) {
+        deleteTag(index2);
+      } else {
+        emit("before-deleting-tag", {
+          index: index2,
+          tag: tagsCopy.value[index2],
+          deleteTag: () => deleteTag(index2)
+        });
+      }
+    };
+    const deleteTag = (index2) => {
+      if (propsObj.disabled) return;
+      deletionMark.value = null;
+      clearTimeout(deletionMarkTimer.value);
+      const newTags = [...tagsCopy.value];
+      newTags.splice(index2, 1);
+      tagsCopy.value = newTags;
+      tagsEditStatus.value.splice(index2, 1);
+      emit("update:tags", tagsCopy.value);
+      emit("tags-changed", tagsCopy.value);
+    };
+    const noTriggerKey = (event, category) => {
+      const triggerKey = propsObj[category].indexOf(event.keyCode) !== -1 || propsObj[category].indexOf(event.key) !== -1;
+      if (triggerKey) event.preventDefault();
+      return !triggerKey;
+    };
+    const performAddTags = (tag, event, source) => {
+      if (propsObj.disabled || event && noTriggerKey(event, "addOnKey")) return;
+      let tags = [];
+      if (typeof tag === "object") tags = [tag];
+      if (typeof tag === "string") tags = createTagTexts(tag);
+      tags = tags.filter((tag2) => tag2.text.trim().length > 0);
+      tags.forEach((tag2) => {
+        tag2 = createTags.createTag(tag2, propsObj.tags, propsObj.validation, propsObj.isDuplicate);
+        if (!propsObj.onBeforeAddingTag) {
+          addTag(tag2, source);
+        } else {
+          emit("before-adding-tag", {
+            tag: tag2,
+            addTag: () => addTag(tag2, source)
+          });
+        }
+      });
+    };
+    const duplicateFilter = (tag) => {
+      return propsObj.isDuplicate ? !propsObj.isDuplicate(tagsCopy.value, tag) : !tagsCopy.value.find((t) => t.text === tag.text);
+    };
+    const addTag = (tag, source = "new-tag-input") => {
+      const options = filteredAutocompleteItems.value.map((i) => i.text);
+      if (propsObj.addOnlyFromAutocomplete && options.indexOf(tag.text) === -1) return;
+      vue.nextTick(() => {
+        var _a;
+        const maximumReached = propsObj.maxTags && propsObj.maxTags <= tagsCopy.value.length;
+        if (maximumReached) return emit("max-tags-reached", tag);
+        const dup = propsObj.avoidAddingDuplicates && !duplicateFilter(tag);
+        if (dup) return emit("adding-duplicate", tag);
+        if (hasForbiddingAddRule(tag.tiClasses)) return;
+        newTag.value = "";
+        tagsCopy.value = [...tagsCopy.value, tag];
+        tagsEditStatus.value.push(false);
+        emit("update:tags", tagsCopy.value);
+        if (source === "autocomplete") (_a = newTagInputRef.value) == null ? void 0 : _a.focus();
+        emit("tags-changed", tagsCopy.value);
+      });
+    };
+    const performSaveTag = (index2, event) => {
+      const tag = tagsCopy.value[index2];
+      if (propsObj.disabled || event && noTriggerKey(event, "addOnKey")) return;
+      if (tag.text.trim().length === 0) return;
+      if (!propsObj["onBeforeSavingTag"]) {
+        saveTag(index2, tag);
+      } else {
+        emit("before-saving-tag", {
+          index: index2,
+          tag,
+          saveTag: () => saveTag(index2, tag)
+        });
+      }
+    };
+    const saveTag = (index2, tag) => {
+      if (propsObj.avoidAddingDuplicates) {
+        const tagsDiff = createTags.clone(tagsCopy.value);
+        const inputTag = tagsDiff.splice(index2, 1)[0];
+        const dup = propsObj.isDuplicate ? propsObj.isDuplicate(tagsDiff, inputTag) : tagsDiff.map((t) => t.text).indexOf(inputTag.text) !== -1;
+        if (dup) return emit("saving-duplicate", tag);
+      }
+      if (hasForbiddingAddRule(tag.tiClasses)) return;
+      const newTags = [...tagsCopy.value];
+      newTags[index2] = tag;
+      tagsCopy.value = newTags;
+      toggleEditMode(index2);
+      emit("update:tags", tagsCopy.value);
+      emit("tags-changed", tagsCopy.value);
+    };
+    const tagsEqual = () => {
+      return !tagsCopy.value.some((t, i) => !index.default(t, propsObj.tags[i]));
+    };
+    const updateNewTag = (event) => {
+      const value = event.target.value;
+      newTag.value = value;
+      emit("update:modelValue", value);
+    };
+    const initTags = () => {
+      tagsCopy.value = createTags.createTags(propsObj.tags, propsObj.validation, propsObj.isDuplicate);
+      tagsEditStatus.value = new Array(propsObj.tags.length).fill(false);
+      if (!tagsEqual()) {
+        emit("update:tags", tagsCopy.value);
+      }
+    };
+    const blurredOnClick = (e) => {
+      const el = e.currentTarget;
+      if ((el == null ? void 0 : el.contains(e.target)) || (el == null ? void 0 : el.contains(document.activeElement))) return;
+      performBlur();
+    };
+    const performBlur = () => {
+      if (propsObj.addOnBlur && focused.value) performAddTags(newTag.value);
+      focused.value = false;
+    };
+    const handleKeyDown = (event) => {
+      const item = filteredAutocompleteItems.value[selectedItem.value] || newTag.value;
+      performAddTags(item, event);
+    };
+    vue.watch(() => propsObj.modelValue, (newValue) => {
+      if (!propsObj.addOnlyFromAutocomplete) selectedItem.value = null;
+      newTag.value = newValue;
+    });
+    vue.watch(() => propsObj.tags, () => {
+      initTags();
+    }, { deep: true });
+    vue.watch(autocompleteOpen, selectDefaultItem);
+    initTags();
+    vue.onMounted(() => {
+      selectDefaultItem();
+      document.addEventListener("click", blurredOnClick);
+    });
+    vue.onBeforeUnmount(() => {
+      document.removeEventListener("click", blurredOnClick);
+      clearTimeout(deletionMarkTimer.value);
+    });
+    __expose({
+      createClasses: createTags.createClasses
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", {
+        class: vue.normalizeClass(["vue-tags-input pos-relative", [{ "ti-disabled": _ctx.disabled }, { "ti-focus": focused.value }, _ctx.$attrs.class]]),
+        style: vue.normalizeStyle(_ctx.$attrs.style)
+      }, [
+        vue.createElementVNode("div", _hoisted_1, [
+          tagsCopy.value.length || !_ctx.disabled ? (vue.openBlock(), vue.createElementBlock("ul", _hoisted_2, [
+            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(tagsCopy.value, (tag, index2) => {
+              return vue.openBlock(), vue.createElementBlock("li", {
+                key: `tag-${index2}-${tag.text}`,
+                style: vue.normalizeStyle(tag.style),
+                class: vue.normalizeClass([[
+                  { "ti-editing": tagsEditStatus.value[index2] },
+                  tag.tiClasses,
+                  tag.classes,
+                  { "ti-deletion-mark": isMarked(index2) }
+                ], "ti-tag t-medium"]),
+                tabindex: "0",
+                onClick: ($event) => emit("tag-clicked", { tag, index: index2 })
+              }, [
+                vue.createElementVNode("div", _hoisted_4, [
+                  _ctx.$slots["tag-left"] ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5, [
+                    vue.renderSlot(_ctx.$slots, "tag-left", {
+                      tag,
+                      index: index2,
+                      edit: tagsEditStatus.value[index2],
+                      performSaveEdit: performSaveTag,
+                      performDelete: performDeleteTag,
+                      performCancelEdit: cancelEdit,
+                      performOpenEdit: performEditTag,
+                      deletionMark: isMarked(index2)
+                    })
+                  ])) : vue.createCommentVNode("", true),
+                  vue.createElementVNode("div", {
+                    ref_for: true,
+                    ref: (el) => setTagCenter(el, index2),
+                    class: "ti-tag-center"
+                  }, [
+                    !_ctx.$slots["tag-center"] ? (vue.openBlock(), vue.createElementBlock("span", {
+                      key: 0,
+                      class: vue.normalizeClass({ "ti-hidden": tagsEditStatus.value[index2] }),
+                      onClick: ($event) => performEditTag(index2)
+                    }, vue.toDisplayString(tag.text), 11, _hoisted_6)) : vue.createCommentVNode("", true),
+                    !_ctx.$slots["tag-center"] ? (vue.openBlock(), vue.createBlock(tagInput.default, {
+                      key: 1,
+                      scope: {
+                        edit: tagsEditStatus.value[index2],
+                        maxlength: _ctx.maxlength,
+                        tag,
+                        index: index2,
+                        validateTag: createChangedTag,
+                        performCancelEdit: cancelEdit,
+                        performSaveEdit: performSaveTag
+                      }
+                    }, null, 8, ["scope"])) : vue.createCommentVNode("", true),
+                    vue.renderSlot(_ctx.$slots, "tag-center", {
+                      tag,
+                      index: index2,
+                      maxlength: _ctx.maxlength,
+                      edit: tagsEditStatus.value[index2],
+                      performSaveEdit: performSaveTag,
+                      performDelete: performDeleteTag,
+                      performCancelEdit: cancelEdit,
+                      validateTag: createChangedTag,
+                      performOpenEdit: performEditTag,
+                      deletionMark: isMarked(index2)
+                    })
+                  ], 512),
+                  _ctx.$slots["tag-right"] ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7, [
+                    vue.renderSlot(_ctx.$slots, "tag-right", {
+                      tag,
+                      index: index2,
+                      edit: tagsEditStatus.value[index2],
+                      performSaveEdit: performSaveTag,
+                      performDelete: performDeleteTag,
+                      performCancelEdit: cancelEdit,
+                      performOpenEdit: performEditTag,
+                      deletionMark: isMarked(index2)
+                    })
+                  ])) : vue.createCommentVNode("", true)
+                ]),
+                vue.createElementVNode("div", _hoisted_8, [
+                  !_ctx.$slots["tag-actions"] ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("i", {
+                    key: 0,
+                    class: "ti-icon-undo",
+                    onClick: vue.withModifiers(($event) => cancelEdit(index2), ["stop"])
+                  }, null, 8, _hoisted_9)), [
+                    [vue.vShow, tagsEditStatus.value[index2]]
+                  ]) : vue.createCommentVNode("", true),
+                  !_ctx.$slots["tag-actions"] ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("i", {
+                    key: 1,
+                    class: "ti-icon-close",
+                    onClick: vue.withModifiers(($event) => performDeleteTag(index2), ["stop"])
+                  }, null, 8, _hoisted_10)), [
+                    [vue.vShow, !tagsEditStatus.value[index2]]
+                  ]) : vue.createCommentVNode("", true),
+                  _ctx.$slots["tag-actions"] ? vue.renderSlot(_ctx.$slots, "tag-actions", {
+                    key: 2,
+                    tag,
+                    index: index2,
+                    edit: tagsEditStatus.value[index2],
+                    performSaveEdit: performSaveTag,
+                    performDelete: performDeleteTag,
+                    performCancelEdit: cancelEdit,
+                    performOpenEdit: performEditTag,
+                    deletionMark: isMarked(index2)
+                  }) : vue.createCommentVNode("", true)
+                ])
+              ], 14, _hoisted_3);
+            }), 128)),
+            vue.createElementVNode("li", _hoisted_11, [
+              vue.createElementVNode("input", {
+                ref_key: "newTagInputRef",
+                ref: newTagInputRef,
+                class: vue.normalizeClass([[vue.unref(createTags.createClasses)(newTag.value, _ctx.tags, _ctx.validation, _ctx.isDuplicate)], "ti-new-tag-input"]),
+                placeholder: _ctx.placeholder,
+                value: newTag.value,
+                maxlength: _ctx.maxlength,
+                disabled: _ctx.disabled,
+                type: "text",
+                size: "1",
+                onKeydown: [
+                  handleKeyDown,
+                  vue.withKeys(invokeDelete, ["delete"]),
+                  vue.withKeys(performBlur, ["tab"]),
+                  _cache[0] || (_cache[0] = vue.withKeys(vue.withModifiers(($event) => selectItem("before"), ["prevent"]), ["up"])),
+                  _cache[1] || (_cache[1] = vue.withKeys(vue.withModifiers(($event) => selectItem("after"), ["prevent"]), ["down"]))
+                ],
+                onPaste: addTagsFromPaste,
+                onInput: updateNewTag,
+                onFocus: _cache[2] || (_cache[2] = ($event) => focused.value = true),
+                onClick: _cache[3] || (_cache[3] = ($event) => !_ctx.addOnlyFromAutocomplete && (selectedItem.value = null))
+              }, null, 42, _hoisted_12)
+            ])
+          ])) : vue.createCommentVNode("", true)
+        ]),
+        vue.renderSlot(_ctx.$slots, "between-elements"),
+        autocompleteOpen.value ? (vue.openBlock(), vue.createElementBlock("div", {
+          key: 0,
+          class: vue.normalizeClass(["ti-autocomplete", _ctx.$attrs.class]),
+          onMouseleave: _cache[4] || (_cache[4] = ($event) => selectedItem.value = null)
+        }, [
+          vue.renderSlot(_ctx.$slots, "autocomplete-header"),
+          vue.createElementVNode("ul", null, [
+            (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(filteredAutocompleteItems.value, (item, index2) => {
+              return vue.openBlock(), vue.createElementBlock("li", {
+                key: `autocomplete-${index2}-${item.text}`,
+                style: vue.normalizeStyle(item.style),
+                class: vue.normalizeClass([[
+                  item.tiClasses,
+                  item.classes,
+                  { "ti-selected-item": isSelected(index2) }
+                ], "ti-item"]),
+                onMouseenter: ($event) => !_ctx.disabled && (selectedItem.value = index2)
               }, [
-                !_ctx.$slots["tag-center"] ? (vue.openBlock(), vue.createElementBlock("span", {
+                !_ctx.$slots["autocomplete-item"] ? (vue.openBlock(), vue.createElementBlock("div", {
                   key: 0,
-                  class: vue.normalizeClass({ "ti-hidden": _ctx.tagsEditStatus[index] }),
-                  onClick: ($event) => _ctx.performEditTag(index)
-                }, vue.toDisplayString(tag.text), 11, _hoisted_6)) : vue.createCommentVNode("", true),
-                !_ctx.$slots["tag-center"] ? (vue.openBlock(), vue.createBlock(_component_tag_input, {
+                  onClick: ($event) => performAddTags(item, void 0, "autocomplete")
+                }, vue.toDisplayString(item.text), 9, _hoisted_14)) : vue.renderSlot(_ctx.$slots, "autocomplete-item", {
                   key: 1,
-                  scope: {
-                    edit: _ctx.tagsEditStatus[index],
-                    maxlength: _ctx.maxlength,
-                    tag,
-                    index,
-                    validateTag: _ctx.createChangedTag,
-                    performCancelEdit: _ctx.cancelEdit,
-                    performSaveEdit: _ctx.performSaveTag
-                  }
-                }, null, 8, ["scope"])) : vue.createCommentVNode("", true),
-                vue.renderSlot(_ctx.$slots, "tag-center", {
-                  tag,
-                  index,
-                  maxlength: _ctx.maxlength,
-                  edit: _ctx.tagsEditStatus[index],
-                  performSaveEdit: _ctx.performSaveTag,
-                  performDelete: _ctx.performDeleteTag,
-                  performCancelEdit: _ctx.cancelEdit,
-                  validateTag: _ctx.createChangedTag,
-                  performOpenEdit: _ctx.performEditTag,
-                  deletionMark: _ctx.isMarked(index)
-                })
-              ], 512),
-              _ctx.$slots["tag-right"] ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7, [
-                vue.renderSlot(_ctx.$slots, "tag-right", {
-                  tag,
-                  index,
-                  edit: _ctx.tagsEditStatus[index],
-                  performSaveEdit: _ctx.performSaveTag,
-                  performDelete: _ctx.performDeleteTag,
-                  performCancelEdit: _ctx.cancelEdit,
-                  performOpenEdit: _ctx.performEditTag,
-                  deletionMark: _ctx.isMarked(index)
+                  item,
+                  index: index2,
+                  performAdd: (item2) => performAddTags(item2, void 0, "autocomplete"),
+                  selected: isSelected(index2)
                 })
-              ])) : vue.createCommentVNode("", true)
-            ]),
-            vue.createElementVNode("div", _hoisted_8, [
-              !_ctx.$slots["tag-actions"] ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("i", {
-                key: 0,
-                class: "ti-icon-undo",
-                onClick: ($event) => _ctx.cancelEdit(index)
-              }, null, 8, _hoisted_9)), [
-                [vue.vShow, _ctx.tagsEditStatus[index]]
-              ]) : vue.createCommentVNode("", true),
-              !_ctx.$slots["tag-actions"] ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("i", {
-                key: 1,
-                class: "ti-icon-close",
-                onClick: ($event) => _ctx.performDeleteTag(index)
-              }, null, 8, _hoisted_10)), [
-                [vue.vShow, !_ctx.tagsEditStatus[index]]
-              ]) : vue.createCommentVNode("", true),
-              _ctx.$slots["tag-actions"] ? vue.renderSlot(_ctx.$slots, "tag-actions", {
-                key: 2,
-                tag,
-                index,
-                edit: _ctx.tagsEditStatus[index],
-                performSaveEdit: _ctx.performSaveTag,
-                performDelete: _ctx.performDeleteTag,
-                performCancelEdit: _ctx.cancelEdit,
-                performOpenEdit: _ctx.performEditTag,
-                deletionMark: _ctx.isMarked(index)
-              }) : vue.createCommentVNode("", true)
-            ])
-          ], 14, _hoisted_3);
-        }), 128)),
-        vue.createElementVNode("li", _hoisted_11, [
-          vue.createElementVNode("input", {
-            ref: "newTagInput",
-            class: vue.normalizeClass([[_ctx.createClasses(_ctx.newTag, _ctx.tags, _ctx.validation, _ctx.isDuplicate)], "ti-new-tag-input"]),
-            placeholder: _ctx.placeholder,
-            value: _ctx.newTag,
-            maxlength: _ctx.maxlength,
-            disabled: _ctx.disabled,
-            type: "text",
-            size: "1",
-            onKeydown: [
-              _cache[0] || (_cache[0] = ($event) => _ctx.performAddTags(
-                _ctx.filteredAutocompleteItems[_ctx.selectedItem] || _ctx.newTag,
-                $event
-              )),
-              _cache[2] || (_cache[2] = vue.withKeys((...args) => _ctx.invokeDelete && _ctx.invokeDelete(...args), ["delete"])),
-              _cache[3] || (_cache[3] = vue.withKeys((...args) => _ctx.performBlur && _ctx.performBlur(...args), ["tab"])),
-              _cache[4] || (_cache[4] = vue.withKeys(($event) => _ctx.selectItem($event, "before"), ["up"])),
-              _cache[5] || (_cache[5] = vue.withKeys(($event) => _ctx.selectItem($event, "after"), ["down"]))
-            ],
-            onPaste: _cache[1] || (_cache[1] = (...args) => _ctx.addTagsFromPaste && _ctx.addTagsFromPaste(...args)),
-            onInput: _cache[6] || (_cache[6] = (...args) => _ctx.updateNewTag && _ctx.updateNewTag(...args)),
-            onFocus: _cache[7] || (_cache[7] = ($event) => _ctx.focused = true),
-            onClick: _cache[8] || (_cache[8] = ($event) => _ctx.addOnlyFromAutocomplete ? false : _ctx.selectedItem = null)
-          }, null, 42, _hoisted_12)
-        ])
-      ])) : vue.createCommentVNode("", true)
-    ]),
-    vue.renderSlot(_ctx.$slots, "between-elements"),
-    _ctx.autocompleteOpen ? (vue.openBlock(), vue.createElementBlock("div", {
-      key: 0,
-      class: vue.normalizeClass(["ti-autocomplete", _ctx.$attrs.class]),
-      onMouseout: _cache[9] || (_cache[9] = ($event) => _ctx.selectedItem = null)
-    }, [
-      vue.renderSlot(_ctx.$slots, "autocomplete-header"),
-      vue.createElementVNode("ul", null, [
-        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.filteredAutocompleteItems, (item, index) => {
-          return vue.openBlock(), vue.createElementBlock("li", {
-            key: index,
-            style: vue.normalizeStyle(item.style),
-            class: vue.normalizeClass([[
-              item.tiClasses,
-              item.classes,
-              { "ti-selected-item": _ctx.isSelected(index) }
-            ], "ti-item"]),
-            onMouseover: ($event) => _ctx.disabled ? false : _ctx.selectedItem = index
-          }, [
-            !_ctx.$slots["autocomplete-item"] ? (vue.openBlock(), vue.createElementBlock("div", {
-              key: 0,
-              onClick: ($event) => _ctx.performAddTags(item, void 0, "autocomplete")
-            }, vue.toDisplayString(item.text), 9, _hoisted_14)) : vue.renderSlot(_ctx.$slots, "autocomplete-item", {
-              key: 1,
-              item,
-              index,
-              performAdd: (item2) => _ctx.performAddTags(item2, void 0, "autocomplete"),
-              selected: _ctx.isSelected(index)
-            })
-          ], 46, _hoisted_13);
-        }), 128))
-      ]),
-      vue.renderSlot(_ctx.$slots, "autocomplete-footer")
-    ], 34)) : vue.createCommentVNode("", true)
-  ], 6);
-}
-const FieldTags = /* @__PURE__ */ _pluginVue_exportHelper.default(vueTagsInput_js_vue_type_script_src_true_lang.default, [["render", _sfc_render]]);
-exports.default = FieldTags;
+              ], 46, _hoisted_13);
+            }), 128))
+          ]),
+          vue.renderSlot(_ctx.$slots, "autocomplete-footer")
+        ], 34)) : vue.createCommentVNode("", true)
+      ], 6);
+    };
+  }
+};
+exports.default = _sfc_main;
 //# sourceMappingURL=FieldTags.vue.cjs.map