@vue-interface/tag-field 1.0.0 → 1.0.2

package/README.md

@@ -1,4 +1,4 @@
-# Searchable Select Field
+# Tag Field
 
 The `tag-field` component provides flexible and customizable searchable input field with tags that have customizable sizes, states, and colors.
 

package/dist/src/TagField.vue.d.ts

@@ -1,19 +1,25 @@
+import { BadgeSize } from '@vue-interface/badge';
 import { FormControlProps, FormControlSlots } from '@vue-interface/form-control';
 import { IFuseOptions } from 'fuse.js';
 import { HTMLAttributes } from 'vue';
 export type TagFieldSizePrefix = 'form-control';
-export type TagFieldProps<T, Value> = /* @vue-ignore */ FormControlProps<HTMLAttributes, TagFieldSizePrefix, T[], Value[]> & {
-    options?: T[];
-    fuseOptions?: IFuseOptions<T>;
-    display?: (option: T) => string;
-    format?: (value: string) => T;
+export type TagFieldProps<ModelValue, Value> = FormControlProps<HTMLAttributes, TagFieldSizePrefix, ModelValue[], Value[]> & {
+    options?: ModelValue[];
+    fuseOptions?: IFuseOptions<ModelValue>;
+    display?: (option: ModelValue) => string;
+    format?: (value: string) => ModelValue;
     allowCustom?: boolean;
     addTagLabel?: string;
     noResultsText?: string;
     showNoResults?: boolean;
     clearable?: boolean;
+    badgeClass?: string | string[] | Record<string, boolean>;
+    activeBadgeColor?: string | string[] | Record<string, boolean>;
+    badgeSize?: BadgeSize;
+    badgeCloseable?: boolean;
+    badgeCloseLeft?: boolean;
 };
-declare const _default: <T, Value>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+declare const _default: <ModelValue, Value>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
         readonly onInput?: ((event: Event) => any) | undefined;
         readonly onSelect?: ((event: Event) => any) | undefined;
@@ -49,9 +55,9 @@ declare const _default: <T, Value>(__VLS_props: NonNullable<Awaited<typeof __VLS
         readonly onTouchcancel?: ((event: TouchEvent) => any) | undefined;
         readonly onChange?: ((event: Event) => any) | undefined;
         readonly onBeforeinput?: ((event: Event) => any) | undefined;
-        readonly "onUpdate:modelValue"?: ((value: T[]) => any) | undefined;
+        readonly "onUpdate:modelValue"?: ((value: ModelValue[]) => any) | undefined;
     } & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, "onCopy" | "onCut" | "onPaste" | "onFocus" | "onFocusin" | "onFocusout" | "onBlur" | "onChange" | "onBeforeinput" | "onInput" | "onReset" | "onSubmit" | "onInvalid" | "onKeydown" | "onKeypress" | "onKeyup" | "onMousedown" | "onMouseenter" | "onMouseleave" | "onMousemove" | "onMouseout" | "onMouseover" | "onMouseup" | "onSelect" | "onScroll" | "onTouchcancel" | "onTouchend" | "onTouchmove" | "onTouchstart" | "onClick" | "onContextmenu" | "onWheel" | "onDoubleclick" | "onSelectionchange" | "onUpdate:modelValue"> & ({
-        modelValue?: T[];
+        modelValue?: ModelValue[];
     } & {
         activity?: boolean;
         disabled?: boolean;
@@ -66,7 +72,7 @@ declare const _default: <T, Value>(__VLS_props: NonNullable<Awaited<typeof __VLS
         invalid?: boolean;
         label?: string;
         labelClass?: string;
-        modelValue?: T[] | undefined;
+        modelValue?: ModelValue[] | undefined;
         name?: string;
         plaintext?: boolean;
         size?: import('@vue-interface/form-control').FormControlSize<"form-control"> | undefined;
@@ -75,36 +81,41 @@ declare const _default: <T, Value>(__VLS_props: NonNullable<Awaited<typeof __VLS
         valid?: boolean;
         value?: Value[] | undefined;
     } & Omit<HTMLAttributes, "size"> & {
-        options?: T[] | undefined;
-        fuseOptions?: IFuseOptions<T> | undefined;
-        display?: ((option: T) => string) | undefined;
-        format?: ((value: string) => T) | undefined;
+        options?: ModelValue[] | undefined;
+        fuseOptions?: IFuseOptions<ModelValue> | undefined;
+        display?: ((option: ModelValue) => string) | undefined;
+        format?: ((value: string) => ModelValue) | undefined;
         allowCustom?: boolean;
         addTagLabel?: string;
         noResultsText?: string;
         showNoResults?: boolean;
         clearable?: boolean;
+        badgeClass?: string | string[] | Record<string, boolean>;
+        activeBadgeColor?: string | string[] | Record<string, boolean>;
+        badgeSize?: BadgeSize;
+        badgeCloseable?: boolean;
+        badgeCloseLeft?: boolean;
     }) & Partial<{}>> & import('vue').PublicProps;
     expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;
     attrs: any;
-    slots: Readonly<FormControlSlots<"form-control", T[]> & {
+    slots: Readonly<FormControlSlots<"form-control", ModelValue[]> & {
         default(props: {
-            option: T;
-            display?: (option: T) => string;
+            option: ModelValue;
+            display?: (option: ModelValue) => string;
         }): any;
         'no-results'(props: {
             input: string | undefined;
         }): any;
-    }> & FormControlSlots<"form-control", T[]> & {
+    }> & FormControlSlots<"form-control", ModelValue[]> & {
         default(props: {
-            option: T;
-            display?: (option: T) => string;
+            option: ModelValue;
+            display?: (option: ModelValue) => string;
         }): any;
         'no-results'(props: {
             input: string | undefined;
         }): any;
     };
-    emit: (((evt: "input", event: Event) => void) & ((evt: "select", event: Event) => void) & ((evt: "click", event: MouseEvent) => void) & ((evt: "submit", event: Event) => void) & ((evt: "reset", event: Event) => void) & ((evt: "blur", event: FocusEvent) => void) & ((evt: "focus", event: FocusEvent) => void) & ((evt: "focusin", event: FocusEvent) => void) & ((evt: "focusout", event: FocusEvent) => void) & ((evt: "doubleclick", event: MouseEvent) => void) & ((evt: "contextmenu", event: MouseEvent) => void) & ((evt: "mousedown", event: MouseEvent) => void) & ((evt: "mouseup", event: MouseEvent) => void) & ((evt: "mouseover", event: MouseEvent) => void) & ((evt: "mouseout", event: MouseEvent) => void) & ((evt: "mouseenter", event: MouseEvent) => void) & ((evt: "mouseleave", event: MouseEvent) => void) & ((evt: "mousemove", event: MouseEvent) => void) & ((evt: "keydown", event: KeyboardEvent) => void) & ((evt: "keyup", event: KeyboardEvent) => void) & ((evt: "keypress", event: KeyboardEvent) => void) & ((evt: "selectionchange", event: Event) => void) & ((evt: "invalid", event: Event) => void) & ((evt: "scroll", event: Event) => void) & ((evt: "wheel", event: WheelEvent) => void) & ((evt: "copy", event: ClipboardEvent) => void) & ((evt: "cut", event: ClipboardEvent) => void) & ((evt: "paste", event: ClipboardEvent) => void) & ((evt: "touchstart", event: TouchEvent) => void) & ((evt: "touchend", event: TouchEvent) => void) & ((evt: "touchmove", event: TouchEvent) => void) & ((evt: "touchcancel", event: TouchEvent) => void) & ((evt: "change", event: Event) => void) & ((evt: "beforeinput", event: Event) => void)) & ((evt: "update:modelValue", value: T[]) => void);
+    emit: (((evt: "input", event: Event) => void) & ((evt: "select", event: Event) => void) & ((evt: "click", event: MouseEvent) => void) & ((evt: "submit", event: Event) => void) & ((evt: "reset", event: Event) => void) & ((evt: "blur", event: FocusEvent) => void) & ((evt: "focus", event: FocusEvent) => void) & ((evt: "focusin", event: FocusEvent) => void) & ((evt: "focusout", event: FocusEvent) => void) & ((evt: "doubleclick", event: MouseEvent) => void) & ((evt: "contextmenu", event: MouseEvent) => void) & ((evt: "mousedown", event: MouseEvent) => void) & ((evt: "mouseup", event: MouseEvent) => void) & ((evt: "mouseover", event: MouseEvent) => void) & ((evt: "mouseout", event: MouseEvent) => void) & ((evt: "mouseenter", event: MouseEvent) => void) & ((evt: "mouseleave", event: MouseEvent) => void) & ((evt: "mousemove", event: MouseEvent) => void) & ((evt: "keydown", event: KeyboardEvent) => void) & ((evt: "keyup", event: KeyboardEvent) => void) & ((evt: "keypress", event: KeyboardEvent) => void) & ((evt: "selectionchange", event: Event) => void) & ((evt: "invalid", event: Event) => void) & ((evt: "scroll", event: Event) => void) & ((evt: "wheel", event: WheelEvent) => void) & ((evt: "copy", event: ClipboardEvent) => void) & ((evt: "cut", event: ClipboardEvent) => void) & ((evt: "paste", event: ClipboardEvent) => void) & ((evt: "touchstart", event: TouchEvent) => void) & ((evt: "touchend", event: TouchEvent) => void) & ((evt: "touchmove", event: TouchEvent) => void) & ((evt: "touchcancel", event: TouchEvent) => void) & ((evt: "change", event: Event) => void) & ((evt: "beforeinput", event: Event) => void)) & ((evt: "update:modelValue", value: ModelValue[]) => void);
 }>) => import('vue').VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

package/dist/tag-field.js

@@ -1,11 +1,11 @@
-import { openBlock as r, createElementBlock as d, createElementVNode as f, defineComponent as xe, useModel as Be, useTemplateRef as W, ref as B, computed as T, watch as ae, toRaw as Fe, unref as u, onBeforeMount as Ae, onBeforeUnmount as Ke, normalizeClass as L, renderSlot as k, toDisplayString as y, createCommentVNode as h, normalizeProps as F, guardReactiveProps as A, mergeProps as ze, withModifiers as a, Fragment as re, renderList as se, createBlock as R, withCtx as K, createTextVNode as H, createVNode as S, withDirectives as Ie, withKeys as c, vModelText as Oe, Transition as Ve, mergeModels as De } from "vue";
-import { ActivityIndicator as Le } from "@vue-interface/activity-indicator";
-import { Badge as Re } from "@vue-interface/badge";
-import { useFormControl as Se, FormControlErrors as Ne, FormControlFeedback as je } from "@vue-interface/form-control";
+import { openBlock as r, createElementBlock as c, createElementVNode as g, defineComponent as Me, useModel as ze, useTemplateRef as H, ref as z, computed as B, watch as ue, toRaw as Fe, unref as d, onBeforeMount as Ae, onBeforeUnmount as Ke, normalizeClass as F, renderSlot as k, toDisplayString as h, createCommentVNode as x, normalizeProps as A, guardReactiveProps as K, mergeProps as Le, withModifiers as s, Fragment as se, renderList as re, createBlock as V, withCtx as L, createTextVNode as Q, createVNode as N, withDirectives as Se, withKeys as f, vModelText as Ie, Transition as Oe, mergeModels as ie } from "vue";
+import { ActivityIndicator as Re } from "@vue-interface/activity-indicator";
+import { Badge as Ve } from "@vue-interface/badge";
+import { useFormControl as Ne, FormControlErrors as De, FormControlFeedback as je } from "@vue-interface/form-control";
 import Pe from "fuse.js";
-import { isEqual as z } from "lodash-es";
-function Ue(I, N) {
-  return r(), d("svg", {
+import { isEqual as S } from "lodash-es";
+function Ue(o, D) {
+  return r(), c("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     fill: "none",
     viewBox: "0 0 24 24",
@@ -14,15 +14,15 @@ function Ue(I, N) {
     "aria-hidden": "true",
     "data-slot": "icon"
   }, [
-    f("path", {
+    g("path", {
       "stroke-linecap": "round",
       "stroke-linejoin": "round",
       d: "M12 4.5v15m7.5-7.5h-15"
     })
   ]);
 }
-function ue(I, N) {
-  return r(), d("svg", {
+function de(o, D) {
+  return r(), c("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     fill: "none",
     viewBox: "0 0 24 24",
@@ -31,349 +31,393 @@ function ue(I, N) {
     "aria-hidden": "true",
     "data-slot": "icon"
   }, [
-    f("path", {
+    g("path", {
       "stroke-linecap": "round",
       "stroke-linejoin": "round",
       d: "M6 18 18 6M6 6l12 12"
     })
   ]);
 }
-const qe = ["for"], Ge = { class: "form-control-inner" }, Je = { class: "flex flex-wrap gap-2 mr-2 flex-1" }, We = ["placeholder", "onKeydown"], He = { class: "form-control-activity-indicator" }, Qe = {
+const qe = ["for"], Ge = { class: "form-control-inner" }, Je = { class: "flex flex-wrap gap-2 mr-2 flex-1" }, We = ["placeholder", "disabled", "readonly", "onKeydown"], He = { class: "form-control-activity-indicator" }, Qe = ["onMouseup"], Xe = { class: "truncate" }, Ye = {
+  key: 1,
+  class: "py-2 px-4 text-neutral-400 dark:text-neutral-500"
+}, Ze = {
   invalid: "",
   class: "invalid-feedback"
-}, Xe = {
+}, _e = {
   valid: "",
   class: "valid-feedback"
-}, Ye = {
+}, et = {
   key: 0,
   class: "form-help"
-}, Ze = ["onMouseup"], _e = { class: "truncate" }, et = {
-  key: 1,
-  class: "py-2 px-4 text-neutral-400 dark:text-neutral-500"
-}, st = /* @__PURE__ */ xe({
+}, st = /* @__PURE__ */ Me({
   inheritAttrs: !1,
   __name: "TagField",
-  props: {
+  props: /* @__PURE__ */ ie({
+    activity: { type: Boolean },
+    disabled: { type: Boolean },
+    error: {},
+    errors: {},
+    feedback: {},
+    formControlClass: { default: "form-control" },
+    helpText: {},
+    id: {},
+    indicator: {},
+    indicatorSize: {},
+    invalid: { type: Boolean },
+    label: {},
+    labelClass: { default: "form-label" },
+    modelValue: {},
+    name: {},
+    plaintext: { type: Boolean },
+    size: { default: "form-control-md" },
+    color: {},
+    readonly: { type: Boolean },
+    valid: { type: Boolean },
+    value: {},
+    options: { default: () => [] },
+    fuseOptions: {},
+    display: {},
+    format: {},
+    allowCustom: { type: Boolean, default: !1 },
+    addTagLabel: { default: "Add Tag" },
+    noResultsText: { default: "No results found" },
+    showNoResults: { type: Boolean, default: !0 },
+    clearable: { type: Boolean, default: !1 },
+    badgeClass: { default: "badge-neutral-100 dark:badge-neutral-500" },
+    activeBadgeColor: { default: "badge-blue-100! dark:badge-blue-600!" },
+    badgeSize: { default: "badge-[.95em]" },
+    badgeCloseable: { type: Boolean, default: !0 },
+    badgeCloseLeft: { type: Boolean, default: !1 }
+  }, {
     modelValue: {},
     modelModifiers: {}
-  },
-  emits: /* @__PURE__ */ De(["blur", "focus", "focusin", "focusout", "click", "doubleclick", "contextmenu", "mousedown", "mouseup", "mouseover", "mouseout", "mouseenter", "mouseleave", "mousemove", "keydown", "keyup", "keypress", "select", "selectionchange", "invalid", "submit", "reset", "scroll", "wheel", "copy", "cut", "paste", "touchstart", "touchend", "touchmove", "touchcancel", "change", "input", "beforeinput"], ["update:modelValue"]),
-  setup(I, { emit: N }) {
-    const s = I, n = Be(I, "modelValue"), ie = N, {
-      controlAttributes: E,
-      formGroupClasses: de,
-      listeners: ve
-    } = Se({ model: n, props: s, emit: ie }), j = W("wrapperEl"), O = W("inputEl"), P = W("tagEl"), l = B(), v = B([]), b = B(!1), i = B(), V = B(s.options), U = T(() => !s.disabled && !s.readonly), q = T(() => s.clearable && (!!l.value || !!n.value?.length) && U.value), ce = T(() => typeof s.options == "object" && s.options?.[0] ? Object.keys(s.options?.[0]) : []), Q = pe(s.options), fe = T(() => b.value && (p.value.length || l.value)), D = T(() => v.value.map((e) => (n.value ?? []).findIndex((t) => z(t, e))));
-    ae(() => s.options, () => {
-      V.value = s.options;
-    }), ae(l, () => {
-      b.value = !0, i.value = void 0, m();
+  }),
+  emits: /* @__PURE__ */ ie(["blur", "focus", "focusin", "focusout", "click", "doubleclick", "contextmenu", "mousedown", "mouseup", "mouseover", "mouseout", "mouseenter", "mouseleave", "mousemove", "keydown", "keyup", "keypress", "select", "selectionchange", "invalid", "submit", "reset", "scroll", "wheel", "copy", "cut", "paste", "touchstart", "touchend", "touchmove", "touchcancel", "change", "input", "beforeinput"], ["update:modelValue"]),
+  setup(o, { emit: D }) {
+    const u = o, n = ze(o, "modelValue"), ce = D, {
+      controlAttributes: j,
+      formGroupClasses: ve,
+      listeners: P
+    } = Ne({ model: n, props: u, emit: ce }), U = H("wrapperEl"), I = H("inputEl"), q = H("tagEl"), a = z(), v = z([]), C = z(!1), i = z(), O = z(u.options), m = B(() => !u.disabled && !u.readonly), G = B(() => u.clearable && (!!a.value || !!n.value?.length) && m.value), fe = B(() => typeof u.options == "object" && u.options?.[0] ? Object.keys(u.options?.[0]) : []), X = ge(u.options), me = B(() => m.value && C.value && (b.value.length || a.value)), R = B(() => v.value.map((e) => (n.value ?? []).findIndex((t) => S(t, e))));
+    ue(() => u.options, () => {
+      O.value = u.options;
+    }), ue(a, () => {
+      C.value = !0, i.value = void 0, y();
     });
-    function pe(e) {
-      return new Pe(e, s.fuseOptions ?? {
+    function ge(e) {
+      return new Pe(e, u.fuseOptions ?? {
         includeScore: !0,
         threshold: 0.45,
-        keys: ce.value
+        keys: fe.value
       });
     }
-    const p = T(() => {
-      const e = V.value.filter((t) => !(n.value ?? []).find((o) => z(o, Fe(u(t)))));
-      return l.value ? (Q.setCollection(e), Q.search(l.value).map(({ item: t }) => t)) : e;
+    const b = B(() => {
+      const e = O.value.filter((t) => !(n.value ?? []).find((l) => S(l, Fe(d(t)))));
+      return a.value ? (X.setCollection(e), X.search(a.value).map(({ item: t }) => t)) : e;
     });
-    function G(e) {
-      const t = s.format?.(e) ?? e;
-      V.value.find((o) => z(o, t)) || (V.value.push(t), M(t), l.value = void 0);
+    function J(e) {
+      if (!m.value) return;
+      const t = u.format?.(e) ?? e;
+      O.value.find((l) => S(l, t)) || (O.value.push(t), E(t), a.value = void 0);
     }
-    function M(e) {
-      n.value = [...n.value ?? [], e], l.value = void 0, i.value = void 0;
+    function E(e) {
+      m.value && (n.value = [...n.value ?? [], e], a.value = void 0, i.value = void 0);
     }
-    function X(e) {
+    function Y(e) {
+      if (!m.value) return;
       const t = [...n.value ?? []];
-      t.splice(t.indexOf(e), 1), x(e), n.value = t;
+      t.splice(t.indexOf(e), 1), M(e), n.value = t;
     }
-    function C(e, t = !1) {
-      t || m(e), $(e) ? x(e) : Z(e);
+    function $(e, t = !1) {
+      m.value && (t || y(e), T(e) ? M(e) : _(e));
     }
-    function me(e) {
-      const t = n.value ?? [], o = t.indexOf(e), g = D.value[D.value.length - 1], w = $(e) ? x : Z;
-      if (g === void 0) {
-        C(e);
+    function be(e) {
+      if (!m.value) return;
+      const t = n.value ?? [], l = t.indexOf(e), p = R.value[R.value.length - 1], w = T(e) ? M : _;
+      if (p === void 0) {
+        $(e);
         return;
       }
-      let J = [];
-      o > g ? J = t.slice(g, o + 1) : o < g && (J = t.slice(o, g + 1));
-      for (const Me of J)
-        w(Me);
+      let W = [];
+      l > p ? W = t.slice(p, l + 1) : l < p && (W = t.slice(l, p + 1));
+      for (const Ee of W)
+        w(Ee);
     }
-    function ge() {
-      l.value || (v.value = [...n.value ?? []]);
+    function ye() {
+      a.value || (v.value = [...n.value ?? []]);
     }
-    function m(e) {
+    function y(e) {
       if (!e)
         v.value = [];
       else {
         const t = v.value.filter(
-          (o) => !z(o, e)
+          (l) => !S(l, e)
         );
-        for (const o of t)
-          x(o);
+        for (const l of t)
+          M(l);
       }
-      Y();
+      Z();
     }
-    function Y() {
-      if (P.value)
-        for (const e of P.value)
+    function Z() {
+      if (q.value)
+        for (const e of q.value)
           e?.$el?.blur();
     }
-    function $(e) {
-      return !!v.value.find((t) => z(t, e));
+    function T(e) {
+      return !!v.value.find((t) => S(t, e));
     }
-    function Z(e) {
-      $(e) || v.value.push(e);
+    function _(e) {
+      T(e) || v.value.push(e);
     }
-    function x(e) {
-      $(e) && v.value.splice(v.value.indexOf(e), 1), Y();
+    function M(e) {
+      T(e) && v.value.splice(v.value.indexOf(e), 1), Z();
     }
-    function _() {
-      n.value = (n.value ?? []).filter((e) => !$(e)), v.value = [];
+    function ee() {
+      n.value = (n.value ?? []).filter((e) => !T(e)), v.value = [];
     }
-    function ke() {
-      O.value?.focus(), !l.value && (v.value.length ? _() : n.value?.length && X(n.value[n.value.length - 1]));
+    function pe() {
+      I.value?.focus(), !a.value && (v.value.length ? ee() : n.value?.length && Y(n.value[n.value.length - 1]));
     }
-    function we(e) {
-      i.value !== void 0 ? M(p.value[i.value]) : p.value.length ? M(p.value[0]) : s.allowCustom && l.value && G(l.value), e.preventDefault();
+    function ke(e) {
+      i.value !== void 0 ? E(b.value[i.value]) : b.value.length ? E(b.value[0]) : u.allowCustom && a.value && J(a.value), e.preventDefault();
     }
-    function ye(e) {
-      i.value !== void 0 && (M(p.value[i.value]), e.preventDefault());
+    function we(e) {
+      i.value !== void 0 && (E(b.value[i.value]), e.preventDefault());
     }
     function he() {
-      i.value ? i.value-- : i.value = p.value.length - 1;
+      i.value ? i.value-- : i.value = b.value.length - 1;
     }
-    function be() {
-      i.value === void 0 || i.value === p.value.length - 1 ? i.value = 0 : i.value++;
+    function xe() {
+      i.value === void 0 || i.value === b.value.length - 1 ? i.value = 0 : i.value++;
     }
-    function ee(e = !1) {
-      if (!n.value?.length || l.value)
+    function te(e = !1) {
+      if (!n.value?.length || a.value)
         return;
-      const t = Math.min(...D.value, n.value.length) - 1;
-      n.value[t] ? C(n.value[t], e) : m();
+      const t = Math.min(...R.value, n.value.length) - 1;
+      n.value[t] ? $(n.value[t], e) : y();
     }
-    function te(e = !1) {
-      if (!n.value?.length || l.value)
+    function le(e = !1) {
+      if (!n.value?.length || a.value)
         return;
-      const t = Math.max(...D.value, -1) + 1;
-      n.value[t] ? C(n.value[t], e) : m();
+      const t = Math.max(...R.value, -1) + 1;
+      n.value[t] ? $(n.value[t], e) : y();
     }
     function Ce() {
-      b.value ? b.value = !1 : m();
+      C.value ? C.value = !1 : y();
     }
-    function $e() {
-      s.allowCustom && l.value && G(l.value), b.value = !1, m();
+    function $e(e) {
+      u.allowCustom && a.value && J(a.value), C.value = !1, y(), P.onBlur(e);
     }
-    function Te() {
-      b.value = !0, m();
+    function Te(e) {
+      C.value = !0, y(), P.onFocus(e);
     }
-    function Ee() {
-      l.value && G(l.value);
+    function Be() {
+      a.value && J(a.value);
     }
     function oe() {
-      U.value && (l.value = void 0, n.value = []);
+      m.value && (a.value = void 0, n.value = []);
     }
     function ne(e) {
-      e.target && (j.value == e.target || j.value?.contains(e.target) || m());
+      e.target && (U.value == e.target || U.value?.contains(e.target) || y());
     }
-    function le(e) {
+    function ae(e) {
       switch (e.key) {
         case "Backspace":
-          v.value.length && (_(), e.preventDefault());
+          v.value.length && (ee(), e.preventDefault());
           break;
         case "Escape":
-          b.value || m();
+          C.value || y();
       }
     }
     return Ae(() => {
-      document.addEventListener("click", ne), document.addEventListener("keydown", le);
+      document.addEventListener("click", ne), document.addEventListener("keydown", ae);
     }), Ke(() => {
-      document.removeEventListener("click", ne), document.removeEventListener("keydown", le);
-    }), (e, t) => (r(), d("div", {
+      document.removeEventListener("click", ne), document.removeEventListener("keydown", ae);
+    }), (e, t) => (r(), c("div", {
       ref_key: "wrapperEl",
-      ref: j,
-      class: L(["tag-field", [u(de), { "has-clear-button": q.value }]])
+      ref: U,
+      class: F(["tag-field", [d(ve), { "has-clear-button": G.value }]])
     }, [
       k(e.$slots, "label", {}, () => [
-        e.label ? (r(), d("label", {
+        o.label ? (r(), c("label", {
           key: 0,
-          class: L(e.labelClass),
-          for: u(E).id
-        }, y(e.label), 11, qe)) : h("", !0)
+          class: F(o.labelClass),
+          for: d(j).id
+        }, h(o.label), 11, qe)) : x("", !0)
       ]),
-      f("div", Ge, [
-        k(e.$slots, "control", F(A({ controlAttributes: u(E), listeners: u(ve) })), () => [
-          e.$slots.icon ? (r(), d("div", {
+      g("div", Ge, [
+        k(e.$slots, "control", A(K({ controlAttributes: d(j), listeners: d(P) })), () => [
+          e.$slots.icon ? (r(), c("div", {
             key: 0,
             class: "form-control-inner-icon",
-            onClick: t[0] || (t[0] = (o) => O.value?.focus())
+            onClick: t[0] || (t[0] = (l) => I.value?.focus())
           }, [
             k(e.$slots, "icon")
-          ])) : h("", !0),
-          f("div", ze(u(E), {
-            class: "form-control flex",
-            onClick: t[8] || (t[8] = a((o) => O.value?.focus(), ["self"]))
+          ])) : x("", !0),
+          g("div", Le(d(j), {
+            class: ["form-control flex", e.$attrs.class],
+            onClick: t[8] || (t[8] = s((l) => I.value?.focus(), ["self"]))
           }), [
-            f("div", Je, [
-              (r(!0), d(re, null, se(n.value, (o, g) => (r(), R(u(Re), {
+            g("div", Je, [
+              (r(!0), c(se, null, re(n.value, (l, p) => (r(), V(d(Ve), {
                 ref_for: !0,
                 ref_key: "tagEl",
-                ref: P,
-                key: `tag-${g}`,
+                ref: q,
+                key: `tag-${p}`,
                 tabindex: "-1",
-                size: "badge-[.95em]",
-                class: L(["badge-neutral-100 dark:badge-neutral-500", {
-                  "badge-blue-600!": $(o)
-                }]),
-                closeable: "",
-                onMousedown: t[2] || (t[2] = a(() => {
+                size: o.badgeSize,
+                class: F([
+                  o.badgeClass,
+                  { "pointer-events-none": !m.value },
+                  T(l) ? o.activeBadgeColor : void 0
+                ]),
+                closeable: o.badgeCloseable,
+                "close-left": o.badgeCloseLeft,
+                onMousedown: t[2] || (t[2] = s(() => {
                 }, ["prevent"])),
-                onClose: (w) => X(o),
-                onFocus: (w) => C(o),
-                onBlur: (w) => x(o),
+                onClose: (w) => Y(l),
+                onFocus: (w) => $(l),
+                onBlur: (w) => M(l),
                 onClick: [
-                  a((w) => C(o, !0), ["exact", "meta"]),
-                  a((w) => C(o), ["exact"]),
-                  a((w) => me(o), ["exact", "shift"])
+                  s((w) => $(l, !0), ["exact", "meta"]),
+                  s((w) => $(l), ["exact"]),
+                  s((w) => be(l), ["exact", "shift"])
                 ]
               }, {
-                "close-icon": K(() => [
-                  S(u(ue), {
+                "close-icon": L(() => [
+                  N(d(de), {
                     class: "size-[1.25em]",
-                    onMousedown: t[1] || (t[1] = a(() => {
+                    onMousedown: t[1] || (t[1] = s(() => {
                     }, ["prevent"]))
                   })
                 ]),
-                default: K(() => [
+                default: L(() => [
                   k(e.$slots, "default", {
-                    option: o,
-                    display: e.display
+                    option: l,
+                    display: o.display
                   }, () => [
-                    H(y(e.display?.(o) ?? o), 1)
+                    Q(h(o.display?.(l) ?? l), 1)
                   ])
                 ]),
                 _: 2
-              }, 1032, ["class", "onClose", "onFocus", "onBlur", "onClick"]))), 128)),
-              Ie(f("input", {
+              }, 1032, ["size", "class", "closeable", "close-left", "onClose", "onFocus", "onBlur", "onClick"]))), 128)),
+              Se(g("input", {
                 ref_key: "inputEl",
-                ref: O,
-                "onUpdate:modelValue": t[3] || (t[3] = (o) => l.value = o),
-                placeholder: e.placeholder,
+                ref: I,
+                "onUpdate:modelValue": t[3] || (t[3] = (l) => a.value = l),
+                placeholder: n.value?.length ? void 0 : e.$attrs.placeholder,
+                disabled: u.disabled,
+                readonly: u.readonly,
                 class: "bg-transparent outline-none flex-1 min-w-0",
                 onKeydown: [
-                  c(a(ke, ["exact"]), ["delete"]),
-                  c(a(ge, ["exact", "meta"]), ["a"]),
-                  c(a(we, ["exact"]), ["enter"]),
-                  c(a(ye, ["exact"]), ["space"]),
-                  c(a(he, ["exact"]), ["arrow-up"]),
-                  c(a(be, ["exact"]), ["arrow-down"]),
-                  t[4] || (t[4] = c(a((o) => ee(), ["exact"]), ["arrow-left"])),
-                  t[5] || (t[5] = c(a((o) => ee(!0), ["exact", "shift"]), ["arrow-left"])),
-                  t[6] || (t[6] = c(a((o) => te(), ["exact"]), ["arrow-right"])),
-                  t[7] || (t[7] = c(a((o) => te(!0), ["exact", "shift"]), ["arrow-right"])),
-                  c(Ce, ["esc"])
+                  f(s(pe, ["exact"]), ["delete"]),
+                  f(s(ye, ["exact", "meta"]), ["a"]),
+                  f(s(ke, ["exact"]), ["enter"]),
+                  f(s(we, ["exact"]), ["space"]),
+                  f(s(he, ["exact"]), ["arrow-up"]),
+                  f(s(xe, ["exact"]), ["arrow-down"]),
+                  t[4] || (t[4] = f(s((l) => te(), ["exact"]), ["arrow-left"])),
+                  t[5] || (t[5] = f(s((l) => te(!0), ["exact", "shift"]), ["arrow-left"])),
+                  t[6] || (t[6] = f(s((l) => le(), ["exact"]), ["arrow-right"])),
+                  t[7] || (t[7] = f(s((l) => le(!0), ["exact", "shift"]), ["arrow-right"])),
+                  f(Ce, ["esc"])
                 ],
                 onBlur: $e,
                 onFocus: Te
               }, null, 40, We), [
-                [Oe, l.value]
+                [Ie, a.value]
               ])
             ])
           ], 16)
         ]),
-        f("div", He, [
-          k(e.$slots, "activity", F(A({ canClear: q.value, clear: oe, isInteractive: U.value })), () => [
-            q.value ? (r(), d("button", {
+        g("div", He, [
+          k(e.$slots, "activity", A(K({ canClear: G.value, clear: oe, isInteractive: m.value })), () => [
+            G.value ? (r(), c("button", {
               key: 0,
               type: "button",
               class: "tag-field-clear-button",
-              onClick: a(oe, ["stop"])
+              onClick: s(oe, ["stop"])
             }, [
-              S(u(ue), { class: "size-[1.25em]" })
-            ])) : (r(), R(Ve, {
+              N(d(de), { class: "size-[1.25em]" })
+            ])) : (r(), V(Oe, {
               key: 1,
               name: "tag-field-fade"
             }, {
-              default: K(() => [
-                e.activity && e.indicator ? (r(), R(u(Le), {
+              default: L(() => [
+                u.activity && u.indicator ? (r(), V(d(Re), {
                   key: "activity",
-                  type: e.indicator,
-                  size: e.indicatorSize
-                }, null, 8, ["type", "size"])) : h("", !0)
+                  type: u.indicator,
+                  size: u.indicatorSize
+                }, null, 8, ["type", "size"])) : x("", !0)
               ]),
               _: 1
             }))
           ])
         ])
       ]),
-      k(e.$slots, "errors", F(A({ error: e.error, errors: e.errors, id: u(E).id, name: e.name })), () => [
-        e.error || e.errors ? (r(), R(u(Ne), {
-          key: 0,
-          id: u(E).id,
-          name: e.name,
-          error: e.error,
-          errors: e.errors
-        }, {
-          default: K(({ error: o }) => [
-            f("div", Qe, y(o), 1)
-          ]),
-          _: 1
-        }, 8, ["id", "name", "error", "errors"])) : h("", !0)
-      ]),
-      k(e.$slots, "feedback", F(A({ feedback: e.feedback })), () => [
-        S(u(je), { feedback: e.feedback }, {
-          default: K(({ feedback: o }) => [
-            f("div", Xe, y(o), 1)
-          ]),
-          _: 1
-        }, 8, ["feedback"])
-      ]),
-      k(e.$slots, "help", F(A({ helpText: e.helpText })), () => [
-        e.helpText ? (r(), d("small", Ye, y(e.helpText), 1)) : h("", !0)
-      ]),
-      fe.value ? (r(), d("div", {
+      me.value ? (r(), c("div", {
         key: 0,
         tabindex: "-1",
-        class: "tag-field-dropdown",
-        onMousedown: t[11] || (t[11] = a(() => {
+        class: F(["tag-field-dropdown", o.size]),
+        onMousedown: t[11] || (t[11] = s(() => {
         }, ["prevent", "stop"]))
       }, [
-        (r(!0), d(re, null, se(p.value, (o, g) => (r(), d("button", {
-          key: `option-${JSON.stringify(o)}`,
+        (r(!0), c(se, null, re(b.value, (l, p) => (r(), c("button", {
+          key: `option-${JSON.stringify(l)}`,
           type: "button",
           tabindex: "-1",
-          class: L({
-            "bg-neutral-100 dark:bg-neutral-800": i.value === g
+          class: F({
+            "bg-neutral-100 dark:bg-neutral-800": i.value === p
           }),
-          onMousedown: t[9] || (t[9] = a(() => {
+          onMousedown: t[9] || (t[9] = s(() => {
           }, ["prevent"])),
-          onMouseup: (w) => M(o)
+          onMouseup: (w) => E(l)
         }, [
-          f("div", _e, y(e.display?.(o) ?? o), 1)
-        ], 42, Ze))), 128)),
-        e.allowCustom && l.value ? (r(), d("button", {
+          g("div", Xe, h(o.display?.(l) ?? l), 1)
+        ], 42, Qe))), 128)),
+        o.allowCustom && a.value ? (r(), c("button", {
           key: 0,
           class: "flex items-center gap-1",
           type: "button",
-          onMousedown: t[10] || (t[10] = a(() => {
+          onMousedown: t[10] || (t[10] = s(() => {
           }, ["prevent"])),
-          onMouseup: Ee
+          onMouseup: Be
         }, [
-          S(u(Ue), { class: "size-4" }),
-          H(" " + y(e.addTagLabel), 1)
-        ], 32)) : h("", !0),
-        e.showNoResults && !p.value.length && !e.allowCustom ? (r(), d("div", et, [
-          k(e.$slots, "no-results", { input: l.value }, () => [
-            H(y(e.noResultsText), 1)
+          N(d(Ue), { class: "size-4" }),
+          Q(" " + h(o.addTagLabel), 1)
+        ], 32)) : x("", !0),
+        o.showNoResults && !b.value.length && !o.allowCustom ? (r(), c("div", Ye, [
+          k(e.$slots, "no-results", { input: a.value }, () => [
+            Q(h(o.noResultsText), 1)
           ])
-        ])) : h("", !0)
-      ], 32)) : h("", !0)
+        ])) : x("", !0)
+      ], 34)) : x("", !0),
+      k(e.$slots, "errors", A(K({ error: o.error, errors: o.errors, id: e.$attrs.id, name: e.$attrs.name })), () => [
+        o.error || o.errors ? (r(), V(d(De), {
+          key: 0,
+          id: o.id,
+          name: o.name,
+          error: o.error,
+          errors: o.errors
+        }, {
+          default: L(({ error: l }) => [
+            g("div", Ze, h(l), 1)
+          ]),
+          _: 1
+        }, 8, ["id", "name", "error", "errors"])) : x("", !0)
+      ]),
+      k(e.$slots, "feedback", A(K({ feedback: o.feedback })), () => [
+        N(d(je), { feedback: o.feedback }, {
+          default: L(({ feedback: l }) => [
+            g("div", _e, h(l), 1)
+          ]),
+          _: 1
+        }, 8, ["feedback"])
+      ]),
+      k(e.$slots, "help", A(K({ helpText: o.helpText })), () => [
+        o.helpText ? (r(), c("small", et, h(o.helpText), 1)) : x("", !0)
+      ])
     ], 2));
   }
 });

package/dist/tag-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"tag-field.js","sources":["../../../node_modules/.pnpm/@heroicons+vue@2.2.0_vue@3.5.27_typescript@5.9.3_/node_modules/@heroicons/vue/24/outline/esm/PlusIcon.js","../../../node_modules/.pnpm/@heroicons+vue@2.2.0_vue@3.5.27_typescript@5.9.3_/node_modules/@heroicons/vue/24/outline/esm/XMarkIcon.js","../src/TagField.vue"],"sourcesContent":["import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nexport default function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", {\n    xmlns: \"http://www.w3.org/2000/svg\",\n    fill: \"none\",\n    viewBox: \"0 0 24 24\",\n    \"stroke-width\": \"1.5\",\n    stroke: \"currentColor\",\n    \"aria-hidden\": \"true\",\n    \"data-slot\": \"icon\"\n  }, [\n    _createElementVNode(\"path\", {\n      \"stroke-linecap\": \"round\",\n      \"stroke-linejoin\": \"round\",\n      d: \"M12 4.5v15m7.5-7.5h-15\"\n    })\n  ]))\n}","import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nexport default function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", {\n    xmlns: \"http://www.w3.org/2000/svg\",\n    fill: \"none\",\n    viewBox: \"0 0 24 24\",\n    \"stroke-width\": \"1.5\",\n    stroke: \"currentColor\",\n    \"aria-hidden\": \"true\",\n    \"data-slot\": \"icon\"\n  }, [\n    _createElementVNode(\"path\", {\n      \"stroke-linecap\": \"round\",\n      \"stroke-linejoin\": \"round\",\n      d: \"M6 18 18 6M6 6l12 12\"\n    })\n  ]))\n}","<script setup lang=\"ts\" generic=\"T, Value\">\nimport { PlusIcon, XMarkIcon } from '@heroicons/vue/24/outline';\nimport { ActivityIndicator } from '@vue-interface/activity-indicator';\nimport { Badge } from '@vue-interface/badge';\nimport type { FormControlEvents, FormControlProps, FormControlSlots } from '@vue-interface/form-control';\nimport { FormControlErrors, FormControlFeedback, useFormControl } from '@vue-interface/form-control';\nimport type { IFuseOptions } from 'fuse.js';\nimport Fuse from 'fuse.js';\nimport { isEqual } from 'lodash-es';\nimport { type HTMLAttributes, computed, onBeforeMount, onBeforeUnmount, ref, toRaw, unref, useTemplateRef, watch, type Ref } from 'vue';\n\nexport type TagFieldSizePrefix = 'form-control';\n\nexport type TagFieldProps<T, Value> = /* @vue-ignore */ FormControlProps<\n    HTMLAttributes,\n    TagFieldSizePrefix,\n    T[],\n    Value[]\n> & {\n    options?: T[];\n    fuseOptions?: IFuseOptions<T>;\n    display?: (option: T) => string;\n    format?: (value: string) => T;\n    allowCustom?: boolean;\n    addTagLabel?: string;\n    noResultsText?: string;\n    showNoResults?: boolean;\n    clearable?: boolean;\n};\n\nconst props = withDefaults(defineProps<TagFieldProps<T, Value>>(), {\n    formControlClass: 'form-control',\n    labelClass: 'form-label',\n    size: 'form-control-md',\n    allowCustom: false,\n    addTagLabel: 'Add Tag',\n    noResultsText: 'No results found',\n    showNoResults: true,\n    clearable: false,\n    options: () => [],\n});\n\ndefineOptions({\n    inheritAttrs: false\n});\n\nconst model = defineModel<T[]>();\n\ndefineSlots<FormControlSlots<TagFieldSizePrefix, T[]> & {\n    default(props: { option: T; display?: (option: T) => string }): any;\n    'no-results'(props: { input: string | undefined }): any;\n}>();\n\nconst emit = defineEmits<FormControlEvents>();\n\nconst {\n    controlAttributes,\n    formGroupClasses,\n    listeners\n} = useFormControl<HTMLAttributes, TagFieldSizePrefix, T[]|undefined, Value[]>({ model, props, emit });\n\nconst wrapperEl = useTemplateRef('wrapperEl');\nconst inputEl = useTemplateRef('inputEl');\nconst tagEl = useTemplateRef('tagEl');\n\nconst input = ref<string>();\nconst selected = ref<T[]>([]) as Ref<T[]>;\nconst hasFocus = ref(false);\nconst focusIndex = ref<number>();\nconst options = ref(props.options) as Ref<T[]>;\n\nconst isInteractive = computed(() => !props.disabled && !props.readonly);\n\nconst canClear = computed(() => {\n    return props.clearable && (!!input.value || !!model.value?.length) && isInteractive.value;\n});\n\nconst keys = computed(() => {\n    return typeof props.options === 'object' && props.options?.[0]\n        ? Object.keys(props.options?.[0])\n        : [];\n});\n\nconst fuse: Fuse<T> = createFuse(props.options);\n\nconst showOptions = computed(() => {\n    return hasFocus.value && (filtered.value.length || input.value);\n});\n\nconst selectedIndexes = computed(() => {\n    return selected.value.map(tag => {\n        return (model.value ?? []).findIndex(item => isEqual(item, tag));\n    });\n});\n\nwatch(() => props.options, () => {\n    options.value = props.options;\n});\n\nwatch(input, () => {\n    hasFocus.value = true;\n    focusIndex.value = undefined;\n\n    deactivateTags();\n});\n\nfunction createFuse(items: T[]) {\n    return new Fuse(items, props.fuseOptions ?? {\n        includeScore: true,\n        threshold: .45,\n        keys: keys.value\n    });\n}\n\nconst filtered = computed<T[]>(() => {\n    const items = options.value.filter(option => {\n        return !(model.value ?? []).find(item => {\n            return isEqual(item, toRaw(unref(option)));\n        });\n    });\n\n    if(!input.value) {\n        return items;\n    }\n\n    fuse.setCollection(items as T[]);\n\n    return fuse.search(input.value).map(({ item }) => item);\n});\n\nfunction addCustomTag(value: string) {\n    const tag = props.format?.(value) ?? value as T;\n\n    if(!options.value.find(option => isEqual(option, tag))) {\n        options.value.push(tag);\n\n        addTag(tag);\n\n        input.value = undefined;\n    }\n}\n\nfunction addTag(tag: T) {\n    model.value = [...(model.value ?? []), tag];\n    input.value = undefined;\n    focusIndex.value = undefined;\n}\n\nfunction removeTag(tag: T) {\n    const value = [...(model.value ?? [])];\n\n    value.splice(value.indexOf(tag), 1);\n\n    deactivateTag(tag);\n\n    model.value = value;\n}\n\nfunction toggleActiveTag(tag: T, multiple = false) {\n    if(!multiple) {\n        deactivateTags(tag);\n    }\n\n    if(!isTagActive(tag)) {\n        activateTag(tag);\n    }\n    else {\n        deactivateTag(tag);\n    }\n}\n\nfunction toggleActiveTagRange(tag: T) {\n    const items = model.value ?? [];\n    const index = items.indexOf(tag);\n    const lastSelectedIndex = selectedIndexes.value[selectedIndexes.value.length - 1];\n    const fn = !isTagActive(tag) ? activateTag : deactivateTag;\n\n    if(lastSelectedIndex === undefined) {\n        toggleActiveTag(tag);\n\n        return;\n    }\n\n    let range: T[] = [];\n\n    if(index > lastSelectedIndex) {\n        range = items.slice(lastSelectedIndex, index + 1);\n    }\n    else if(index < lastSelectedIndex) {\n        range = items.slice(index, lastSelectedIndex + 1);\n    }\n\n    for(const tag of range) {\n        fn(tag);\n    }\n}\n\nfunction selectAllTags() {\n    if(input.value) {\n        return;\n    }\n\n    selected.value = [...(model.value ?? [])];\n}\n\nfunction deactivateTags(omit?: T) {\n    if(!omit) {\n        selected.value = [];\n    }\n    else {\n        const tags = selected.value.filter(\n            item => !isEqual(item, omit)\n        );\n\n        for(const tag of tags) {\n            deactivateTag(tag);\n        }\n    }\n\n    blurTags();\n}\n\nfunction blurTags() {\n    if(!tagEl.value) {\n        return;\n    }\n\n    for(const tag of tagEl.value) {\n        (tag?.$el as HTMLElement | undefined)?.blur();\n    }\n}\n\nfunction isTagActive(tag: T) {\n    return !!selected.value.find(item => isEqual(item, tag));\n}\n\nfunction activateTag(tag: T) {\n    if(!isTagActive(tag)) {\n        selected.value.push(tag);\n    }\n}\n\nfunction deactivateTag(tag: T) {\n    if(isTagActive(tag)) {\n        selected.value.splice(selected.value.indexOf(tag), 1);\n    }\n\n    blurTags();\n}\n\nfunction removeActiveTags() {\n    model.value = (model.value ?? []).filter(tag => {\n        return !isTagActive(tag);\n    });\n\n    selected.value = [];\n}\n\nfunction onBackspace() {\n    inputEl.value?.focus();\n\n    if(input.value) {\n        return;\n    }\n\n    if(selected.value.length) {\n        removeActiveTags();\n    }\n    else if(model.value?.length) {\n        removeTag(model.value[model.value.length - 1]);\n    }\n}\n\nfunction onKeydownEnter(e: KeyboardEvent) {\n    if(focusIndex.value !== undefined) {\n        addTag(filtered.value[focusIndex.value]);\n    }\n    else if(filtered.value.length) {\n        addTag(filtered.value[0]);\n    }\n    else if(props.allowCustom && input.value) {\n        addCustomTag(input.value);\n    }\n\n    e.preventDefault();\n}\n\nfunction onKeydownSpace(e: KeyboardEvent) {\n    if(focusIndex.value === undefined) {\n        return;\n    }\n\n    addTag(filtered.value[focusIndex.value]);\n\n    e.preventDefault();\n}\n\nfunction onKeydownUp() {\n    if(!focusIndex.value) {\n        focusIndex.value = filtered.value.length - 1;\n    }\n    else {\n        focusIndex.value--;\n    }\n}\n\nfunction onKeydownDown() {\n    if(focusIndex.value === undefined || focusIndex.value === filtered.value.length - 1) {\n        focusIndex.value = 0;\n    }\n    else {\n        focusIndex.value++;\n    }\n}\n\nfunction onKeydownLeft(multiple: boolean = false) {\n    if(!model.value?.length || input.value) {\n        return;\n    }\n\n    const nextIndex = Math.min(...selectedIndexes.value, model.value.length) - 1;\n\n    if(model.value[nextIndex]) {\n        toggleActiveTag(model.value[nextIndex], multiple);\n    }\n    else {\n        deactivateTags();\n    }\n}\n\nfunction onKeydownRight(multiple: boolean = false) {\n    if(!model.value?.length || input.value) {\n        return;\n    }\n\n    const nextIndex = Math.max(...selectedIndexes.value, -1) + 1;\n\n    if(model.value[nextIndex]) {\n        toggleActiveTag(model.value[nextIndex], multiple);\n    }\n    else {\n        deactivateTags();\n    }\n}\n\nfunction onEscape() {\n    if(hasFocus.value) {\n        hasFocus.value = false;\n    }\n    else {\n        deactivateTags();\n    }\n}\n\nfunction onBlur() {\n    if(props.allowCustom && input.value) {\n        addCustomTag(input.value);\n    }\n\n    hasFocus.value = false;\n\n    deactivateTags();\n}\n\nfunction onFocus() {\n    hasFocus.value = true;\n\n    deactivateTags();\n}\n\nfunction onClickAddTag() {\n    if(input.value) {\n        addCustomTag(input.value);\n    }\n}\n\nfunction clear() {\n    if (!isInteractive.value) return;\n    input.value = undefined;\n    model.value = [];\n}\n\nfunction onClickOutsideWrapper(e: MouseEvent) {\n    if(!e.target) {\n        return;\n    }\n\n    if(!(wrapperEl.value == e.target || wrapperEl.value?.contains(e.target as Element))) {\n        deactivateTags();\n    }\n}\n\nfunction onDocumentKeydown(e: KeyboardEvent) {\n    switch (e.key) {\n    case 'Backspace':\n        if(selected.value.length) {\n            removeActiveTags();\n            e.preventDefault();\n        }\n        break;\n    case 'Escape':\n        if(!hasFocus.value) {\n            deactivateTags();\n        }\n    }\n}\n\nonBeforeMount(() => {\n    document.addEventListener('click', onClickOutsideWrapper);\n    document.addEventListener('keydown', onDocumentKeydown);\n});\n\nonBeforeUnmount(() => {\n    document.removeEventListener('click', onClickOutsideWrapper);\n    document.removeEventListener('keydown', onDocumentKeydown);\n});\n</script>\n\n<template>\n    <div\n        ref=\"wrapperEl\"\n        class=\"tag-field\"\n        :class=\"[formGroupClasses, { 'has-clear-button': canClear }]\">\n        <slot name=\"label\">\n            <label\n                v-if=\"label\"\n                :class=\"labelClass\"\n                :for=\"controlAttributes.id\">\n                {{ label }}\n            </label>\n        </slot>\n\n        <div class=\"form-control-inner\">\n            <slot\n                name=\"control\"\n                v-bind=\"{ controlAttributes, listeners }\">\n                <div\n                    v-if=\"$slots.icon\"\n                    class=\"form-control-inner-icon\"\n                    @click=\"inputEl?.focus()\">\n                    <slot name=\"icon\" />\n                </div>\n                <div\n                    v-bind=\"controlAttributes\"\n                    class=\"form-control flex\"\n                    @click.self=\"inputEl?.focus()\">\n                    <div class=\"flex flex-wrap gap-2 mr-2 flex-1\">\n                        <Badge\n                            v-for=\"(tag, i) in model\"\n                            ref=\"tagEl\"\n                            :key=\"`tag-${i}`\"\n                            tabindex=\"-1\"\n                            size=\"badge-[.95em]\"\n                            class=\"badge-neutral-100 dark:badge-neutral-500\"\n                            :class=\"{\n                                'badge-blue-600!': isTagActive(tag),\n                            }\"\n                            closeable\n                            @mousedown.prevent\n                            @close=\"removeTag(tag)\"\n                            @focus=\"toggleActiveTag(tag)\"\n                            @blur=\"deactivateTag(tag)\"\n                            @click.exact.meta=\"toggleActiveTag(tag, true)\"\n                            @click.exact=\"toggleActiveTag(tag)\"\n                            @click.exact.shift=\"toggleActiveTagRange(tag)\">\n                            <slot :option=\"tag\" :display=\"display\">\n                                {{ display?.(tag) ?? tag }}\n                            </slot>\n                            <template #close-icon>\n                                <XMarkIcon class=\"size-[1.25em]\" @mousedown.prevent />\n                            </template>\n                        </Badge>\n\n                        <input\n                            ref=\"inputEl\"\n                            v-model=\"input\"\n                            :placeholder=\"placeholder\"\n                            class=\"bg-transparent outline-none flex-1 min-w-0\"\n                            @keydown.exact.delete=\"onBackspace\"\n                            @keydown.exact.meta.a=\"selectAllTags\"\n                            @keydown.exact.enter=\"onKeydownEnter\"\n                            @keydown.exact.space=\"onKeydownSpace\"\n                            @keydown.exact.arrow-up=\"onKeydownUp\"\n                            @keydown.exact.arrow-down=\"onKeydownDown\"\n                            @keydown.exact.arrow-left=\"onKeydownLeft()\"\n                            @keydown.exact.shift.arrow-left=\"onKeydownLeft(true)\"\n                            @keydown.exact.arrow-right=\"onKeydownRight()\"\n                            @keydown.exact.shift.arrow-right=\"onKeydownRight(true)\"\n                            @keydown.esc=\"onEscape\"\n                            @blur=\"onBlur\"\n                            @focus=\"onFocus\">\n                    </div>\n                </div>\n            </slot>\n\n            <div class=\"form-control-activity-indicator\">\n                <slot name=\"activity\" v-bind=\"{ canClear, clear, isInteractive }\">\n                    <button\n                        v-if=\"canClear\"\n                        type=\"button\"\n                        class=\"tag-field-clear-button\"\n                        @click.stop=\"clear\">\n                        <XMarkIcon class=\"size-[1.25em]\" />\n                    </button>\n                    <Transition name=\"tag-field-fade\" v-else>\n                        <ActivityIndicator\n                            v-if=\"activity && indicator\"\n                            key=\"activity\"\n                            :type=\"indicator\"\n                            :size=\"indicatorSize\" />\n                    </Transition>\n                </slot>\n            </div>\n        </div>\n\n        <slot\n            name=\"errors\"\n            v-bind=\"{ error, errors, id: controlAttributes.id, name }\">\n            <FormControlErrors\n                v-if=\"!!(error || errors)\"\n                :id=\"controlAttributes.id\"\n                v-slot=\"{ error: err }\"\n                :name=\"name\"\n                :error=\"error\"\n                :errors=\"errors\">\n                <div\n                    invalid\n                    class=\"invalid-feedback\">\n                    {{ err }}\n                </div>\n            </FormControlErrors>\n        </slot>\n\n        <slot\n            name=\"feedback\"\n            v-bind=\"{ feedback }\">\n            <FormControlFeedback\n                v-slot=\"{ feedback: fb }\"\n                :feedback=\"feedback\">\n                <div\n                    valid\n                    class=\"valid-feedback\">\n                    {{ fb }}\n                </div>\n            </FormControlFeedback>\n        </slot>\n\n        <slot\n            name=\"help\"\n            v-bind=\"{ helpText }\">\n            <small\n                v-if=\"helpText\"\n                class=\"form-help\">\n                {{ helpText }}\n            </small>\n        </slot>\n\n        <div\n            v-if=\"showOptions\"\n            tabindex=\"-1\"\n            class=\"tag-field-dropdown\"\n            @mousedown.prevent.stop>\n            <button\n                v-for=\"(option, i) in filtered\"\n                :key=\"`option-${JSON.stringify(option)}`\"\n                type=\"button\"\n                tabindex=\"-1\"\n                :class=\"{\n                    ['bg-neutral-100 dark:bg-neutral-800']: focusIndex === i\n                }\"\n                @mousedown.prevent\n                @mouseup=\"addTag(option)\">\n                <div class=\"truncate\">\n                    {{ display?.(option) ?? option }}\n                </div>\n            </button>\n            <button\n                v-if=\"allowCustom && input\"\n                class=\"flex items-center gap-1\"\n                type=\"button\"\n                @mousedown.prevent\n                @mouseup=\"onClickAddTag\">\n                <PlusIcon class=\"size-4\" /> {{ addTagLabel }}\n            </button>\n            <div\n                v-if=\"showNoResults && !filtered.length && !allowCustom\"\n                class=\"py-2 px-4 text-neutral-400 dark:text-neutral-500\">\n                <slot name=\"no-results\" :input=\"input\">\n                    {{ noResultsText }}\n                </slot>\n            </div>\n        </div>\n    </div>\n</template>\n"],"names":["render","_ctx","_cache","_openBlock","_createElementBlock","_createElementVNode","props","__props","model","_useModel","emit","__emit","controlAttributes","formGroupClasses","listeners","useFormControl","wrapperEl","useTemplateRef","inputEl","tagEl","input","ref","selected","hasFocus","focusIndex","options","isInteractive","computed","canClear","keys","fuse","createFuse","showOptions","filtered","selectedIndexes","tag","item","isEqual","watch","deactivateTags","items","Fuse","option","toRaw","unref","addCustomTag","value","addTag","removeTag","deactivateTag","toggleActiveTag","multiple","isTagActive","activateTag","toggleActiveTagRange","index","lastSelectedIndex","fn","range","selectAllTags","omit","tags","blurTags","removeActiveTags","onBackspace","onKeydownEnter","onKeydownSpace","onKeydownUp","onKeydownDown","onKeydownLeft","nextIndex","onKeydownRight","onEscape","onBlur","onFocus","onClickAddTag","clear","onClickOutsideWrapper","onDocumentKeydown","onBeforeMount","onBeforeUnmount","_normalizeClass","_unref","_renderSlot","label","labelClass","_hoisted_1","_hoisted_2","_normalizeProps","_guardReactiveProps","$slots","$event","_mergeProps","_withModifiers","_hoisted_3","_Fragment","_renderList","i","_createBlock","Badge","_createVNode","XMarkIcon","display","placeholder","_hoisted_5","_Transition","activity","indicator","ActivityIndicator","indicatorSize","error","errors","name","FormControlErrors","_withCtx","err","_hoisted_6","_toDisplayString","feedback","FormControlFeedback","fb","_hoisted_7","helpText","_hoisted_8","_hoisted_10","allowCustom","PlusIcon","_createTextVNode","addTagLabel","showNoResults","_hoisted_11","noResultsText"],"mappings":";;;;;;AAEe,SAASA,GAAOC,GAAMC,GAAQ;AAC3C,SAAQC,EAAU,GAAIC,EAAoB,OAAO;AAAA,IAC/C,OAAO;AAAA,IACP,MAAM;AAAA,IACN,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,QAAQ;AAAA,IACR,eAAe;AAAA,IACf,aAAa;AAAA,EACjB,GAAK;AAAA,IACDC,EAAoB,QAAQ;AAAA,MAC1B,kBAAkB;AAAA,MAClB,mBAAmB;AAAA,MACnB,GAAG;AAAA,IACT,CAAK;AAAA,EACL,CAAG;AACH;AChBe,SAASL,GAAOC,GAAMC,GAAQ;AAC3C,SAAQC,EAAU,GAAIC,EAAoB,OAAO;AAAA,IAC/C,OAAO;AAAA,IACP,MAAM;AAAA,IACN,SAAS;AAAA,IACT,gBAAgB;AAAA,IAChB,QAAQ;AAAA,IACR,eAAe;AAAA,IACf,aAAa;AAAA,EACjB,GAAK;AAAA,IACDC,EAAoB,QAAQ;AAAA,MAC1B,kBAAkB;AAAA,MAClB,mBAAmB;AAAA,MACnB,GAAG;AAAA,IACT,CAAK;AAAA,EACL,CAAG;AACH;;;;;;;;;;;;;;;;;;;;;;ACYA,UAAMC,IAAQC,GAgBRC,IAAQC,kBAAiB,GAOzBC,KAAOC,GAEP;AAAA,MACF,mBAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,WAAAC;AAAA,IAAA,IACAC,GAA2E,EAAE,OAAAP,GAAO,OAAAF,GAAO,MAAAI,IAAM,GAE/FM,IAAYC,EAAe,WAAW,GACtCC,IAAUD,EAAe,SAAS,GAClCE,IAAQF,EAAe,OAAO,GAE9BG,IAAQC,EAAA,GACRC,IAAWD,EAAS,EAAE,GACtBE,IAAWF,EAAI,EAAK,GACpBG,IAAaH,EAAA,GACbI,IAAUJ,EAAIf,EAAM,OAAO,GAE3BoB,IAAgBC,EAAS,MAAM,CAACrB,EAAM,YAAY,CAACA,EAAM,QAAQ,GAEjEsB,IAAWD,EAAS,MACfrB,EAAM,cAAc,CAAC,CAACc,EAAM,SAAS,CAAC,CAACZ,EAAM,OAAO,WAAWkB,EAAc,KACvF,GAEKG,KAAOF,EAAS,MACX,OAAOrB,EAAM,WAAY,YAAYA,EAAM,UAAU,CAAC,IACvD,OAAO,KAAKA,EAAM,UAAU,CAAC,CAAC,IAC9B,CAAA,CACT,GAEKwB,IAAgBC,GAAWzB,EAAM,OAAO,GAExC0B,KAAcL,EAAS,MAClBJ,EAAS,UAAUU,EAAS,MAAM,UAAUb,EAAM,MAC5D,GAEKc,IAAkBP,EAAS,MACtBL,EAAS,MAAM,IAAI,CAAAa,OACd3B,EAAM,SAAS,IAAI,UAAU,CAAA4B,MAAQC,EAAQD,GAAMD,CAAG,CAAC,CAClE,CACJ;AAED,IAAAG,GAAM,MAAMhC,EAAM,SAAS,MAAM;AAC7B,MAAAmB,EAAQ,QAAQnB,EAAM;AAAA,IAC1B,CAAC,GAEDgC,GAAMlB,GAAO,MAAM;AACf,MAAAG,EAAS,QAAQ,IACjBC,EAAW,QAAQ,QAEnBe,EAAA;AAAA,IACJ,CAAC;AAED,aAASR,GAAWS,GAAY;AAC5B,aAAO,IAAIC,GAAKD,GAAOlC,EAAM,eAAe;AAAA,QACxC,cAAc;AAAA,QACd,WAAW;AAAA,QACX,MAAMuB,GAAK;AAAA,MAAA,CACd;AAAA,IACL;AAEA,UAAMI,IAAWN,EAAc,MAAM;AACjC,YAAMa,IAAQf,EAAQ,MAAM,OAAO,CAAAiB,MACxB,EAAElC,EAAM,SAAS,CAAA,GAAI,KAAK,CAAA4B,MACtBC,EAAQD,GAAMO,GAAMC,EAAMF,CAAM,CAAC,CAAC,CAC5C,CACJ;AAED,aAAItB,EAAM,SAIVU,EAAK,cAAcU,CAAY,GAExBV,EAAK,OAAOV,EAAM,KAAK,EAAE,IAAI,CAAC,EAAE,MAAAgB,EAAA,MAAWA,CAAI,KAL3CI;AAAA,IAMf,CAAC;AAED,aAASK,EAAaC,GAAe;AACjC,YAAMX,IAAM7B,EAAM,SAASwC,CAAK,KAAKA;AAErC,MAAIrB,EAAQ,MAAM,KAAK,OAAUY,EAAQK,GAAQP,CAAG,CAAC,MACjDV,EAAQ,MAAM,KAAKU,CAAG,GAEtBY,EAAOZ,CAAG,GAEVf,EAAM,QAAQ;AAAA,IAEtB;AAEA,aAAS2B,EAAOZ,GAAQ;AACpB,MAAA3B,EAAM,QAAQ,CAAC,GAAIA,EAAM,SAAS,CAAA,GAAK2B,CAAG,GAC1Cf,EAAM,QAAQ,QACdI,EAAW,QAAQ;AAAA,IACvB;AAEA,aAASwB,EAAUb,GAAQ;AACvB,YAAMW,IAAQ,CAAC,GAAItC,EAAM,SAAS,CAAA,CAAG;AAErC,MAAAsC,EAAM,OAAOA,EAAM,QAAQX,CAAG,GAAG,CAAC,GAElCc,EAAcd,CAAG,GAEjB3B,EAAM,QAAQsC;AAAA,IAClB;AAEA,aAASI,EAAgBf,GAAQgB,IAAW,IAAO;AAC/C,MAAIA,KACAZ,EAAeJ,CAAG,GAGlBiB,EAAYjB,CAAG,IAIfc,EAAcd,CAAG,IAHjBkB,EAAYlB,CAAG;AAAA,IAKvB;AAEA,aAASmB,GAAqBnB,GAAQ;AAClC,YAAMK,IAAQhC,EAAM,SAAS,CAAA,GACvB+C,IAAQf,EAAM,QAAQL,CAAG,GACzBqB,IAAoBtB,EAAgB,MAAMA,EAAgB,MAAM,SAAS,CAAC,GAC1EuB,IAAML,EAAYjB,CAAG,IAAkBc,IAAdI;AAE/B,UAAGG,MAAsB,QAAW;AAChC,QAAAN,EAAgBf,CAAG;AAEnB;AAAA,MACJ;AAEA,UAAIuB,IAAa,CAAA;AAEjB,MAAGH,IAAQC,IACPE,IAAQlB,EAAM,MAAMgB,GAAmBD,IAAQ,CAAC,IAE5CA,IAAQC,MACZE,IAAQlB,EAAM,MAAMe,GAAOC,IAAoB,CAAC;AAGpD,iBAAUrB,MAAOuB;AACb,QAAAD,EAAGtB,EAAG;AAAA,IAEd;AAEA,aAASwB,KAAgB;AACrB,MAAGvC,EAAM,UAITE,EAAS,QAAQ,CAAC,GAAId,EAAM,SAAS,CAAA,CAAG;AAAA,IAC5C;AAEA,aAAS+B,EAAeqB,GAAU;AAC9B,UAAG,CAACA;AACA,QAAAtC,EAAS,QAAQ,CAAA;AAAA,WAEhB;AACD,cAAMuC,IAAOvC,EAAS,MAAM;AAAA,UACxB,CAAAc,MAAQ,CAACC,EAAQD,GAAMwB,CAAI;AAAA,QAAA;AAG/B,mBAAUzB,KAAO0B;AACb,UAAAZ,EAAcd,CAAG;AAAA,MAEzB;AAEA,MAAA2B,EAAA;AAAA,IACJ;AAEA,aAASA,IAAW;AAChB,UAAI3C,EAAM;AAIV,mBAAUgB,KAAOhB,EAAM;AAClB,UAAAgB,GAAK,KAAiC,KAAA;AAAA,IAE/C;AAEA,aAASiB,EAAYjB,GAAQ;AACzB,aAAO,CAAC,CAACb,EAAS,MAAM,KAAK,CAAAc,MAAQC,EAAQD,GAAMD,CAAG,CAAC;AAAA,IAC3D;AAEA,aAASkB,EAAYlB,GAAQ;AACzB,MAAIiB,EAAYjB,CAAG,KACfb,EAAS,MAAM,KAAKa,CAAG;AAAA,IAE/B;AAEA,aAASc,EAAcd,GAAQ;AAC3B,MAAGiB,EAAYjB,CAAG,KACdb,EAAS,MAAM,OAAOA,EAAS,MAAM,QAAQa,CAAG,GAAG,CAAC,GAGxD2B,EAAA;AAAA,IACJ;AAEA,aAASC,IAAmB;AACxB,MAAAvD,EAAM,SAASA,EAAM,SAAS,IAAI,OAAO,CAAA2B,MAC9B,CAACiB,EAAYjB,CAAG,CAC1B,GAEDb,EAAS,QAAQ,CAAA;AAAA,IACrB;AAEA,aAAS0C,KAAc;AAGnB,MAFA9C,EAAQ,OAAO,MAAA,GAEZ,CAAAE,EAAM,UAINE,EAAS,MAAM,SACdyC,EAAA,IAEIvD,EAAM,OAAO,UACjBwC,EAAUxC,EAAM,MAAMA,EAAM,MAAM,SAAS,CAAC,CAAC;AAAA,IAErD;AAEA,aAASyD,GAAe,GAAkB;AACtC,MAAGzC,EAAW,UAAU,SACpBuB,EAAOd,EAAS,MAAMT,EAAW,KAAK,CAAC,IAEnCS,EAAS,MAAM,SACnBc,EAAOd,EAAS,MAAM,CAAC,CAAC,IAEpB3B,EAAM,eAAec,EAAM,SAC/ByB,EAAazB,EAAM,KAAK,GAG5B,EAAE,eAAA;AAAA,IACN;AAEA,aAAS8C,GAAe,GAAkB;AACtC,MAAG1C,EAAW,UAAU,WAIxBuB,EAAOd,EAAS,MAAMT,EAAW,KAAK,CAAC,GAEvC,EAAE,eAAA;AAAA,IACN;AAEA,aAAS2C,KAAc;AACnB,MAAI3C,EAAW,QAIXA,EAAW,UAHXA,EAAW,QAAQS,EAAS,MAAM,SAAS;AAAA,IAKnD;AAEA,aAASmC,KAAgB;AACrB,MAAG5C,EAAW,UAAU,UAAaA,EAAW,UAAUS,EAAS,MAAM,SAAS,IAC9ET,EAAW,QAAQ,IAGnBA,EAAW;AAAA,IAEnB;AAEA,aAAS6C,GAAclB,IAAoB,IAAO;AAC9C,UAAG,CAAC3C,EAAM,OAAO,UAAUY,EAAM;AAC7B;AAGJ,YAAMkD,IAAY,KAAK,IAAI,GAAGpC,EAAgB,OAAO1B,EAAM,MAAM,MAAM,IAAI;AAE3E,MAAGA,EAAM,MAAM8D,CAAS,IACpBpB,EAAgB1C,EAAM,MAAM8D,CAAS,GAAGnB,CAAQ,IAGhDZ,EAAA;AAAA,IAER;AAEA,aAASgC,GAAepB,IAAoB,IAAO;AAC/C,UAAG,CAAC3C,EAAM,OAAO,UAAUY,EAAM;AAC7B;AAGJ,YAAMkD,IAAY,KAAK,IAAI,GAAGpC,EAAgB,OAAO,EAAE,IAAI;AAE3D,MAAG1B,EAAM,MAAM8D,CAAS,IACpBpB,EAAgB1C,EAAM,MAAM8D,CAAS,GAAGnB,CAAQ,IAGhDZ,EAAA;AAAA,IAER;AAEA,aAASiC,KAAW;AAChB,MAAGjD,EAAS,QACRA,EAAS,QAAQ,KAGjBgB,EAAA;AAAA,IAER;AAEA,aAASkC,KAAS;AACd,MAAGnE,EAAM,eAAec,EAAM,SAC1ByB,EAAazB,EAAM,KAAK,GAG5BG,EAAS,QAAQ,IAEjBgB,EAAA;AAAA,IACJ;AAEA,aAASmC,KAAU;AACf,MAAAnD,EAAS,QAAQ,IAEjBgB,EAAA;AAAA,IACJ;AAEA,aAASoC,KAAgB;AACrB,MAAGvD,EAAM,SACLyB,EAAazB,EAAM,KAAK;AAAA,IAEhC;AAEA,aAASwD,KAAQ;AACb,MAAKlD,EAAc,UACnBN,EAAM,QAAQ,QACdZ,EAAM,QAAQ,CAAA;AAAA,IAClB;AAEA,aAASqE,GAAsB,GAAe;AAC1C,MAAI,EAAE,WAID7D,EAAU,SAAS,EAAE,UAAUA,EAAU,OAAO,SAAS,EAAE,MAAiB,KAC7EuB,EAAA;AAAA,IAER;AAEA,aAASuC,GAAkB,GAAkB;AACzC,cAAQ,EAAE,KAAA;AAAA,QACV,KAAK;AACD,UAAGxD,EAAS,MAAM,WACdyC,EAAA,GACA,EAAE,eAAA;AAEN;AAAA,QACJ,KAAK;AACD,UAAIxC,EAAS,SACTgB,EAAA;AAAA,MACJ;AAAA,IAER;AAEA,WAAAwC,GAAc,MAAM;AAChB,eAAS,iBAAiB,SAASF,EAAqB,GACxD,SAAS,iBAAiB,WAAWC,EAAiB;AAAA,IAC1D,CAAC,GAEDE,GAAgB,MAAM;AAClB,eAAS,oBAAoB,SAASH,EAAqB,GAC3D,SAAS,oBAAoB,WAAWC,EAAiB;AAAA,IAC7D,CAAC,mBAIG1E,EA6KM,OAAA;AAAA,eA5KE;AAAA,MAAJ,KAAIY;AAAA,MACJ,OAAKiE,EAAA,CAAC,aAAW,CACRC,EAAArE,EAAA,yBAAwCe,EAAA,MAAA,CAAQ,CAAA,CAAA;AAAA,IAAA;MACzDuD,EAOOlF,uBAPP,MAOO;AAAA,QALOmF,EAAAA,cADVhF,EAKQ,SAAA;AAAA;UAHH,SAAOiF,EAAAA,UAAU;AAAA,UACjB,KAAKH,EAAAtE,CAAA,EAAkB;AAAA,QAAA,KACrBwE,EAAAA,KAAK,GAAA,IAAAE,EAAA;;MAIhBjF,EAiFM,OAjFNkF,IAiFM;AAAA,QAhFFJ,EA4DOlF,EAAA,QAAA,WAAAuF,EAAAC,EAAA,EAAA,mBA1DOP,EAAAtE,CAAA,GAAiB,WAAEsE,EAAApE,EAAA,OAFjC,MA4DO;AAAA,UAxDO4E,EAAAA,OAAO,aADjBtF,EAKM,OAAA;AAAA;YAHF,OAAM;AAAA,YACL,SAAKF,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAyF,MAAEzE,EAAA,OAAS,MAAA;AAAA,UAAK;YACtBiE,EAAoBlF,EAAA,QAAA,MAAA;AAAA,UAAA;UAExBI,EAkDM,OAlDNuF,GAkDMV,EAAAtE,CAAA,GAjDuB;AAAA,YACzB,OAAM;AAAA,YACL,SAAKV,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA2F,EAAA,CAAAF,MAAOzE,EAAA,OAAS,MAAA,GAAK,CAAA,MAAA,CAAA;AAAA,UAAA;YAC3Bb,EA6CM,OA7CNyF,IA6CM;AAAA,eA5CF3F,EAAA,EAAA,GAAAC,EAwBQ2F,IAAA,MAAAC,GAvBexF,EAAA,OAAK,CAAhB2B,GAAK8D,YADjBC,EAwBQhB,EAAAiB,EAAA,GAAA;AAAA;yBAtBA;AAAA,gBAAJ,KAAIhF;AAAA,gBACH,YAAY8E,CAAC;AAAA,gBACd,UAAS;AAAA,gBACT,MAAK;AAAA,gBACL,UAAM,4CAA0C;AAAA,kBACa,mBAAA7C,EAAYjB,CAAG;AAAA,gBAAA;gBAG5E,WAAA;AAAA,gBACC,+BAAD,MAAA;AAAA,gBAAA,GAAkB,CAAA,SAAA,CAAA;AAAA,gBACjB,SAAK,CAAAwD,MAAE3C,EAAUb,CAAG;AAAA,gBACpB,SAAK,CAAAwD,MAAEzC,EAAgBf,CAAG;AAAA,gBAC1B,QAAI,CAAAwD,MAAE1C,EAAcd,CAAG;AAAA,gBACvB,SAAK;AAAA,kBAAa0D,EAAA,CAAAF,MAAAzC,EAAgBf,GAAG,EAAA,GAAA,CAAA,SAAA,MAAA,CAAA;AAAA,kBACxB0D,EAAA,CAAAF,MAAAzC,EAAgBf,CAAG,GAAA,CAAA,OAAA,CAAA;AAAA,kBACb0D,EAAA,CAAAF,MAAArC,GAAqBnB,CAAG,GAAA,CAAA,SAAA,OAAA,CAAA;AAAA,gBAAA;AAAA;gBAIjC,gBACP,MAAsD;AAAA,kBAAtDiE,EAAsDlB,EAAAmB,EAAA,GAAA;AAAA,oBAA3C,OAAM;AAAA,oBAAiB,+BAAD,MAAA;AAAA,oBAAA,GAAkB,CAAA,SAAA,CAAA;AAAA,kBAAA;;2BAJvD,MAEO;AAAA,kBAFPlB,EAEOlF,EAAA,QAAA,WAAA;AAAA,oBAFA,QAAQkC;AAAA,oBAAM,SAASmE,EAAAA;AAAAA,kBAAAA,GAA9B,MAEO;AAAA,wBADAA,EAAAA,UAAUnE,CAAG,KAAKA,CAAG,GAAA,CAAA;AAAA,kBAAA;;;;iBAOhC9B,EAiBqB,SAAA;AAAA,yBAhBb;AAAA,gBAAJ,KAAIa;AAAA,8DACKE,EAAK,QAAAuE;AAAA,gBACb,aAAaY,EAAAA;AAAAA,gBACd,OAAM;AAAA,gBACL,WAAO;AAAA,sBAAevC,IAAW,CAAA,OAAA,CAAA,GAAA,CAAA,QAAA,CAAA;AAAA,sBACXL,IAAa,CAAA,SAAA,MAAA,CAAA,GAAA,CAAA,GAAA,CAAA;AAAA,sBACdM,IAAc,CAAA,OAAA,CAAA,GAAA,CAAA,OAAA,CAAA;AAAA,sBACdC,IAAc,CAAA,OAAA,CAAA,GAAA,CAAA,OAAA,CAAA;AAAA,sBACXC,IAAW,CAAA,OAAA,CAAA,GAAA,CAAA,UAAA,CAAA;AAAA,sBACTC,IAAa,CAAA,OAAA,CAAA,GAAA,CAAA,YAAA,CAAA;AAAA,6CACbC,GAAA,GAAa,CAAA,OAAA,CAAA,GAAA,CAAA,YAAA,CAAA;AAAA,6CACPA,GAAa,EAAA,GAAA,CAAA,SAAA,OAAA,CAAA,GAAA,CAAA,YAAA,CAAA;AAAA,6CAClBE,GAAA,GAAc,CAAA,OAAA,CAAA,GAAA,CAAA,aAAA,CAAA;AAAA,6CACRA,GAAc,EAAA,GAAA,CAAA,SAAA,OAAA,CAAA,GAAA,CAAA,aAAA,CAAA;AAAA,oBAClCC,IAAQ,CAAA,KAAA,CAAA;AAAA,gBAAA;AAAA,gBACrB,QAAAC;AAAA,gBACA,SAAAC;AAAA,cAAA;qBAfQtD,EAAA,KAAK;AAAA,cAAA;;;;QAoB9Bf,EAiBM,OAjBNmG,IAiBM;AAAA,UAhBFrB,EAeOlF,sCAfyB2B,EAAA,OAAQ,OAAAgD,IAAO,eAAElD,EAAA,WAAjD,MAeO;AAAA,YAbOE,EAAA,cADVxB,EAMS,UAAA;AAAA;cAJL,MAAK;AAAA,cACL,OAAM;AAAA,cACL,WAAYwE,IAAK,CAAA,MAAA,CAAA;AAAA,YAAA;cAClBwB,EAAmClB,EAAAmB,EAAA,GAAA,EAAxB,OAAM,iBAAe;AAAA,YAAA,YAEpCH,EAMaO,IAAA;AAAA;cAND,MAAK;AAAA,YAAA;yBACb,MAI4B;AAAA,gBAHlBC,EAAAA,YAAYC,EAAAA,kBADtBT,EAI4BhB,EAAA0B,EAAA,GAAA;AAAA,kBAFxB,KAAI;AAAA,kBACH,MAAMD,EAAAA;AAAAA,kBACN,MAAME,EAAAA;AAAAA,gBAAAA;;;;;;;MAM3B1B,EAgBOlF,EAAA,QAAA,UAAAuF,EAAAC,EAAA,EAAA,OAdOqB,EAAAA,OAAK,QAAEC,EAAAA,QAAM,IAAM7B,EAAAtE,CAAA,EAAkB,IAAE,MAAEoG,EAAAA,MAAI,CAAA,GAF3D,MAgBO;AAAA,QAZUF,EAAAA,SAASC,EAAAA,eADtBb,EAYoBhB,EAAA+B,EAAA,GAAA;AAAA;UAVf,IAAI/B,EAAAtE,CAAA,EAAkB;AAAA,UAEtB,MAAMoG,EAAAA;AAAAA,UACN,OAAOF,EAAAA;AAAAA,UACP,QAAQC,EAAAA;AAAAA,QAAAA;UACT,SAAAG,EAAA,CAIM,SARWC,QAAG;AAAA,YAIpB9G,EAIM,OAJN+G,IAIMC,EADCF,CAAG,GAAA,CAAA;AAAA,UAAA;;;;MAKlBhC,EAYOlF,EAAA,QAAA,YAAAuF,EAAAC,EAAA,EAAA,UAVO6B,EAAAA,SAAAA,CAAQ,CAAA,GAFtB,MAYO;AAAA,QATHlB,EAQsBlB,EAAAqC,EAAA,GAAA,EANjB,UAAUD,EAAAA,YAAQ;AAAA,UACnB,SAAAJ,EAAA,CAIM,YANcM,QAAE;AAAA,YAEtBnH,EAIM,OAJNoH,IAIMJ,EADCG,CAAE,GAAA,CAAA;AAAA,UAAA;;;;MAKjBrC,EAQOlF,EAAA,QAAA,QAAAuF,EAAAC,EAAA,EAAA,UANOiC,EAAAA,SAAAA,CAAQ,CAAA,GAFtB,MAQO;AAAA,QAJOA,EAAAA,iBADVtH,EAIQ,SAJRuH,IAIQN,EADDK,EAAAA,QAAQ,GAAA,CAAA;;MAKT1F,GAAA,cADV5B,EAkCM,OAAA;AAAA;QAhCF,UAAS;AAAA,QACT,OAAM;AAAA,QACL,iCAAD,MAAA;AAAA,QAAA,GAAuB,CAAA,WAAA,MAAA,CAAA;AAAA,MAAA;SACvBD,EAAA,EAAA,GAAAC,EAaS2F,IAAA,MAAAC,GAZiB/D,EAAA,OAAQ,CAAtBS,GAAQuD,YADpB7F,EAaS,UAAA;AAAA,UAXJ,KAAG,UAAY,KAAK,UAAUsC,CAAM,CAAA;AAAA,UACrC,MAAK;AAAA,UACL,UAAS;AAAA,UACR,OAAKuC,EAAA;AAAA,YAAgE,sCAAAzD,EAAA,UAAeyE;AAAA,UAAA;UAGpF,+BAAD,MAAA;AAAA,UAAA,GAAkB,CAAA,SAAA,CAAA;AAAA,UACjB,WAAO,CAAAN,MAAE5C,EAAOL,CAAM;AAAA,QAAA;UACvBrC,EAEM,OAFNuH,IAEMP,EADCf,YAAU5D,CAAM,KAAKA,CAAM,GAAA,CAAA;AAAA,QAAA;QAI5BmF,EAAAA,eAAezG,EAAA,cADzBhB,EAOS,UAAA;AAAA;UALL,OAAM;AAAA,UACN,MAAK;AAAA,UACJ,iCAAD,MAAA;AAAA,UAAA,GAAkB,CAAA,SAAA,CAAA;AAAA,UACjB,WAASuE;AAAA,QAAA;UACVyB,EAA2BlB,EAAA4C,EAAA,GAAA,EAAjB,OAAM,UAAQ;AAAA,UAAGC,EAAA,QAAIC,EAAAA,WAAW,GAAA,CAAA;AAAA,QAAA;QAGpCC,EAAAA,iBAAa,CAAKhG,EAAA,MAAS,WAAW4F,EAAAA,eADhD1H,EAAA,GAAAC,EAMM,OANN8H,IAMM;AAAA,UAHF/C,EAEOlF,EAAA,QAAA,cAAA,EAFkB,OAAOmB,EAAA,MAAA,GAAhC,MAEO;AAAA,gBADA+G,EAAAA,aAAa,GAAA,CAAA;AAAA,UAAA;;;;;;","x_google_ignoreList":[0,1]}
+{"version":3,"file":"tag-field.js","sources":["../../../node_modules/.pnpm/@heroicons+vue@2.2.0_vue@3.5.27_typescript@5.9.3_/node_modules/@heroicons/vue/24/outline/esm/PlusIcon.js","../../../node_modules/.pnpm/@heroicons+vue@2.2.0_vue@3.5.27_typescript@5.9.3_/node_modules/@heroicons/vue/24/outline/esm/XMarkIcon.js","../src/TagField.vue"],"sourcesContent":["import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nexport default function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", {\n    xmlns: \"http://www.w3.org/2000/svg\",\n    fill: \"none\",\n    viewBox: \"0 0 24 24\",\n    \"stroke-width\": \"1.5\",\n    stroke: \"currentColor\",\n    \"aria-hidden\": \"true\",\n    \"data-slot\": \"icon\"\n  }, [\n    _createElementVNode(\"path\", {\n      \"stroke-linecap\": \"round\",\n      \"stroke-linejoin\": \"round\",\n      d: \"M12 4.5v15m7.5-7.5h-15\"\n    })\n  ]))\n}","import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nexport default function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", {\n    xmlns: \"http://www.w3.org/2000/svg\",\n    fill: \"none\",\n    viewBox: \"0 0 24 24\",\n    \"stroke-width\": \"1.5\",\n    stroke: \"currentColor\",\n    \"aria-hidden\": \"true\",\n    \"data-slot\": \"icon\"\n  }, [\n    _createElementVNode(\"path\", {\n      \"stroke-linecap\": \"round\",\n      \"stroke-linejoin\": \"round\",\n      d: \"M6 18 18 6M6 6l12 12\"\n    })\n  ]))\n}","<script setup lang=\"ts\" generic=\"ModelValue, Value\">\nimport { PlusIcon, XMarkIcon } from '@heroicons/vue/24/outline';\nimport { ActivityIndicator } from '@vue-interface/activity-indicator';\nimport { Badge, type BadgeSize } from '@vue-interface/badge';\nimport type { FormControlEvents, FormControlProps, FormControlSlots } from '@vue-interface/form-control';\nimport { FormControlErrors, FormControlFeedback, useFormControl } from '@vue-interface/form-control';\nimport type { IFuseOptions } from 'fuse.js';\nimport Fuse from 'fuse.js';\nimport { isEqual } from 'lodash-es';\nimport { type HTMLAttributes, computed, onBeforeMount, onBeforeUnmount, ref, toRaw, unref, useTemplateRef, watch, type Ref } from 'vue';\n\nexport type TagFieldSizePrefix = 'form-control';\n\nexport type TagFieldProps<ModelValue, Value> = FormControlProps<\n    HTMLAttributes,\n    TagFieldSizePrefix,\n    ModelValue[],\n    Value[]\n> & {\n    options?: ModelValue[];\n    fuseOptions?: IFuseOptions<ModelValue>;\n    display?: (option: ModelValue) => string;\n    format?: (value: string) => ModelValue;\n    allowCustom?: boolean;\n    addTagLabel?: string;\n    noResultsText?: string;\n    showNoResults?: boolean;\n    clearable?: boolean;\n    badgeClass?: string | string[] | Record<string, boolean>;\n    activeBadgeColor?: string | string[] | Record<string, boolean>;\n    badgeSize?: BadgeSize;\n    badgeCloseable?: boolean;\n    badgeCloseLeft?: boolean;\n};\n\nconst props = withDefaults(defineProps<TagFieldProps<ModelValue, Value>>(), {\n    formControlClass: 'form-control',\n    labelClass: 'form-label',\n    size: 'form-control-md',\n    allowCustom: false,\n    addTagLabel: 'Add Tag',\n    noResultsText: 'No results found',\n    showNoResults: true,\n    clearable: false,\n    options: () => [],\n    badgeClass: 'badge-neutral-100 dark:badge-neutral-500',\n    activeBadgeColor: 'badge-blue-100! dark:badge-blue-600!',\n    badgeSize: 'badge-[.95em]',\n    badgeCloseable: true,\n    badgeCloseLeft: false,\n});\n\ndefineOptions({\n    inheritAttrs: false\n});\n\nconst model = defineModel<ModelValue[]>();\n\ndefineSlots<FormControlSlots<TagFieldSizePrefix, ModelValue[]> & {\n    default(props: { option: ModelValue; display?: (option: ModelValue) => string }): any;\n    'no-results'(props: { input: string | undefined }): any;\n}>();\n\nconst emit = defineEmits<FormControlEvents>();\n\nconst {\n    controlAttributes,\n    formGroupClasses,\n    listeners\n} = useFormControl<HTMLAttributes, TagFieldSizePrefix, ModelValue[]|undefined, Value[]>({ model, props, emit });\n\nconst wrapperEl = useTemplateRef('wrapperEl');\nconst inputEl = useTemplateRef('inputEl');\nconst tagEl = useTemplateRef('tagEl');\n\nconst input = ref<string>();\nconst selected = ref<ModelValue[]>([]) as Ref<ModelValue[]>;\nconst hasFocus = ref(false);\nconst focusIndex = ref<number>();\nconst options = ref(props.options) as Ref<ModelValue[]>;\n\nconst isInteractive = computed(() => !props.disabled && !props.readonly);\n\nconst canClear = computed(() => {\n    return props.clearable && (!!input.value || !!model.value?.length) && isInteractive.value;\n});\n\nconst keys = computed(() => {\n    return typeof props.options === 'object' && props.options?.[0]\n        ? Object.keys(props.options?.[0])\n        : [];\n});\n\nconst fuse: Fuse<ModelValue> = createFuse(props.options);\n\nconst showOptions = computed(() => {\n    return isInteractive.value && hasFocus.value && (filtered.value.length || input.value);\n});\n\nconst selectedIndexes = computed(() => {\n    return selected.value.map(tag => {\n        return (model.value ?? []).findIndex(item => isEqual(item, tag));\n    });\n});\n\nwatch(() => props.options, () => {\n    options.value = props.options;\n});\n\nwatch(input, () => {\n    hasFocus.value = true;\n    focusIndex.value = undefined;\n\n    deactivateTags();\n});\n\nfunction createFuse(items: ModelValue[]) {\n    return new Fuse(items, props.fuseOptions ?? {\n        includeScore: true,\n        threshold: .45,\n        keys: keys.value\n    });\n}\n\nconst filtered = computed<ModelValue[]>(() => {\n    const items = options.value.filter(option => {\n        return !(model.value ?? []).find(item => {\n            return isEqual(item, toRaw(unref(option)));\n        });\n    });\n\n    if(!input.value) {\n        return items;\n    }\n\n    fuse.setCollection(items as ModelValue[]);\n\n    return fuse.search(input.value).map(({ item }) => item);\n});\n\nfunction addCustomTag(value: string) {\n    if(!isInteractive.value) return;\n\n    const tag = props.format?.(value) ?? value as ModelValue;\n\n    if(!options.value.find(option => isEqual(option, tag))) {\n        options.value.push(tag);\n\n        addTag(tag);\n\n        input.value = undefined;\n    }\n}\n\nfunction addTag(tag: ModelValue) {\n    if(!isInteractive.value) return;\n\n    model.value = [...(model.value ?? []), tag];\n    input.value = undefined;\n    focusIndex.value = undefined;\n}\n\nfunction removeTag(tag: ModelValue) {\n    if(!isInteractive.value) return;\n\n    const value = [...(model.value ?? [])];\n\n    value.splice(value.indexOf(tag), 1);\n\n    deactivateTag(tag);\n\n    model.value = value;\n}\n\nfunction toggleActiveTag(tag: ModelValue, multiple = false) {\n    if(!isInteractive.value) return;\n\n    if(!multiple) {\n        deactivateTags(tag);\n    }\n\n    if(!isTagActive(tag)) {\n        activateTag(tag);\n    }\n    else {\n        deactivateTag(tag);\n    }\n}\n\nfunction toggleActiveTagRange(tag: ModelValue) {\n    if(!isInteractive.value) return;\n\n    const items = model.value ?? [];\n    const index = items.indexOf(tag);\n    const lastSelectedIndex = selectedIndexes.value[selectedIndexes.value.length - 1];\n    const fn = !isTagActive(tag) ? activateTag : deactivateTag;\n\n    if(lastSelectedIndex === undefined) {\n        toggleActiveTag(tag);\n\n        return;\n    }\n\n    let range: ModelValue[] = [];\n\n    if(index > lastSelectedIndex) {\n        range = items.slice(lastSelectedIndex, index + 1);\n    }\n    else if(index < lastSelectedIndex) {\n        range = items.slice(index, lastSelectedIndex + 1);\n    }\n\n    for(const tag of range) {\n        fn(tag);\n    }\n}\n\nfunction selectAllTags() {\n    if(input.value) {\n        return;\n    }\n\n    selected.value = [...(model.value ?? [])];\n}\n\nfunction deactivateTags(omit?: ModelValue) {\n    if(!omit) {\n        selected.value = [];\n    }\n    else {\n        const tags = selected.value.filter(\n            item => !isEqual(item, omit)\n        );\n\n        for(const tag of tags) {\n            deactivateTag(tag);\n        }\n    }\n\n    blurTags();\n}\n\nfunction blurTags() {\n    if(!tagEl.value) {\n        return;\n    }\n\n    for(const tag of tagEl.value) {\n        (tag?.$el as HTMLElement | undefined)?.blur();\n    }\n}\n\nfunction isTagActive(tag: ModelValue) {\n    return !!selected.value.find(item => isEqual(item, tag));\n}\n\nfunction activateTag(tag: ModelValue) {\n    if(!isTagActive(tag)) {\n        selected.value.push(tag);\n    }\n}\n\nfunction deactivateTag(tag: ModelValue) {\n    if(isTagActive(tag)) {\n        selected.value.splice(selected.value.indexOf(tag), 1);\n    }\n\n    blurTags();\n}\n\nfunction removeActiveTags() {\n    model.value = (model.value ?? []).filter(tag => {\n        return !isTagActive(tag);\n    });\n\n    selected.value = [];\n}\n\nfunction onBackspace() {\n    inputEl.value?.focus();\n\n    if(input.value) {\n        return;\n    }\n\n    if(selected.value.length) {\n        removeActiveTags();\n    }\n    else if(model.value?.length) {\n        removeTag(model.value[model.value.length - 1]);\n    }\n}\n\nfunction onKeydownEnter(e: KeyboardEvent) {\n    if(focusIndex.value !== undefined) {\n        addTag(filtered.value[focusIndex.value]);\n    }\n    else if(filtered.value.length) {\n        addTag(filtered.value[0]);\n    }\n    else if(props.allowCustom && input.value) {\n        addCustomTag(input.value);\n    }\n\n    e.preventDefault();\n}\n\nfunction onKeydownSpace(e: KeyboardEvent) {\n    if(focusIndex.value === undefined) {\n        return;\n    }\n\n    addTag(filtered.value[focusIndex.value]);\n\n    e.preventDefault();\n}\n\nfunction onKeydownUp() {\n    if(!focusIndex.value) {\n        focusIndex.value = filtered.value.length - 1;\n    }\n    else {\n        focusIndex.value--;\n    }\n}\n\nfunction onKeydownDown() {\n    if(focusIndex.value === undefined || focusIndex.value === filtered.value.length - 1) {\n        focusIndex.value = 0;\n    }\n    else {\n        focusIndex.value++;\n    }\n}\n\nfunction onKeydownLeft(multiple: boolean = false) {\n    if(!model.value?.length || input.value) {\n        return;\n    }\n\n    const nextIndex = Math.min(...selectedIndexes.value, model.value.length) - 1;\n\n    if(model.value[nextIndex]) {\n        toggleActiveTag(model.value[nextIndex], multiple);\n    }\n    else {\n        deactivateTags();\n    }\n}\n\nfunction onKeydownRight(multiple: boolean = false) {\n    if(!model.value?.length || input.value) {\n        return;\n    }\n\n    const nextIndex = Math.max(...selectedIndexes.value, -1) + 1;\n\n    if(model.value[nextIndex]) {\n        toggleActiveTag(model.value[nextIndex], multiple);\n    }\n    else {\n        deactivateTags();\n    }\n}\n\nfunction onEscape() {\n    if(hasFocus.value) {\n        hasFocus.value = false;\n    }\n    else {\n        deactivateTags();\n    }\n}\n\nfunction onBlur(e: FocusEvent) {\n    if(props.allowCustom && input.value) {\n        addCustomTag(input.value);\n    }\n\n    hasFocus.value = false;\n\n    deactivateTags();\n\n    listeners.onBlur(e);\n}\n\nfunction onFocus(e: FocusEvent) {\n    hasFocus.value = true;\n\n    deactivateTags();\n\n    listeners.onFocus(e);\n}\n\nfunction onClickAddTag() {\n    if(input.value) {\n        addCustomTag(input.value);\n    }\n}\n\nfunction clear() {\n    if (!isInteractive.value) return;\n    input.value = undefined;\n    model.value = [];\n}\n\nfunction onClickOutsideWrapper(e: MouseEvent) {\n    if(!e.target) {\n        return;\n    }\n\n    if(!(wrapperEl.value == e.target || wrapperEl.value?.contains(e.target as Element))) {\n        deactivateTags();\n    }\n}\n\nfunction onDocumentKeydown(e: KeyboardEvent) {\n    switch (e.key) {\n    case 'Backspace':\n        if(selected.value.length) {\n            removeActiveTags();\n            e.preventDefault();\n        }\n        break;\n    case 'Escape':\n        if(!hasFocus.value) {\n            deactivateTags();\n        }\n    }\n}\n\nonBeforeMount(() => {\n    document.addEventListener('click', onClickOutsideWrapper);\n    document.addEventListener('keydown', onDocumentKeydown);\n});\n\nonBeforeUnmount(() => {\n    document.removeEventListener('click', onClickOutsideWrapper);\n    document.removeEventListener('keydown', onDocumentKeydown);\n});\n</script>\n\n<template>\n    <div\n        ref=\"wrapperEl\"\n        class=\"tag-field\"\n        :class=\"[formGroupClasses, { 'has-clear-button': canClear }]\">\n        <slot name=\"label\">\n            <label\n                v-if=\"label\"\n                :class=\"labelClass\"\n                :for=\"controlAttributes.id\">\n                {{ label }}\n            </label>\n        </slot>\n\n        <div class=\"form-control-inner\">\n            <slot\n                name=\"control\"\n                v-bind=\"{ controlAttributes, listeners }\">\n                <div\n                    v-if=\"$slots.icon\"\n                    class=\"form-control-inner-icon\"\n                    @click=\"inputEl?.focus()\">\n                    <slot name=\"icon\" />\n                </div>\n                <div\n                    v-bind=\"controlAttributes\"\n                    class=\"form-control flex\"\n                    :class=\"$attrs.class\"\n                    @click.self=\"inputEl?.focus()\">\n                    <div class=\"flex flex-wrap gap-2 mr-2 flex-1\">\n                        <Badge\n                            v-for=\"(tag, i) in model\"\n                            ref=\"tagEl\"\n                            :key=\"`tag-${i}`\"\n                            tabindex=\"-1\"\n                            :size=\"badgeSize\"\n                            :class=\"[\n                                badgeClass,\n                                { 'pointer-events-none': !isInteractive },\n                                isTagActive(tag) ? activeBadgeColor : undefined\n                            ]\"\n                            :closeable=\"badgeCloseable\"\n                            :close-left=\"badgeCloseLeft\"\n                            @mousedown.prevent\n                            @close=\"removeTag(tag)\"\n                            @focus=\"toggleActiveTag(tag)\"\n                            @blur=\"deactivateTag(tag)\"\n                            @click.exact.meta=\"toggleActiveTag(tag, true)\"\n                            @click.exact=\"toggleActiveTag(tag)\"\n                            @click.exact.shift=\"toggleActiveTagRange(tag)\">\n                            <slot :option=\"tag\" :display=\"display\">\n                                {{ display?.(tag) ?? tag }}\n                            </slot>\n                            <template #close-icon>\n                                <XMarkIcon class=\"size-[1.25em]\" @mousedown.prevent />\n                            </template>\n                        </Badge>\n\n                        <input\n                            ref=\"inputEl\"\n                            v-model=\"input\"\n                            :placeholder=\"model?.length ? undefined : ($attrs.placeholder as string)\"\n                            :disabled=\"props.disabled\"\n                            :readonly=\"props.readonly\"\n                            class=\"bg-transparent outline-none flex-1 min-w-0\"\n                            @keydown.exact.delete=\"onBackspace\"\n                            @keydown.exact.meta.a=\"selectAllTags\"\n                            @keydown.exact.enter=\"onKeydownEnter\"\n                            @keydown.exact.space=\"onKeydownSpace\"\n                            @keydown.exact.arrow-up=\"onKeydownUp\"\n                            @keydown.exact.arrow-down=\"onKeydownDown\"\n                            @keydown.exact.arrow-left=\"onKeydownLeft()\"\n                            @keydown.exact.shift.arrow-left=\"onKeydownLeft(true)\"\n                            @keydown.exact.arrow-right=\"onKeydownRight()\"\n                            @keydown.exact.shift.arrow-right=\"onKeydownRight(true)\"\n                            @keydown.esc=\"onEscape\"\n                            @blur=\"onBlur\"\n                            @focus=\"onFocus\">\n                    </div>\n                </div>\n            </slot>\n\n            <div class=\"form-control-activity-indicator\">\n                <slot name=\"activity\" v-bind=\"{ canClear, clear, isInteractive }\">\n                    <button\n                        v-if=\"canClear\"\n                        type=\"button\"\n                        class=\"tag-field-clear-button\"\n                        @click.stop=\"clear\">\n                        <XMarkIcon class=\"size-[1.25em]\" />\n                    </button>\n                    <Transition name=\"tag-field-fade\" v-else>\n                        <ActivityIndicator\n                            v-if=\"props.activity && props.indicator\"\n                            key=\"activity\"\n                            :type=\"props.indicator\"\n                            :size=\"props.indicatorSize\" />\n                    </Transition>\n                </slot>\n            </div>\n        </div>\n\n        <div\n            v-if=\"showOptions\"\n            tabindex=\"-1\"\n            class=\"tag-field-dropdown\"\n            :class=\"size\"\n            @mousedown.prevent.stop>\n            <button\n                v-for=\"(option, i) in filtered\"\n                :key=\"`option-${JSON.stringify(option)}`\"\n                type=\"button\"\n                tabindex=\"-1\"\n                :class=\"{\n                    ['bg-neutral-100 dark:bg-neutral-800']: focusIndex === i\n                }\"\n                @mousedown.prevent\n                @mouseup=\"addTag(option)\">\n                <div class=\"truncate\">\n                    {{ display?.(option) ?? option }}\n                </div>\n            </button>\n            <button\n                v-if=\"allowCustom && input\"\n                class=\"flex items-center gap-1\"\n                type=\"button\"\n                @mousedown.prevent\n                @mouseup=\"onClickAddTag\">\n                <PlusIcon class=\"size-4\" /> {{ addTagLabel }}\n            </button>\n            <div\n                v-if=\"showNoResults && !filtered.length && !allowCustom\"\n                class=\"py-2 px-4 text-neutral-400 dark:text-neutral-500\">\n                <slot name=\"no-results\" :input=\"input\">\n                    {{ noResultsText }}\n                </slot>\n            </div>\n        </div>\n\n        <slot\n            name=\"errors\"\n            v-bind=\"{ error, errors, id: $attrs.id, name: $attrs.name }\">\n            <FormControlErrors\n                v-if=\"!!(error || errors)\"\n                :id=\"id\"\n                v-slot=\"{ error }\"\n                :name=\"name\"\n                :error=\"error\"\n                :errors=\"errors\">\n                <div\n                    invalid\n                    class=\"invalid-feedback\">\n                    {{ error }}\n                </div>\n            </FormControlErrors>\n        </slot>\n\n        <slot\n            name=\"feedback\"\n            v-bind=\"{ feedback }\">\n            <FormControlFeedback\n                v-slot=\"{ feedback }\"\n                :feedback=\"feedback\">\n                <div\n                    valid\n                    class=\"valid-feedback\">\n                    {{ feedback }}\n                </div>\n            </FormControlFeedback>\n        </slot>\n\n        <slot\n            name=\"help\"\n            v-bind=\"{ helpText }\">\n            <small\n                v-if=\"helpText\"\n                class=\"form-help\">\n                {{ helpText }}\n            </small>\n        </slot>\n    </div>\n</template>\n"],"names":["render","_ctx","_cache","_openBlock","_createElementBlock","_createElementVNode","props","__props","model","_useModel","emit","__emit","controlAttributes","formGroupClasses","listeners","useFormControl","wrapperEl","useTemplateRef","inputEl","tagEl","input","ref","selected","hasFocus","focusIndex","options","isInteractive","computed","canClear","keys","fuse","createFuse","showOptions","filtered","selectedIndexes","tag","item","isEqual","watch","deactivateTags","items","Fuse","option","toRaw","unref","addCustomTag","value","addTag","removeTag","deactivateTag","toggleActiveTag","multiple","isTagActive","activateTag","toggleActiveTagRange","index","lastSelectedIndex","fn","range","selectAllTags","omit","tags","blurTags","removeActiveTags","onBackspace","onKeydownEnter","onKeydownSpace","onKeydownUp","onKeydownDown","onKeydownLeft","nextIndex","onKeydownRight","onEscape","onBlur","onFocus","onClickAddTag","clear","onClickOutsideWrapper","onDocumentKeydown","onBeforeMount","onBeforeUnmount","_normalizeClass","_unref","_renderSlot","_hoisted_1","_hoisted_2","_normalizeProps","_guardReactiveProps","$slots","$event","_mergeProps","$attrs","_withModifiers","_hoisted_3","_Fragment","_renderList","i","_createBlock","Badge","_createVNode","XMarkIcon","_hoisted_5","_Transition","ActivityIndicator","_hoisted_7","_toDisplayString","PlusIcon","_createTextVNode","_hoisted_8","FormControlErrors","_withCtx","error","_hoisted_9","FormControlFeedback","feedback","_hoisted_10","_hoisted_11"],"mappings":"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","x_google_ignoreList":[0,1]}

package/dist/tag-field.umd.cjs

@@ -1,2 +1,2 @@
-(function(s,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@vue-interface/activity-indicator"),require("@vue-interface/badge"),require("@vue-interface/form-control"),require("fuse.js"),require("lodash-es")):typeof define=="function"&&define.amd?define(["exports","vue","@vue-interface/activity-indicator","@vue-interface/badge","@vue-interface/form-control","fuse.js","lodash-es"],e):(s=typeof globalThis<"u"?globalThis:s||self,e(s.TagField={},s.Vue,s.VueInterfaceActivityIndicator,s.VueInterfaceBadge,s.VueInterfaceFormControl,s.FuseJs,s.LodashEs))})(this,(function(s,e,U,J,v,G,h){"use strict";function W(B,T){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true","data-slot":"icon"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M12 4.5v15m7.5-7.5h-15"})])}function z(B,T){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true","data-slot":"icon"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M6 18 18 6M6 6l12 12"})])}const H=["for"],Q={class:"form-control-inner"},X={class:"flex flex-wrap gap-2 mr-2 flex-1"},Y=["placeholder","onKeydown"],Z={class:"form-control-activity-indicator"},_={invalid:"",class:"invalid-feedback"},ee={valid:"",class:"valid-feedback"},te={key:0,class:"form-help"},oe=["onMouseup"],ne={class:"truncate"},re={key:1,class:"py-2 px-4 text-neutral-400 dark:text-neutral-500"},le=e.defineComponent({inheritAttrs:!1,__name:"TagField",props:{modelValue:{},modelModifiers:{}},emits:e.mergeModels(["blur","focus","focusin","focusout","click","doubleclick","contextmenu","mousedown","mouseup","mouseover","mouseout","mouseenter","mouseleave","mousemove","keydown","keyup","keypress","select","selectionchange","invalid","submit","reset","scroll","wheel","copy","cut","paste","touchstart","touchend","touchmove","touchcancel","change","input","beforeinput"],["update:modelValue"]),setup(B,{emit:T}){const i=B,r=e.useModel(B,"modelValue"),ie=T,{controlAttributes:y,formGroupClasses:ae,listeners:se}=v.useFormControl({model:r,props:i,emit:ie}),V=e.useTemplateRef("wrapperEl"),E=e.useTemplateRef("inputEl"),N=e.useTemplateRef("tagEl"),l=e.ref(),c=e.ref([]),m=e.ref(!1),a=e.ref(),C=e.ref(i.options),$=e.computed(()=>!i.disabled&&!i.readonly),S=e.computed(()=>i.clearable&&(!!l.value||!!r.value?.length)&&$.value),ce=e.computed(()=>typeof i.options=="object"&&i.options?.[0]?Object.keys(i.options?.[0]):[]),F=fe(i.options),de=e.computed(()=>m.value&&(d.value.length||l.value)),M=e.computed(()=>c.value.map(t=>(r.value??[]).findIndex(o=>h.isEqual(o,t))));e.watch(()=>i.options,()=>{C.value=i.options}),e.watch(l,()=>{m.value=!0,a.value=void 0,f()});function fe(t){return new G(t,i.fuseOptions??{includeScore:!0,threshold:.45,keys:ce.value})}const d=e.computed(()=>{const t=C.value.filter(o=>!(r.value??[]).find(n=>h.isEqual(n,e.toRaw(e.unref(o)))));return l.value?(F.setCollection(t),F.search(l.value).map(({item:o})=>o)):t});function x(t){const o=i.format?.(t)??t;C.value.find(n=>h.isEqual(n,o))||(C.value.push(o),g(o),l.value=void 0)}function g(t){r.value=[...r.value??[],t],l.value=void 0,a.value=void 0}function D(t){const o=[...r.value??[]];o.splice(o.indexOf(t),1),b(t),r.value=o}function k(t,o=!1){o||f(t),w(t)?b(t):R(t)}function ue(t){const o=r.value??[],n=o.indexOf(t),u=M.value[M.value.length-1],p=w(t)?b:R;if(u===void 0){k(t);return}let K=[];n>u?K=o.slice(u,n+1):n<u&&(K=o.slice(n,u+1));for(const Ce of K)p(Ce)}function pe(){l.value||(c.value=[...r.value??[]])}function f(t){if(!t)c.value=[];else{const o=c.value.filter(n=>!h.isEqual(n,t));for(const n of o)b(n)}I()}function I(){if(N.value)for(const t of N.value)t?.$el?.blur()}function w(t){return!!c.value.find(o=>h.isEqual(o,t))}function R(t){w(t)||c.value.push(t)}function b(t){w(t)&&c.value.splice(c.value.indexOf(t),1),I()}function P(){r.value=(r.value??[]).filter(t=>!w(t)),c.value=[]}function me(){E.value?.focus(),!l.value&&(c.value.length?P():r.value?.length&&D(r.value[r.value.length-1]))}function ke(t){a.value!==void 0?g(d.value[a.value]):d.value.length?g(d.value[0]):i.allowCustom&&l.value&&x(l.value),t.preventDefault()}function we(t){a.value!==void 0&&(g(d.value[a.value]),t.preventDefault())}function he(){a.value?a.value--:a.value=d.value.length-1}function ye(){a.value===void 0||a.value===d.value.length-1?a.value=0:a.value++}function q(t=!1){if(!r.value?.length||l.value)return;const o=Math.min(...M.value,r.value.length)-1;r.value[o]?k(r.value[o],t):f()}function A(t=!1){if(!r.value?.length||l.value)return;const o=Math.max(...M.value,-1)+1;r.value[o]?k(r.value[o],t):f()}function ge(){m.value?m.value=!1:f()}function be(){i.allowCustom&&l.value&&x(l.value),m.value=!1,f()}function Be(){m.value=!0,f()}function Ee(){l.value&&x(l.value)}function L(){$.value&&(l.value=void 0,r.value=[])}function O(t){t.target&&(V.value==t.target||V.value?.contains(t.target)||f())}function j(t){switch(t.key){case"Backspace":c.value.length&&(P(),t.preventDefault());break;case"Escape":m.value||f()}}return e.onBeforeMount(()=>{document.addEventListener("click",O),document.addEventListener("keydown",j)}),e.onBeforeUnmount(()=>{document.removeEventListener("click",O),document.removeEventListener("keydown",j)}),(t,o)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"wrapperEl",ref:V,class:e.normalizeClass(["tag-field",[e.unref(ae),{"has-clear-button":S.value}]])},[e.renderSlot(t.$slots,"label",{},()=>[t.label?(e.openBlock(),e.createElementBlock("label",{key:0,class:e.normalizeClass(t.labelClass),for:e.unref(y).id},e.toDisplayString(t.label),11,H)):e.createCommentVNode("",!0)]),e.createElementVNode("div",Q,[e.renderSlot(t.$slots,"control",e.normalizeProps(e.guardReactiveProps({controlAttributes:e.unref(y),listeners:e.unref(se)})),()=>[t.$slots.icon?(e.openBlock(),e.createElementBlock("div",{key:0,class:"form-control-inner-icon",onClick:o[0]||(o[0]=n=>E.value?.focus())},[e.renderSlot(t.$slots,"icon")])):e.createCommentVNode("",!0),e.createElementVNode("div",e.mergeProps(e.unref(y),{class:"form-control flex",onClick:o[8]||(o[8]=e.withModifiers(n=>E.value?.focus(),["self"]))}),[e.createElementVNode("div",X,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.value,(n,u)=>(e.openBlock(),e.createBlock(e.unref(J.Badge),{ref_for:!0,ref_key:"tagEl",ref:N,key:`tag-${u}`,tabindex:"-1",size:"badge-[.95em]",class:e.normalizeClass(["badge-neutral-100 dark:badge-neutral-500",{"badge-blue-600!":w(n)}]),closeable:"",onMousedown:o[2]||(o[2]=e.withModifiers(()=>{},["prevent"])),onClose:p=>D(n),onFocus:p=>k(n),onBlur:p=>b(n),onClick:[e.withModifiers(p=>k(n,!0),["exact","meta"]),e.withModifiers(p=>k(n),["exact"]),e.withModifiers(p=>ue(n),["exact","shift"])]},{"close-icon":e.withCtx(()=>[e.createVNode(e.unref(z),{class:"size-[1.25em]",onMousedown:o[1]||(o[1]=e.withModifiers(()=>{},["prevent"]))})]),default:e.withCtx(()=>[e.renderSlot(t.$slots,"default",{option:n,display:t.display},()=>[e.createTextVNode(e.toDisplayString(t.display?.(n)??n),1)])]),_:2},1032,["class","onClose","onFocus","onBlur","onClick"]))),128)),e.withDirectives(e.createElementVNode("input",{ref_key:"inputEl",ref:E,"onUpdate:modelValue":o[3]||(o[3]=n=>l.value=n),placeholder:t.placeholder,class:"bg-transparent outline-none flex-1 min-w-0",onKeydown:[e.withKeys(e.withModifiers(me,["exact"]),["delete"]),e.withKeys(e.withModifiers(pe,["exact","meta"]),["a"]),e.withKeys(e.withModifiers(ke,["exact"]),["enter"]),e.withKeys(e.withModifiers(we,["exact"]),["space"]),e.withKeys(e.withModifiers(he,["exact"]),["arrow-up"]),e.withKeys(e.withModifiers(ye,["exact"]),["arrow-down"]),o[4]||(o[4]=e.withKeys(e.withModifiers(n=>q(),["exact"]),["arrow-left"])),o[5]||(o[5]=e.withKeys(e.withModifiers(n=>q(!0),["exact","shift"]),["arrow-left"])),o[6]||(o[6]=e.withKeys(e.withModifiers(n=>A(),["exact"]),["arrow-right"])),o[7]||(o[7]=e.withKeys(e.withModifiers(n=>A(!0),["exact","shift"]),["arrow-right"])),e.withKeys(ge,["esc"])],onBlur:be,onFocus:Be},null,40,Y),[[e.vModelText,l.value]])])],16)]),e.createElementVNode("div",Z,[e.renderSlot(t.$slots,"activity",e.normalizeProps(e.guardReactiveProps({canClear:S.value,clear:L,isInteractive:$.value})),()=>[S.value?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",class:"tag-field-clear-button",onClick:e.withModifiers(L,["stop"])},[e.createVNode(e.unref(z),{class:"size-[1.25em]"})])):(e.openBlock(),e.createBlock(e.Transition,{key:1,name:"tag-field-fade"},{default:e.withCtx(()=>[t.activity&&t.indicator?(e.openBlock(),e.createBlock(e.unref(U.ActivityIndicator),{key:"activity",type:t.indicator,size:t.indicatorSize},null,8,["type","size"])):e.createCommentVNode("",!0)]),_:1}))])])]),e.renderSlot(t.$slots,"errors",e.normalizeProps(e.guardReactiveProps({error:t.error,errors:t.errors,id:e.unref(y).id,name:t.name})),()=>[t.error||t.errors?(e.openBlock(),e.createBlock(e.unref(v.FormControlErrors),{key:0,id:e.unref(y).id,name:t.name,error:t.error,errors:t.errors},{default:e.withCtx(({error:n})=>[e.createElementVNode("div",_,e.toDisplayString(n),1)]),_:1},8,["id","name","error","errors"])):e.createCommentVNode("",!0)]),e.renderSlot(t.$slots,"feedback",e.normalizeProps(e.guardReactiveProps({feedback:t.feedback})),()=>[e.createVNode(e.unref(v.FormControlFeedback),{feedback:t.feedback},{default:e.withCtx(({feedback:n})=>[e.createElementVNode("div",ee,e.toDisplayString(n),1)]),_:1},8,["feedback"])]),e.renderSlot(t.$slots,"help",e.normalizeProps(e.guardReactiveProps({helpText:t.helpText})),()=>[t.helpText?(e.openBlock(),e.createElementBlock("small",te,e.toDisplayString(t.helpText),1)):e.createCommentVNode("",!0)]),de.value?(e.openBlock(),e.createElementBlock("div",{key:0,tabindex:"-1",class:"tag-field-dropdown",onMousedown:o[11]||(o[11]=e.withModifiers(()=>{},["prevent","stop"]))},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(d.value,(n,u)=>(e.openBlock(),e.createElementBlock("button",{key:`option-${JSON.stringify(n)}`,type:"button",tabindex:"-1",class:e.normalizeClass({"bg-neutral-100 dark:bg-neutral-800":a.value===u}),onMousedown:o[9]||(o[9]=e.withModifiers(()=>{},["prevent"])),onMouseup:p=>g(n)},[e.createElementVNode("div",ne,e.toDisplayString(t.display?.(n)??n),1)],42,oe))),128)),t.allowCustom&&l.value?(e.openBlock(),e.createElementBlock("button",{key:0,class:"flex items-center gap-1",type:"button",onMousedown:o[10]||(o[10]=e.withModifiers(()=>{},["prevent"])),onMouseup:Ee},[e.createVNode(e.unref(W),{class:"size-4"}),e.createTextVNode(" "+e.toDisplayString(t.addTagLabel),1)],32)):e.createCommentVNode("",!0),t.showNoResults&&!d.value.length&&!t.allowCustom?(e.openBlock(),e.createElementBlock("div",re,[e.renderSlot(t.$slots,"no-results",{input:l.value},()=>[e.createTextVNode(e.toDisplayString(t.noResultsText),1)])])):e.createCommentVNode("",!0)],32)):e.createCommentVNode("",!0)],2))}});s.TagField=le,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})}));
+(function(d,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@vue-interface/activity-indicator"),require("@vue-interface/badge"),require("@vue-interface/form-control"),require("fuse.js"),require("lodash-es")):typeof define=="function"&&define.amd?define(["exports","vue","@vue-interface/activity-indicator","@vue-interface/badge","@vue-interface/form-control","fuse.js","lodash-es"],e):(d=typeof globalThis<"u"?globalThis:d||self,e(d.TagField={},d.Vue,d.VueInterfaceActivityIndicator,d.VueInterfaceBadge,d.VueInterfaceFormControl,d.FuseJs,d.LodashEs))})(this,(function(d,e,J,G,E,W,g){"use strict";function H(n,M){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true","data-slot":"icon"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M12 4.5v15m7.5-7.5h-15"})])}function F(n,M){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.5",stroke:"currentColor","aria-hidden":"true","data-slot":"icon"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M6 18 18 6M6 6l12 12"})])}const Q=["for"],X={class:"form-control-inner"},Y={class:"flex flex-wrap gap-2 mr-2 flex-1"},Z=["placeholder","disabled","readonly","onKeydown"],_={class:"form-control-activity-indicator"},ee=["onMouseup"],te={class:"truncate"},oe={key:1,class:"py-2 px-4 text-neutral-400 dark:text-neutral-500"},le={invalid:"",class:"invalid-feedback"},ne={valid:"",class:"valid-feedback"},ae={key:0,class:"form-help"},re=e.defineComponent({inheritAttrs:!1,__name:"TagField",props:e.mergeModels({activity:{type:Boolean},disabled:{type:Boolean},error:{},errors:{},feedback:{},formControlClass:{default:"form-control"},helpText:{},id:{},indicator:{},indicatorSize:{},invalid:{type:Boolean},label:{},labelClass:{default:"form-label"},modelValue:{},name:{},plaintext:{type:Boolean},size:{default:"form-control-md"},color:{},readonly:{type:Boolean},valid:{type:Boolean},value:{},options:{default:()=>[]},fuseOptions:{},display:{},format:{},allowCustom:{type:Boolean,default:!1},addTagLabel:{default:"Add Tag"},noResultsText:{default:"No results found"},showNoResults:{type:Boolean,default:!0},clearable:{type:Boolean,default:!1},badgeClass:{default:"badge-neutral-100 dark:badge-neutral-500"},activeBadgeColor:{default:"badge-blue-100! dark:badge-blue-600!"},badgeSize:{default:"badge-[.95em]"},badgeCloseable:{type:Boolean,default:!0},badgeCloseLeft:{type:Boolean,default:!1}},{modelValue:{},modelModifiers:{}}),emits:e.mergeModels(["blur","focus","focusin","focusout","click","doubleclick","contextmenu","mousedown","mouseup","mouseover","mouseout","mouseenter","mouseleave","mousemove","keydown","keyup","keypress","select","selectionchange","invalid","submit","reset","scroll","wheel","copy","cut","paste","touchstart","touchend","touchmove","touchcancel","change","input","beforeinput"],["update:modelValue"]),setup(n,{emit:M}){const i=n,a=e.useModel(n,"modelValue"),ie=M,{controlAttributes:T,formGroupClasses:se,listeners:V}=E.useFormControl({model:a,props:i,emit:ie}),$=e.useTemplateRef("wrapperEl"),C=e.useTemplateRef("inputEl"),N=e.useTemplateRef("tagEl"),r=e.ref(),c=e.ref([]),y=e.ref(!1),s=e.ref(),v=e.ref(i.options),f=e.computed(()=>!i.disabled&&!i.readonly),S=e.computed(()=>i.clearable&&(!!r.value||!!a.value?.length)&&f.value),de=e.computed(()=>typeof i.options=="object"&&i.options?.[0]?Object.keys(i.options?.[0]):[]),R=fe(i.options),ce=e.computed(()=>f.value&&y.value&&(u.value.length||r.value)),x=e.computed(()=>c.value.map(t=>(a.value??[]).findIndex(o=>g.isEqual(o,t))));e.watch(()=>i.options,()=>{v.value=i.options}),e.watch(r,()=>{y.value=!0,s.value=void 0,m()});function fe(t){return new W(t,i.fuseOptions??{includeScore:!0,threshold:.45,keys:de.value})}const u=e.computed(()=>{const t=v.value.filter(o=>!(a.value??[]).find(l=>g.isEqual(l,e.toRaw(e.unref(o)))));return r.value?(R.setCollection(t),R.search(r.value).map(({item:o})=>o)):t});function z(t){if(!f.value)return;const o=i.format?.(t)??t;v.value.find(l=>g.isEqual(l,o))||(v.value.push(o),b(o),r.value=void 0)}function b(t){f.value&&(a.value=[...a.value??[],t],r.value=void 0,s.value=void 0)}function D(t){if(!f.value)return;const o=[...a.value??[]];o.splice(o.indexOf(t),1),B(t),a.value=o}function k(t,o=!1){f.value&&(o||m(t),h(t)?B(t):A(t))}function ue(t){if(!f.value)return;const o=a.value??[],l=o.indexOf(t),p=x.value[x.value.length-1],w=h(t)?B:A;if(p===void 0){k(t);return}let K=[];l>p?K=o.slice(p,l+1):l<p&&(K=o.slice(l,p+1));for(const ve of K)w(ve)}function me(){r.value||(c.value=[...a.value??[]])}function m(t){if(!t)c.value=[];else{const o=c.value.filter(l=>!g.isEqual(l,t));for(const l of o)B(l)}I()}function I(){if(N.value)for(const t of N.value)t?.$el?.blur()}function h(t){return!!c.value.find(o=>g.isEqual(o,t))}function A(t){h(t)||c.value.push(t)}function B(t){h(t)&&c.value.splice(c.value.indexOf(t),1),I()}function L(){a.value=(a.value??[]).filter(t=>!h(t)),c.value=[]}function pe(){C.value?.focus(),!r.value&&(c.value.length?L():a.value?.length&&D(a.value[a.value.length-1]))}function we(t){s.value!==void 0?b(u.value[s.value]):u.value.length?b(u.value[0]):i.allowCustom&&r.value&&z(r.value),t.preventDefault()}function ye(t){s.value!==void 0&&(b(u.value[s.value]),t.preventDefault())}function ke(){s.value?s.value--:s.value=u.value.length-1}function he(){s.value===void 0||s.value===u.value.length-1?s.value=0:s.value++}function P(t=!1){if(!a.value?.length||r.value)return;const o=Math.min(...x.value,a.value.length)-1;a.value[o]?k(a.value[o],t):m()}function q(t=!1){if(!a.value?.length||r.value)return;const o=Math.max(...x.value,-1)+1;a.value[o]?k(a.value[o],t):m()}function ge(){y.value?y.value=!1:m()}function be(t){i.allowCustom&&r.value&&z(r.value),y.value=!1,m(),V.onBlur(t)}function Be(t){y.value=!0,m(),V.onFocus(t)}function Ce(){r.value&&z(r.value)}function O(){f.value&&(r.value=void 0,a.value=[])}function j(t){t.target&&($.value==t.target||$.value?.contains(t.target)||m())}function U(t){switch(t.key){case"Backspace":c.value.length&&(L(),t.preventDefault());break;case"Escape":y.value||m()}}return e.onBeforeMount(()=>{document.addEventListener("click",j),document.addEventListener("keydown",U)}),e.onBeforeUnmount(()=>{document.removeEventListener("click",j),document.removeEventListener("keydown",U)}),(t,o)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"wrapperEl",ref:$,class:e.normalizeClass(["tag-field",[e.unref(se),{"has-clear-button":S.value}]])},[e.renderSlot(t.$slots,"label",{},()=>[n.label?(e.openBlock(),e.createElementBlock("label",{key:0,class:e.normalizeClass(n.labelClass),for:e.unref(T).id},e.toDisplayString(n.label),11,Q)):e.createCommentVNode("",!0)]),e.createElementVNode("div",X,[e.renderSlot(t.$slots,"control",e.normalizeProps(e.guardReactiveProps({controlAttributes:e.unref(T),listeners:e.unref(V)})),()=>[t.$slots.icon?(e.openBlock(),e.createElementBlock("div",{key:0,class:"form-control-inner-icon",onClick:o[0]||(o[0]=l=>C.value?.focus())},[e.renderSlot(t.$slots,"icon")])):e.createCommentVNode("",!0),e.createElementVNode("div",e.mergeProps(e.unref(T),{class:["form-control flex",t.$attrs.class],onClick:o[8]||(o[8]=e.withModifiers(l=>C.value?.focus(),["self"]))}),[e.createElementVNode("div",Y,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.value,(l,p)=>(e.openBlock(),e.createBlock(e.unref(G.Badge),{ref_for:!0,ref_key:"tagEl",ref:N,key:`tag-${p}`,tabindex:"-1",size:n.badgeSize,class:e.normalizeClass([n.badgeClass,{"pointer-events-none":!f.value},h(l)?n.activeBadgeColor:void 0]),closeable:n.badgeCloseable,"close-left":n.badgeCloseLeft,onMousedown:o[2]||(o[2]=e.withModifiers(()=>{},["prevent"])),onClose:w=>D(l),onFocus:w=>k(l),onBlur:w=>B(l),onClick:[e.withModifiers(w=>k(l,!0),["exact","meta"]),e.withModifiers(w=>k(l),["exact"]),e.withModifiers(w=>ue(l),["exact","shift"])]},{"close-icon":e.withCtx(()=>[e.createVNode(e.unref(F),{class:"size-[1.25em]",onMousedown:o[1]||(o[1]=e.withModifiers(()=>{},["prevent"]))})]),default:e.withCtx(()=>[e.renderSlot(t.$slots,"default",{option:l,display:n.display},()=>[e.createTextVNode(e.toDisplayString(n.display?.(l)??l),1)])]),_:2},1032,["size","class","closeable","close-left","onClose","onFocus","onBlur","onClick"]))),128)),e.withDirectives(e.createElementVNode("input",{ref_key:"inputEl",ref:C,"onUpdate:modelValue":o[3]||(o[3]=l=>r.value=l),placeholder:a.value?.length?void 0:t.$attrs.placeholder,disabled:i.disabled,readonly:i.readonly,class:"bg-transparent outline-none flex-1 min-w-0",onKeydown:[e.withKeys(e.withModifiers(pe,["exact"]),["delete"]),e.withKeys(e.withModifiers(me,["exact","meta"]),["a"]),e.withKeys(e.withModifiers(we,["exact"]),["enter"]),e.withKeys(e.withModifiers(ye,["exact"]),["space"]),e.withKeys(e.withModifiers(ke,["exact"]),["arrow-up"]),e.withKeys(e.withModifiers(he,["exact"]),["arrow-down"]),o[4]||(o[4]=e.withKeys(e.withModifiers(l=>P(),["exact"]),["arrow-left"])),o[5]||(o[5]=e.withKeys(e.withModifiers(l=>P(!0),["exact","shift"]),["arrow-left"])),o[6]||(o[6]=e.withKeys(e.withModifiers(l=>q(),["exact"]),["arrow-right"])),o[7]||(o[7]=e.withKeys(e.withModifiers(l=>q(!0),["exact","shift"]),["arrow-right"])),e.withKeys(ge,["esc"])],onBlur:be,onFocus:Be},null,40,Z),[[e.vModelText,r.value]])])],16)]),e.createElementVNode("div",_,[e.renderSlot(t.$slots,"activity",e.normalizeProps(e.guardReactiveProps({canClear:S.value,clear:O,isInteractive:f.value})),()=>[S.value?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",class:"tag-field-clear-button",onClick:e.withModifiers(O,["stop"])},[e.createVNode(e.unref(F),{class:"size-[1.25em]"})])):(e.openBlock(),e.createBlock(e.Transition,{key:1,name:"tag-field-fade"},{default:e.withCtx(()=>[i.activity&&i.indicator?(e.openBlock(),e.createBlock(e.unref(J.ActivityIndicator),{key:"activity",type:i.indicator,size:i.indicatorSize},null,8,["type","size"])):e.createCommentVNode("",!0)]),_:1}))])])]),ce.value?(e.openBlock(),e.createElementBlock("div",{key:0,tabindex:"-1",class:e.normalizeClass(["tag-field-dropdown",n.size]),onMousedown:o[11]||(o[11]=e.withModifiers(()=>{},["prevent","stop"]))},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(u.value,(l,p)=>(e.openBlock(),e.createElementBlock("button",{key:`option-${JSON.stringify(l)}`,type:"button",tabindex:"-1",class:e.normalizeClass({"bg-neutral-100 dark:bg-neutral-800":s.value===p}),onMousedown:o[9]||(o[9]=e.withModifiers(()=>{},["prevent"])),onMouseup:w=>b(l)},[e.createElementVNode("div",te,e.toDisplayString(n.display?.(l)??l),1)],42,ee))),128)),n.allowCustom&&r.value?(e.openBlock(),e.createElementBlock("button",{key:0,class:"flex items-center gap-1",type:"button",onMousedown:o[10]||(o[10]=e.withModifiers(()=>{},["prevent"])),onMouseup:Ce},[e.createVNode(e.unref(H),{class:"size-4"}),e.createTextVNode(" "+e.toDisplayString(n.addTagLabel),1)],32)):e.createCommentVNode("",!0),n.showNoResults&&!u.value.length&&!n.allowCustom?(e.openBlock(),e.createElementBlock("div",oe,[e.renderSlot(t.$slots,"no-results",{input:r.value},()=>[e.createTextVNode(e.toDisplayString(n.noResultsText),1)])])):e.createCommentVNode("",!0)],34)):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"errors",e.normalizeProps(e.guardReactiveProps({error:n.error,errors:n.errors,id:t.$attrs.id,name:t.$attrs.name})),()=>[n.error||n.errors?(e.openBlock(),e.createBlock(e.unref(E.FormControlErrors),{key:0,id:n.id,name:n.name,error:n.error,errors:n.errors},{default:e.withCtx(({error:l})=>[e.createElementVNode("div",le,e.toDisplayString(l),1)]),_:1},8,["id","name","error","errors"])):e.createCommentVNode("",!0)]),e.renderSlot(t.$slots,"feedback",e.normalizeProps(e.guardReactiveProps({feedback:n.feedback})),()=>[e.createVNode(e.unref(E.FormControlFeedback),{feedback:n.feedback},{default:e.withCtx(({feedback:l})=>[e.createElementVNode("div",ne,e.toDisplayString(l),1)]),_:1},8,["feedback"])]),e.renderSlot(t.$slots,"help",e.normalizeProps(e.guardReactiveProps({helpText:n.helpText})),()=>[n.helpText?(e.openBlock(),e.createElementBlock("small",ae,e.toDisplayString(n.helpText),1)):e.createCommentVNode("",!0)])],2))}});d.TagField=re,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})}));
 //# sourceMappingURL=tag-field.umd.cjs.map

package/dist/tag-field.umd.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"tag-field.umd.cjs","sources":["../../../node_modules/.pnpm/@heroicons+vue@2.2.0_vue@3.5.27_typescript@5.9.3_/node_modules/@heroicons/vue/24/outline/esm/PlusIcon.js","../../../node_modules/.pnpm/@heroicons+vue@2.2.0_vue@3.5.27_typescript@5.9.3_/node_modules/@heroicons/vue/24/outline/esm/XMarkIcon.js","../src/TagField.vue"],"sourcesContent":["import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nexport default function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", {\n    xmlns: \"http://www.w3.org/2000/svg\",\n    fill: \"none\",\n    viewBox: \"0 0 24 24\",\n    \"stroke-width\": \"1.5\",\n    stroke: \"currentColor\",\n    \"aria-hidden\": \"true\",\n    \"data-slot\": \"icon\"\n  }, [\n    _createElementVNode(\"path\", {\n      \"stroke-linecap\": \"round\",\n      \"stroke-linejoin\": \"round\",\n      d: \"M12 4.5v15m7.5-7.5h-15\"\n    })\n  ]))\n}","import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nexport default function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", {\n    xmlns: \"http://www.w3.org/2000/svg\",\n    fill: \"none\",\n    viewBox: \"0 0 24 24\",\n    \"stroke-width\": \"1.5\",\n    stroke: \"currentColor\",\n    \"aria-hidden\": \"true\",\n    \"data-slot\": \"icon\"\n  }, [\n    _createElementVNode(\"path\", {\n      \"stroke-linecap\": \"round\",\n      \"stroke-linejoin\": \"round\",\n      d: \"M6 18 18 6M6 6l12 12\"\n    })\n  ]))\n}","<script setup lang=\"ts\" generic=\"T, Value\">\nimport { PlusIcon, XMarkIcon } from '@heroicons/vue/24/outline';\nimport { ActivityIndicator } from '@vue-interface/activity-indicator';\nimport { Badge } from '@vue-interface/badge';\nimport type { FormControlEvents, FormControlProps, FormControlSlots } from '@vue-interface/form-control';\nimport { FormControlErrors, FormControlFeedback, useFormControl } from '@vue-interface/form-control';\nimport type { IFuseOptions } from 'fuse.js';\nimport Fuse from 'fuse.js';\nimport { isEqual } from 'lodash-es';\nimport { type HTMLAttributes, computed, onBeforeMount, onBeforeUnmount, ref, toRaw, unref, useTemplateRef, watch, type Ref } from 'vue';\n\nexport type TagFieldSizePrefix = 'form-control';\n\nexport type TagFieldProps<T, Value> = /* @vue-ignore */ FormControlProps<\n    HTMLAttributes,\n    TagFieldSizePrefix,\n    T[],\n    Value[]\n> & {\n    options?: T[];\n    fuseOptions?: IFuseOptions<T>;\n    display?: (option: T) => string;\n    format?: (value: string) => T;\n    allowCustom?: boolean;\n    addTagLabel?: string;\n    noResultsText?: string;\n    showNoResults?: boolean;\n    clearable?: boolean;\n};\n\nconst props = withDefaults(defineProps<TagFieldProps<T, Value>>(), {\n    formControlClass: 'form-control',\n    labelClass: 'form-label',\n    size: 'form-control-md',\n    allowCustom: false,\n    addTagLabel: 'Add Tag',\n    noResultsText: 'No results found',\n    showNoResults: true,\n    clearable: false,\n    options: () => [],\n});\n\ndefineOptions({\n    inheritAttrs: false\n});\n\nconst model = defineModel<T[]>();\n\ndefineSlots<FormControlSlots<TagFieldSizePrefix, T[]> & {\n    default(props: { option: T; display?: (option: T) => string }): any;\n    'no-results'(props: { input: string | undefined }): any;\n}>();\n\nconst emit = defineEmits<FormControlEvents>();\n\nconst {\n    controlAttributes,\n    formGroupClasses,\n    listeners\n} = useFormControl<HTMLAttributes, TagFieldSizePrefix, T[]|undefined, Value[]>({ model, props, emit });\n\nconst wrapperEl = useTemplateRef('wrapperEl');\nconst inputEl = useTemplateRef('inputEl');\nconst tagEl = useTemplateRef('tagEl');\n\nconst input = ref<string>();\nconst selected = ref<T[]>([]) as Ref<T[]>;\nconst hasFocus = ref(false);\nconst focusIndex = ref<number>();\nconst options = ref(props.options) as Ref<T[]>;\n\nconst isInteractive = computed(() => !props.disabled && !props.readonly);\n\nconst canClear = computed(() => {\n    return props.clearable && (!!input.value || !!model.value?.length) && isInteractive.value;\n});\n\nconst keys = computed(() => {\n    return typeof props.options === 'object' && props.options?.[0]\n        ? Object.keys(props.options?.[0])\n        : [];\n});\n\nconst fuse: Fuse<T> = createFuse(props.options);\n\nconst showOptions = computed(() => {\n    return hasFocus.value && (filtered.value.length || input.value);\n});\n\nconst selectedIndexes = computed(() => {\n    return selected.value.map(tag => {\n        return (model.value ?? []).findIndex(item => isEqual(item, tag));\n    });\n});\n\nwatch(() => props.options, () => {\n    options.value = props.options;\n});\n\nwatch(input, () => {\n    hasFocus.value = true;\n    focusIndex.value = undefined;\n\n    deactivateTags();\n});\n\nfunction createFuse(items: T[]) {\n    return new Fuse(items, props.fuseOptions ?? {\n        includeScore: true,\n        threshold: .45,\n        keys: keys.value\n    });\n}\n\nconst filtered = computed<T[]>(() => {\n    const items = options.value.filter(option => {\n        return !(model.value ?? []).find(item => {\n            return isEqual(item, toRaw(unref(option)));\n        });\n    });\n\n    if(!input.value) {\n        return items;\n    }\n\n    fuse.setCollection(items as T[]);\n\n    return fuse.search(input.value).map(({ item }) => item);\n});\n\nfunction addCustomTag(value: string) {\n    const tag = props.format?.(value) ?? value as T;\n\n    if(!options.value.find(option => isEqual(option, tag))) {\n        options.value.push(tag);\n\n        addTag(tag);\n\n        input.value = undefined;\n    }\n}\n\nfunction addTag(tag: T) {\n    model.value = [...(model.value ?? []), tag];\n    input.value = undefined;\n    focusIndex.value = undefined;\n}\n\nfunction removeTag(tag: T) {\n    const value = [...(model.value ?? [])];\n\n    value.splice(value.indexOf(tag), 1);\n\n    deactivateTag(tag);\n\n    model.value = value;\n}\n\nfunction toggleActiveTag(tag: T, multiple = false) {\n    if(!multiple) {\n        deactivateTags(tag);\n    }\n\n    if(!isTagActive(tag)) {\n        activateTag(tag);\n    }\n    else {\n        deactivateTag(tag);\n    }\n}\n\nfunction toggleActiveTagRange(tag: T) {\n    const items = model.value ?? [];\n    const index = items.indexOf(tag);\n    const lastSelectedIndex = selectedIndexes.value[selectedIndexes.value.length - 1];\n    const fn = !isTagActive(tag) ? activateTag : deactivateTag;\n\n    if(lastSelectedIndex === undefined) {\n        toggleActiveTag(tag);\n\n        return;\n    }\n\n    let range: T[] = [];\n\n    if(index > lastSelectedIndex) {\n        range = items.slice(lastSelectedIndex, index + 1);\n    }\n    else if(index < lastSelectedIndex) {\n        range = items.slice(index, lastSelectedIndex + 1);\n    }\n\n    for(const tag of range) {\n        fn(tag);\n    }\n}\n\nfunction selectAllTags() {\n    if(input.value) {\n        return;\n    }\n\n    selected.value = [...(model.value ?? [])];\n}\n\nfunction deactivateTags(omit?: T) {\n    if(!omit) {\n        selected.value = [];\n    }\n    else {\n        const tags = selected.value.filter(\n            item => !isEqual(item, omit)\n        );\n\n        for(const tag of tags) {\n            deactivateTag(tag);\n        }\n    }\n\n    blurTags();\n}\n\nfunction blurTags() {\n    if(!tagEl.value) {\n        return;\n    }\n\n    for(const tag of tagEl.value) {\n        (tag?.$el as HTMLElement | undefined)?.blur();\n    }\n}\n\nfunction isTagActive(tag: T) {\n    return !!selected.value.find(item => isEqual(item, tag));\n}\n\nfunction activateTag(tag: T) {\n    if(!isTagActive(tag)) {\n        selected.value.push(tag);\n    }\n}\n\nfunction deactivateTag(tag: T) {\n    if(isTagActive(tag)) {\n        selected.value.splice(selected.value.indexOf(tag), 1);\n    }\n\n    blurTags();\n}\n\nfunction removeActiveTags() {\n    model.value = (model.value ?? []).filter(tag => {\n        return !isTagActive(tag);\n    });\n\n    selected.value = [];\n}\n\nfunction onBackspace() {\n    inputEl.value?.focus();\n\n    if(input.value) {\n        return;\n    }\n\n    if(selected.value.length) {\n        removeActiveTags();\n    }\n    else if(model.value?.length) {\n        removeTag(model.value[model.value.length - 1]);\n    }\n}\n\nfunction onKeydownEnter(e: KeyboardEvent) {\n    if(focusIndex.value !== undefined) {\n        addTag(filtered.value[focusIndex.value]);\n    }\n    else if(filtered.value.length) {\n        addTag(filtered.value[0]);\n    }\n    else if(props.allowCustom && input.value) {\n        addCustomTag(input.value);\n    }\n\n    e.preventDefault();\n}\n\nfunction onKeydownSpace(e: KeyboardEvent) {\n    if(focusIndex.value === undefined) {\n        return;\n    }\n\n    addTag(filtered.value[focusIndex.value]);\n\n    e.preventDefault();\n}\n\nfunction onKeydownUp() {\n    if(!focusIndex.value) {\n        focusIndex.value = filtered.value.length - 1;\n    }\n    else {\n        focusIndex.value--;\n    }\n}\n\nfunction onKeydownDown() {\n    if(focusIndex.value === undefined || focusIndex.value === filtered.value.length - 1) {\n        focusIndex.value = 0;\n    }\n    else {\n        focusIndex.value++;\n    }\n}\n\nfunction onKeydownLeft(multiple: boolean = false) {\n    if(!model.value?.length || input.value) {\n        return;\n    }\n\n    const nextIndex = Math.min(...selectedIndexes.value, model.value.length) - 1;\n\n    if(model.value[nextIndex]) {\n        toggleActiveTag(model.value[nextIndex], multiple);\n    }\n    else {\n        deactivateTags();\n    }\n}\n\nfunction onKeydownRight(multiple: boolean = false) {\n    if(!model.value?.length || input.value) {\n        return;\n    }\n\n    const nextIndex = Math.max(...selectedIndexes.value, -1) + 1;\n\n    if(model.value[nextIndex]) {\n        toggleActiveTag(model.value[nextIndex], multiple);\n    }\n    else {\n        deactivateTags();\n    }\n}\n\nfunction onEscape() {\n    if(hasFocus.value) {\n        hasFocus.value = false;\n    }\n    else {\n        deactivateTags();\n    }\n}\n\nfunction onBlur() {\n    if(props.allowCustom && input.value) {\n        addCustomTag(input.value);\n    }\n\n    hasFocus.value = false;\n\n    deactivateTags();\n}\n\nfunction onFocus() {\n    hasFocus.value = true;\n\n    deactivateTags();\n}\n\nfunction onClickAddTag() {\n    if(input.value) {\n        addCustomTag(input.value);\n    }\n}\n\nfunction clear() {\n    if (!isInteractive.value) return;\n    input.value = undefined;\n    model.value = [];\n}\n\nfunction onClickOutsideWrapper(e: MouseEvent) {\n    if(!e.target) {\n        return;\n    }\n\n    if(!(wrapperEl.value == e.target || wrapperEl.value?.contains(e.target as Element))) {\n        deactivateTags();\n    }\n}\n\nfunction onDocumentKeydown(e: KeyboardEvent) {\n    switch (e.key) {\n    case 'Backspace':\n        if(selected.value.length) {\n            removeActiveTags();\n            e.preventDefault();\n        }\n        break;\n    case 'Escape':\n        if(!hasFocus.value) {\n            deactivateTags();\n        }\n    }\n}\n\nonBeforeMount(() => {\n    document.addEventListener('click', onClickOutsideWrapper);\n    document.addEventListener('keydown', onDocumentKeydown);\n});\n\nonBeforeUnmount(() => {\n    document.removeEventListener('click', onClickOutsideWrapper);\n    document.removeEventListener('keydown', onDocumentKeydown);\n});\n</script>\n\n<template>\n    <div\n        ref=\"wrapperEl\"\n        class=\"tag-field\"\n        :class=\"[formGroupClasses, { 'has-clear-button': canClear }]\">\n        <slot name=\"label\">\n            <label\n                v-if=\"label\"\n                :class=\"labelClass\"\n                :for=\"controlAttributes.id\">\n                {{ label }}\n            </label>\n        </slot>\n\n        <div class=\"form-control-inner\">\n            <slot\n                name=\"control\"\n                v-bind=\"{ controlAttributes, listeners }\">\n                <div\n                    v-if=\"$slots.icon\"\n                    class=\"form-control-inner-icon\"\n                    @click=\"inputEl?.focus()\">\n                    <slot name=\"icon\" />\n                </div>\n                <div\n                    v-bind=\"controlAttributes\"\n                    class=\"form-control flex\"\n                    @click.self=\"inputEl?.focus()\">\n                    <div class=\"flex flex-wrap gap-2 mr-2 flex-1\">\n                        <Badge\n                            v-for=\"(tag, i) in model\"\n                            ref=\"tagEl\"\n                            :key=\"`tag-${i}`\"\n                            tabindex=\"-1\"\n                            size=\"badge-[.95em]\"\n                            class=\"badge-neutral-100 dark:badge-neutral-500\"\n                            :class=\"{\n                                'badge-blue-600!': isTagActive(tag),\n                            }\"\n                            closeable\n                            @mousedown.prevent\n                            @close=\"removeTag(tag)\"\n                            @focus=\"toggleActiveTag(tag)\"\n                            @blur=\"deactivateTag(tag)\"\n                            @click.exact.meta=\"toggleActiveTag(tag, true)\"\n                            @click.exact=\"toggleActiveTag(tag)\"\n                            @click.exact.shift=\"toggleActiveTagRange(tag)\">\n                            <slot :option=\"tag\" :display=\"display\">\n                                {{ display?.(tag) ?? tag }}\n                            </slot>\n                            <template #close-icon>\n                                <XMarkIcon class=\"size-[1.25em]\" @mousedown.prevent />\n                            </template>\n                        </Badge>\n\n                        <input\n                            ref=\"inputEl\"\n                            v-model=\"input\"\n                            :placeholder=\"placeholder\"\n                            class=\"bg-transparent outline-none flex-1 min-w-0\"\n                            @keydown.exact.delete=\"onBackspace\"\n                            @keydown.exact.meta.a=\"selectAllTags\"\n                            @keydown.exact.enter=\"onKeydownEnter\"\n                            @keydown.exact.space=\"onKeydownSpace\"\n                            @keydown.exact.arrow-up=\"onKeydownUp\"\n                            @keydown.exact.arrow-down=\"onKeydownDown\"\n                            @keydown.exact.arrow-left=\"onKeydownLeft()\"\n                            @keydown.exact.shift.arrow-left=\"onKeydownLeft(true)\"\n                            @keydown.exact.arrow-right=\"onKeydownRight()\"\n                            @keydown.exact.shift.arrow-right=\"onKeydownRight(true)\"\n                            @keydown.esc=\"onEscape\"\n                            @blur=\"onBlur\"\n                            @focus=\"onFocus\">\n                    </div>\n                </div>\n            </slot>\n\n            <div class=\"form-control-activity-indicator\">\n                <slot name=\"activity\" v-bind=\"{ canClear, clear, isInteractive }\">\n                    <button\n                        v-if=\"canClear\"\n                        type=\"button\"\n                        class=\"tag-field-clear-button\"\n                        @click.stop=\"clear\">\n                        <XMarkIcon class=\"size-[1.25em]\" />\n                    </button>\n                    <Transition name=\"tag-field-fade\" v-else>\n                        <ActivityIndicator\n                            v-if=\"activity && indicator\"\n                            key=\"activity\"\n                            :type=\"indicator\"\n                            :size=\"indicatorSize\" />\n                    </Transition>\n                </slot>\n            </div>\n        </div>\n\n        <slot\n            name=\"errors\"\n            v-bind=\"{ error, errors, id: controlAttributes.id, name }\">\n            <FormControlErrors\n                v-if=\"!!(error || errors)\"\n                :id=\"controlAttributes.id\"\n                v-slot=\"{ error: err }\"\n                :name=\"name\"\n                :error=\"error\"\n                :errors=\"errors\">\n                <div\n                    invalid\n                    class=\"invalid-feedback\">\n                    {{ err }}\n                </div>\n            </FormControlErrors>\n        </slot>\n\n        <slot\n            name=\"feedback\"\n            v-bind=\"{ feedback }\">\n            <FormControlFeedback\n                v-slot=\"{ feedback: fb }\"\n                :feedback=\"feedback\">\n                <div\n                    valid\n                    class=\"valid-feedback\">\n                    {{ fb }}\n                </div>\n            </FormControlFeedback>\n        </slot>\n\n        <slot\n            name=\"help\"\n            v-bind=\"{ helpText }\">\n            <small\n                v-if=\"helpText\"\n                class=\"form-help\">\n                {{ helpText }}\n            </small>\n        </slot>\n\n        <div\n            v-if=\"showOptions\"\n            tabindex=\"-1\"\n            class=\"tag-field-dropdown\"\n            @mousedown.prevent.stop>\n            <button\n                v-for=\"(option, i) in filtered\"\n                :key=\"`option-${JSON.stringify(option)}`\"\n                type=\"button\"\n                tabindex=\"-1\"\n                :class=\"{\n                    ['bg-neutral-100 dark:bg-neutral-800']: focusIndex === i\n                }\"\n                @mousedown.prevent\n                @mouseup=\"addTag(option)\">\n                <div class=\"truncate\">\n                    {{ display?.(option) ?? option }}\n                </div>\n            </button>\n            <button\n                v-if=\"allowCustom && input\"\n                class=\"flex items-center gap-1\"\n                type=\"button\"\n                @mousedown.prevent\n                @mouseup=\"onClickAddTag\">\n                <PlusIcon class=\"size-4\" /> {{ addTagLabel }}\n            </button>\n            <div\n                v-if=\"showNoResults && !filtered.length && !allowCustom\"\n                class=\"py-2 px-4 text-neutral-400 dark:text-neutral-500\">\n                <slot name=\"no-results\" :input=\"input\">\n                    {{ noResultsText }}\n                </slot>\n            </div>\n        </div>\n    </div>\n</template>\n"],"names":["render","_ctx","_cache","_openBlock","_createElementBlock","_createElementVNode","props","__props","model","_useModel","emit","__emit","controlAttributes","formGroupClasses","listeners","useFormControl","wrapperEl","useTemplateRef","inputEl","tagEl","input","ref","selected","hasFocus","focusIndex","options","isInteractive","computed","canClear","keys","fuse","createFuse","showOptions","filtered","selectedIndexes","tag","item","isEqual","watch","deactivateTags","items","Fuse","option","toRaw","unref","addCustomTag","value","addTag","removeTag","deactivateTag","toggleActiveTag","multiple","isTagActive","activateTag","toggleActiveTagRange","index","lastSelectedIndex","fn","range","selectAllTags","omit","tags","blurTags","removeActiveTags","onBackspace","onKeydownEnter","e","onKeydownSpace","onKeydownUp","onKeydownDown","onKeydownLeft","nextIndex","onKeydownRight","onEscape","onBlur","onFocus","onClickAddTag","clear","onClickOutsideWrapper","onDocumentKeydown","onBeforeMount","onBeforeUnmount","_normalizeClass","_unref","_renderSlot","label","labelClass","_hoisted_1","_hoisted_2","_normalizeProps","_guardReactiveProps","$slots","$event","_mergeProps","_withModifiers","_hoisted_3","_Fragment","_renderList","i","_createBlock","Badge","_createVNode","XMarkIcon","display","placeholder","_hoisted_5","_Transition","activity","indicator","ActivityIndicator","indicatorSize","error","errors","name","FormControlErrors","_withCtx","err","_hoisted_6","_toDisplayString","feedback","FormControlFeedback","fb","_hoisted_7","helpText","_hoisted_8","_hoisted_10","allowCustom","PlusIcon","_createTextVNode","addTagLabel","showNoResults","_hoisted_11","noResultsText"],"mappings":"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","x_google_ignoreList":[0,1]}
+{"version":3,"file":"tag-field.umd.cjs","sources":["../../../node_modules/.pnpm/@heroicons+vue@2.2.0_vue@3.5.27_typescript@5.9.3_/node_modules/@heroicons/vue/24/outline/esm/PlusIcon.js","../../../node_modules/.pnpm/@heroicons+vue@2.2.0_vue@3.5.27_typescript@5.9.3_/node_modules/@heroicons/vue/24/outline/esm/XMarkIcon.js","../src/TagField.vue"],"sourcesContent":["import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nexport default function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", {\n    xmlns: \"http://www.w3.org/2000/svg\",\n    fill: \"none\",\n    viewBox: \"0 0 24 24\",\n    \"stroke-width\": \"1.5\",\n    stroke: \"currentColor\",\n    \"aria-hidden\": \"true\",\n    \"data-slot\": \"icon\"\n  }, [\n    _createElementVNode(\"path\", {\n      \"stroke-linecap\": \"round\",\n      \"stroke-linejoin\": \"round\",\n      d: \"M12 4.5v15m7.5-7.5h-15\"\n    })\n  ]))\n}","import { createElementVNode as _createElementVNode, openBlock as _openBlock, createElementBlock as _createElementBlock } from \"vue\"\n\nexport default function render(_ctx, _cache) {\n  return (_openBlock(), _createElementBlock(\"svg\", {\n    xmlns: \"http://www.w3.org/2000/svg\",\n    fill: \"none\",\n    viewBox: \"0 0 24 24\",\n    \"stroke-width\": \"1.5\",\n    stroke: \"currentColor\",\n    \"aria-hidden\": \"true\",\n    \"data-slot\": \"icon\"\n  }, [\n    _createElementVNode(\"path\", {\n      \"stroke-linecap\": \"round\",\n      \"stroke-linejoin\": \"round\",\n      d: \"M6 18 18 6M6 6l12 12\"\n    })\n  ]))\n}","<script setup lang=\"ts\" generic=\"ModelValue, Value\">\nimport { PlusIcon, XMarkIcon } from '@heroicons/vue/24/outline';\nimport { ActivityIndicator } from '@vue-interface/activity-indicator';\nimport { Badge, type BadgeSize } from '@vue-interface/badge';\nimport type { FormControlEvents, FormControlProps, FormControlSlots } from '@vue-interface/form-control';\nimport { FormControlErrors, FormControlFeedback, useFormControl } from '@vue-interface/form-control';\nimport type { IFuseOptions } from 'fuse.js';\nimport Fuse from 'fuse.js';\nimport { isEqual } from 'lodash-es';\nimport { type HTMLAttributes, computed, onBeforeMount, onBeforeUnmount, ref, toRaw, unref, useTemplateRef, watch, type Ref } from 'vue';\n\nexport type TagFieldSizePrefix = 'form-control';\n\nexport type TagFieldProps<ModelValue, Value> = FormControlProps<\n    HTMLAttributes,\n    TagFieldSizePrefix,\n    ModelValue[],\n    Value[]\n> & {\n    options?: ModelValue[];\n    fuseOptions?: IFuseOptions<ModelValue>;\n    display?: (option: ModelValue) => string;\n    format?: (value: string) => ModelValue;\n    allowCustom?: boolean;\n    addTagLabel?: string;\n    noResultsText?: string;\n    showNoResults?: boolean;\n    clearable?: boolean;\n    badgeClass?: string | string[] | Record<string, boolean>;\n    activeBadgeColor?: string | string[] | Record<string, boolean>;\n    badgeSize?: BadgeSize;\n    badgeCloseable?: boolean;\n    badgeCloseLeft?: boolean;\n};\n\nconst props = withDefaults(defineProps<TagFieldProps<ModelValue, Value>>(), {\n    formControlClass: 'form-control',\n    labelClass: 'form-label',\n    size: 'form-control-md',\n    allowCustom: false,\n    addTagLabel: 'Add Tag',\n    noResultsText: 'No results found',\n    showNoResults: true,\n    clearable: false,\n    options: () => [],\n    badgeClass: 'badge-neutral-100 dark:badge-neutral-500',\n    activeBadgeColor: 'badge-blue-100! dark:badge-blue-600!',\n    badgeSize: 'badge-[.95em]',\n    badgeCloseable: true,\n    badgeCloseLeft: false,\n});\n\ndefineOptions({\n    inheritAttrs: false\n});\n\nconst model = defineModel<ModelValue[]>();\n\ndefineSlots<FormControlSlots<TagFieldSizePrefix, ModelValue[]> & {\n    default(props: { option: ModelValue; display?: (option: ModelValue) => string }): any;\n    'no-results'(props: { input: string | undefined }): any;\n}>();\n\nconst emit = defineEmits<FormControlEvents>();\n\nconst {\n    controlAttributes,\n    formGroupClasses,\n    listeners\n} = useFormControl<HTMLAttributes, TagFieldSizePrefix, ModelValue[]|undefined, Value[]>({ model, props, emit });\n\nconst wrapperEl = useTemplateRef('wrapperEl');\nconst inputEl = useTemplateRef('inputEl');\nconst tagEl = useTemplateRef('tagEl');\n\nconst input = ref<string>();\nconst selected = ref<ModelValue[]>([]) as Ref<ModelValue[]>;\nconst hasFocus = ref(false);\nconst focusIndex = ref<number>();\nconst options = ref(props.options) as Ref<ModelValue[]>;\n\nconst isInteractive = computed(() => !props.disabled && !props.readonly);\n\nconst canClear = computed(() => {\n    return props.clearable && (!!input.value || !!model.value?.length) && isInteractive.value;\n});\n\nconst keys = computed(() => {\n    return typeof props.options === 'object' && props.options?.[0]\n        ? Object.keys(props.options?.[0])\n        : [];\n});\n\nconst fuse: Fuse<ModelValue> = createFuse(props.options);\n\nconst showOptions = computed(() => {\n    return isInteractive.value && hasFocus.value && (filtered.value.length || input.value);\n});\n\nconst selectedIndexes = computed(() => {\n    return selected.value.map(tag => {\n        return (model.value ?? []).findIndex(item => isEqual(item, tag));\n    });\n});\n\nwatch(() => props.options, () => {\n    options.value = props.options;\n});\n\nwatch(input, () => {\n    hasFocus.value = true;\n    focusIndex.value = undefined;\n\n    deactivateTags();\n});\n\nfunction createFuse(items: ModelValue[]) {\n    return new Fuse(items, props.fuseOptions ?? {\n        includeScore: true,\n        threshold: .45,\n        keys: keys.value\n    });\n}\n\nconst filtered = computed<ModelValue[]>(() => {\n    const items = options.value.filter(option => {\n        return !(model.value ?? []).find(item => {\n            return isEqual(item, toRaw(unref(option)));\n        });\n    });\n\n    if(!input.value) {\n        return items;\n    }\n\n    fuse.setCollection(items as ModelValue[]);\n\n    return fuse.search(input.value).map(({ item }) => item);\n});\n\nfunction addCustomTag(value: string) {\n    if(!isInteractive.value) return;\n\n    const tag = props.format?.(value) ?? value as ModelValue;\n\n    if(!options.value.find(option => isEqual(option, tag))) {\n        options.value.push(tag);\n\n        addTag(tag);\n\n        input.value = undefined;\n    }\n}\n\nfunction addTag(tag: ModelValue) {\n    if(!isInteractive.value) return;\n\n    model.value = [...(model.value ?? []), tag];\n    input.value = undefined;\n    focusIndex.value = undefined;\n}\n\nfunction removeTag(tag: ModelValue) {\n    if(!isInteractive.value) return;\n\n    const value = [...(model.value ?? [])];\n\n    value.splice(value.indexOf(tag), 1);\n\n    deactivateTag(tag);\n\n    model.value = value;\n}\n\nfunction toggleActiveTag(tag: ModelValue, multiple = false) {\n    if(!isInteractive.value) return;\n\n    if(!multiple) {\n        deactivateTags(tag);\n    }\n\n    if(!isTagActive(tag)) {\n        activateTag(tag);\n    }\n    else {\n        deactivateTag(tag);\n    }\n}\n\nfunction toggleActiveTagRange(tag: ModelValue) {\n    if(!isInteractive.value) return;\n\n    const items = model.value ?? [];\n    const index = items.indexOf(tag);\n    const lastSelectedIndex = selectedIndexes.value[selectedIndexes.value.length - 1];\n    const fn = !isTagActive(tag) ? activateTag : deactivateTag;\n\n    if(lastSelectedIndex === undefined) {\n        toggleActiveTag(tag);\n\n        return;\n    }\n\n    let range: ModelValue[] = [];\n\n    if(index > lastSelectedIndex) {\n        range = items.slice(lastSelectedIndex, index + 1);\n    }\n    else if(index < lastSelectedIndex) {\n        range = items.slice(index, lastSelectedIndex + 1);\n    }\n\n    for(const tag of range) {\n        fn(tag);\n    }\n}\n\nfunction selectAllTags() {\n    if(input.value) {\n        return;\n    }\n\n    selected.value = [...(model.value ?? [])];\n}\n\nfunction deactivateTags(omit?: ModelValue) {\n    if(!omit) {\n        selected.value = [];\n    }\n    else {\n        const tags = selected.value.filter(\n            item => !isEqual(item, omit)\n        );\n\n        for(const tag of tags) {\n            deactivateTag(tag);\n        }\n    }\n\n    blurTags();\n}\n\nfunction blurTags() {\n    if(!tagEl.value) {\n        return;\n    }\n\n    for(const tag of tagEl.value) {\n        (tag?.$el as HTMLElement | undefined)?.blur();\n    }\n}\n\nfunction isTagActive(tag: ModelValue) {\n    return !!selected.value.find(item => isEqual(item, tag));\n}\n\nfunction activateTag(tag: ModelValue) {\n    if(!isTagActive(tag)) {\n        selected.value.push(tag);\n    }\n}\n\nfunction deactivateTag(tag: ModelValue) {\n    if(isTagActive(tag)) {\n        selected.value.splice(selected.value.indexOf(tag), 1);\n    }\n\n    blurTags();\n}\n\nfunction removeActiveTags() {\n    model.value = (model.value ?? []).filter(tag => {\n        return !isTagActive(tag);\n    });\n\n    selected.value = [];\n}\n\nfunction onBackspace() {\n    inputEl.value?.focus();\n\n    if(input.value) {\n        return;\n    }\n\n    if(selected.value.length) {\n        removeActiveTags();\n    }\n    else if(model.value?.length) {\n        removeTag(model.value[model.value.length - 1]);\n    }\n}\n\nfunction onKeydownEnter(e: KeyboardEvent) {\n    if(focusIndex.value !== undefined) {\n        addTag(filtered.value[focusIndex.value]);\n    }\n    else if(filtered.value.length) {\n        addTag(filtered.value[0]);\n    }\n    else if(props.allowCustom && input.value) {\n        addCustomTag(input.value);\n    }\n\n    e.preventDefault();\n}\n\nfunction onKeydownSpace(e: KeyboardEvent) {\n    if(focusIndex.value === undefined) {\n        return;\n    }\n\n    addTag(filtered.value[focusIndex.value]);\n\n    e.preventDefault();\n}\n\nfunction onKeydownUp() {\n    if(!focusIndex.value) {\n        focusIndex.value = filtered.value.length - 1;\n    }\n    else {\n        focusIndex.value--;\n    }\n}\n\nfunction onKeydownDown() {\n    if(focusIndex.value === undefined || focusIndex.value === filtered.value.length - 1) {\n        focusIndex.value = 0;\n    }\n    else {\n        focusIndex.value++;\n    }\n}\n\nfunction onKeydownLeft(multiple: boolean = false) {\n    if(!model.value?.length || input.value) {\n        return;\n    }\n\n    const nextIndex = Math.min(...selectedIndexes.value, model.value.length) - 1;\n\n    if(model.value[nextIndex]) {\n        toggleActiveTag(model.value[nextIndex], multiple);\n    }\n    else {\n        deactivateTags();\n    }\n}\n\nfunction onKeydownRight(multiple: boolean = false) {\n    if(!model.value?.length || input.value) {\n        return;\n    }\n\n    const nextIndex = Math.max(...selectedIndexes.value, -1) + 1;\n\n    if(model.value[nextIndex]) {\n        toggleActiveTag(model.value[nextIndex], multiple);\n    }\n    else {\n        deactivateTags();\n    }\n}\n\nfunction onEscape() {\n    if(hasFocus.value) {\n        hasFocus.value = false;\n    }\n    else {\n        deactivateTags();\n    }\n}\n\nfunction onBlur(e: FocusEvent) {\n    if(props.allowCustom && input.value) {\n        addCustomTag(input.value);\n    }\n\n    hasFocus.value = false;\n\n    deactivateTags();\n\n    listeners.onBlur(e);\n}\n\nfunction onFocus(e: FocusEvent) {\n    hasFocus.value = true;\n\n    deactivateTags();\n\n    listeners.onFocus(e);\n}\n\nfunction onClickAddTag() {\n    if(input.value) {\n        addCustomTag(input.value);\n    }\n}\n\nfunction clear() {\n    if (!isInteractive.value) return;\n    input.value = undefined;\n    model.value = [];\n}\n\nfunction onClickOutsideWrapper(e: MouseEvent) {\n    if(!e.target) {\n        return;\n    }\n\n    if(!(wrapperEl.value == e.target || wrapperEl.value?.contains(e.target as Element))) {\n        deactivateTags();\n    }\n}\n\nfunction onDocumentKeydown(e: KeyboardEvent) {\n    switch (e.key) {\n    case 'Backspace':\n        if(selected.value.length) {\n            removeActiveTags();\n            e.preventDefault();\n        }\n        break;\n    case 'Escape':\n        if(!hasFocus.value) {\n            deactivateTags();\n        }\n    }\n}\n\nonBeforeMount(() => {\n    document.addEventListener('click', onClickOutsideWrapper);\n    document.addEventListener('keydown', onDocumentKeydown);\n});\n\nonBeforeUnmount(() => {\n    document.removeEventListener('click', onClickOutsideWrapper);\n    document.removeEventListener('keydown', onDocumentKeydown);\n});\n</script>\n\n<template>\n    <div\n        ref=\"wrapperEl\"\n        class=\"tag-field\"\n        :class=\"[formGroupClasses, { 'has-clear-button': canClear }]\">\n        <slot name=\"label\">\n            <label\n                v-if=\"label\"\n                :class=\"labelClass\"\n                :for=\"controlAttributes.id\">\n                {{ label }}\n            </label>\n        </slot>\n\n        <div class=\"form-control-inner\">\n            <slot\n                name=\"control\"\n                v-bind=\"{ controlAttributes, listeners }\">\n                <div\n                    v-if=\"$slots.icon\"\n                    class=\"form-control-inner-icon\"\n                    @click=\"inputEl?.focus()\">\n                    <slot name=\"icon\" />\n                </div>\n                <div\n                    v-bind=\"controlAttributes\"\n                    class=\"form-control flex\"\n                    :class=\"$attrs.class\"\n                    @click.self=\"inputEl?.focus()\">\n                    <div class=\"flex flex-wrap gap-2 mr-2 flex-1\">\n                        <Badge\n                            v-for=\"(tag, i) in model\"\n                            ref=\"tagEl\"\n                            :key=\"`tag-${i}`\"\n                            tabindex=\"-1\"\n                            :size=\"badgeSize\"\n                            :class=\"[\n                                badgeClass,\n                                { 'pointer-events-none': !isInteractive },\n                                isTagActive(tag) ? activeBadgeColor : undefined\n                            ]\"\n                            :closeable=\"badgeCloseable\"\n                            :close-left=\"badgeCloseLeft\"\n                            @mousedown.prevent\n                            @close=\"removeTag(tag)\"\n                            @focus=\"toggleActiveTag(tag)\"\n                            @blur=\"deactivateTag(tag)\"\n                            @click.exact.meta=\"toggleActiveTag(tag, true)\"\n                            @click.exact=\"toggleActiveTag(tag)\"\n                            @click.exact.shift=\"toggleActiveTagRange(tag)\">\n                            <slot :option=\"tag\" :display=\"display\">\n                                {{ display?.(tag) ?? tag }}\n                            </slot>\n                            <template #close-icon>\n                                <XMarkIcon class=\"size-[1.25em]\" @mousedown.prevent />\n                            </template>\n                        </Badge>\n\n                        <input\n                            ref=\"inputEl\"\n                            v-model=\"input\"\n                            :placeholder=\"model?.length ? undefined : ($attrs.placeholder as string)\"\n                            :disabled=\"props.disabled\"\n                            :readonly=\"props.readonly\"\n                            class=\"bg-transparent outline-none flex-1 min-w-0\"\n                            @keydown.exact.delete=\"onBackspace\"\n                            @keydown.exact.meta.a=\"selectAllTags\"\n                            @keydown.exact.enter=\"onKeydownEnter\"\n                            @keydown.exact.space=\"onKeydownSpace\"\n                            @keydown.exact.arrow-up=\"onKeydownUp\"\n                            @keydown.exact.arrow-down=\"onKeydownDown\"\n                            @keydown.exact.arrow-left=\"onKeydownLeft()\"\n                            @keydown.exact.shift.arrow-left=\"onKeydownLeft(true)\"\n                            @keydown.exact.arrow-right=\"onKeydownRight()\"\n                            @keydown.exact.shift.arrow-right=\"onKeydownRight(true)\"\n                            @keydown.esc=\"onEscape\"\n                            @blur=\"onBlur\"\n                            @focus=\"onFocus\">\n                    </div>\n                </div>\n            </slot>\n\n            <div class=\"form-control-activity-indicator\">\n                <slot name=\"activity\" v-bind=\"{ canClear, clear, isInteractive }\">\n                    <button\n                        v-if=\"canClear\"\n                        type=\"button\"\n                        class=\"tag-field-clear-button\"\n                        @click.stop=\"clear\">\n                        <XMarkIcon class=\"size-[1.25em]\" />\n                    </button>\n                    <Transition name=\"tag-field-fade\" v-else>\n                        <ActivityIndicator\n                            v-if=\"props.activity && props.indicator\"\n                            key=\"activity\"\n                            :type=\"props.indicator\"\n                            :size=\"props.indicatorSize\" />\n                    </Transition>\n                </slot>\n            </div>\n        </div>\n\n        <div\n            v-if=\"showOptions\"\n            tabindex=\"-1\"\n            class=\"tag-field-dropdown\"\n            :class=\"size\"\n            @mousedown.prevent.stop>\n            <button\n                v-for=\"(option, i) in filtered\"\n                :key=\"`option-${JSON.stringify(option)}`\"\n                type=\"button\"\n                tabindex=\"-1\"\n                :class=\"{\n                    ['bg-neutral-100 dark:bg-neutral-800']: focusIndex === i\n                }\"\n                @mousedown.prevent\n                @mouseup=\"addTag(option)\">\n                <div class=\"truncate\">\n                    {{ display?.(option) ?? option }}\n                </div>\n            </button>\n            <button\n                v-if=\"allowCustom && input\"\n                class=\"flex items-center gap-1\"\n                type=\"button\"\n                @mousedown.prevent\n                @mouseup=\"onClickAddTag\">\n                <PlusIcon class=\"size-4\" /> {{ addTagLabel }}\n            </button>\n            <div\n                v-if=\"showNoResults && !filtered.length && !allowCustom\"\n                class=\"py-2 px-4 text-neutral-400 dark:text-neutral-500\">\n                <slot name=\"no-results\" :input=\"input\">\n                    {{ noResultsText }}\n                </slot>\n            </div>\n        </div>\n\n        <slot\n            name=\"errors\"\n            v-bind=\"{ error, errors, id: $attrs.id, name: $attrs.name }\">\n            <FormControlErrors\n                v-if=\"!!(error || errors)\"\n                :id=\"id\"\n                v-slot=\"{ error }\"\n                :name=\"name\"\n                :error=\"error\"\n                :errors=\"errors\">\n                <div\n                    invalid\n                    class=\"invalid-feedback\">\n                    {{ error }}\n                </div>\n            </FormControlErrors>\n        </slot>\n\n        <slot\n            name=\"feedback\"\n            v-bind=\"{ feedback }\">\n            <FormControlFeedback\n                v-slot=\"{ feedback }\"\n                :feedback=\"feedback\">\n                <div\n                    valid\n                    class=\"valid-feedback\">\n                    {{ feedback }}\n                </div>\n            </FormControlFeedback>\n        </slot>\n\n        <slot\n            name=\"help\"\n            v-bind=\"{ helpText }\">\n            <small\n                v-if=\"helpText\"\n                class=\"form-help\">\n                {{ helpText }}\n            </small>\n        </slot>\n    </div>\n</template>\n"],"names":["render","_ctx","_cache","_openBlock","_createElementBlock","_createElementVNode","props","__props","model","_useModel","emit","__emit","controlAttributes","formGroupClasses","listeners","useFormControl","wrapperEl","useTemplateRef","inputEl","tagEl","input","ref","selected","hasFocus","focusIndex","options","isInteractive","computed","canClear","keys","fuse","createFuse","showOptions","filtered","selectedIndexes","tag","item","isEqual","watch","deactivateTags","items","Fuse","option","toRaw","unref","addCustomTag","value","addTag","removeTag","deactivateTag","toggleActiveTag","multiple","isTagActive","activateTag","toggleActiveTagRange","index","lastSelectedIndex","fn","range","selectAllTags","omit","tags","blurTags","removeActiveTags","onBackspace","onKeydownEnter","e","onKeydownSpace","onKeydownUp","onKeydownDown","onKeydownLeft","nextIndex","onKeydownRight","onEscape","onBlur","onFocus","onClickAddTag","clear","onClickOutsideWrapper","onDocumentKeydown","onBeforeMount","onBeforeUnmount","_normalizeClass","_unref","_renderSlot","_hoisted_1","_hoisted_2","_normalizeProps","_guardReactiveProps","$slots","$event","_mergeProps","$attrs","_withModifiers","_hoisted_3","_Fragment","_renderList","i","_createBlock","Badge","_createVNode","XMarkIcon","_hoisted_5","_Transition","ActivityIndicator","_hoisted_7","_toDisplayString","PlusIcon","_createTextVNode","_hoisted_8","FormControlErrors","_withCtx","error","_hoisted_9","FormControlFeedback","feedback","_hoisted_10","_hoisted_11"],"mappings":"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","x_google_ignoreList":[0,1]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue-interface/tag-field",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "description": "A Vue tag field component.",
   "type": "module",
   "main": "./dist/tag-field.umd.cjs",
@@ -13,7 +13,8 @@
       "style": "./index.css",
       "import": "./dist/tag-field.js",
       "require": "./dist/tag-field.umd.cjs"
-    }
+    },
+    "./css": "./index.css"
   },
   "browserslist": "last 2 versions, > 0.5%, ie >= 11",
   "repository": {
@@ -47,9 +48,9 @@
     "fuse.js": "^7.1.0",
     "lodash-es": "^4.17.23",
     "vue": "^3.3.4",
-    "@vue-interface/badge": "3.1.4",
-    "@vue-interface/sizeable": "2.0.0",
     "@vue-interface/activity-indicator": "3.0.8",
+    "@vue-interface/badge": "3.1.5",
+    "@vue-interface/sizeable": "2.0.0",
     "@vue-interface/form-control": "2.0.23"
   },
   "devDependencies": {