@opentiny/tiny-robot 0.2.11 → 0.2.13

package/dist/sender/index.js

@@ -1,432 +1,283 @@
-import { ref as I, watch as te, reactive as We, computed as K, nextTick as W, defineComponent as be, createElementBlock as O, openBlock as D, createCommentVNode as P, createBlock as Q, unref as T, withCtx as Y, createVNode as G, normalizeClass as oe, resolveDynamicComponent as it, createElementVNode as U, toDisplayString as le, mergeModels as De, useModel as rt, onMounted as ut, useSlots as ct, Transition as ve, renderSlot as se, isRef as Fe, createTextVNode as Le, normalizeStyle as Ie, Fragment as Oe, renderList as Ae, withModifiers as dt } from "vue";
-import { I as ft } from "../index5.js";
-import { g as z, i as pt, t as ht } from "../utils.js";
-import { B as fe } from "../index3.js";
-import { T as Me } from "../index4.js";
-import { i as mt } from "../close.js";
-import { I as gt, L as vt, v as yt, w as bt, P as Ct, _ as St } from "../tiny-robot-svgs.js";
-function wt(t, y) {
-  const m = I(t.modelValue || t.defaultValue || ""), a = I(null);
-  te(
-    () => t.modelValue,
-    (f) => {
-      f !== void 0 && f !== m.value && (m.value = f);
+import { ref as D, watch as oe, reactive as nt, computed as P, nextTick as J, defineComponent as Re, createElementBlock as O, openBlock as m, createCommentVNode as W, createBlock as q, unref as w, withCtx as Z, createVNode as X, normalizeClass as le, resolveDynamicComponent as st, createElementVNode as M, toDisplayString as se, useAttrs as ot, resolveComponent as at, mergeProps as ge, Fragment as ce, renderList as ye, mergeModels as lt, useModel as rt, useSlots as it, Transition as Ee, renderSlot as ae, isRef as ut, createTextVNode as Me, normalizeStyle as qe, withModifiers as ct } from "vue";
+import { I as dt } from "../index5.js";
+import { B as xe } from "../index3.js";
+import { T as Ue } from "../index4.js";
+import { i as ft } from "../close.js";
+import { I as pt, L as ht, v as vt, w as gt, P as yt, _ as mt } from "../tiny-robot-svgs.js";
+import { _ as je } from "../_plugin-vue_export-helper.js";
+import { t as wt } from "../utils.js";
+function _t(a, u) {
+  const r = D(a.modelValue || a.defaultValue || ""), i = D(null);
+  oe(
+    () => a.modelValue,
+    (g) => {
+      g !== void 0 && g !== r.value && (r.value = g);
     }
-  ), te(
-    () => m.value,
-    (f) => {
-      y("update:modelValue", f);
+  ), oe(
+    () => r.value,
+    (g) => {
+      u("update:modelValue", g);
     }
   );
-  const x = (f) => {
-    m.value = f, y("update:modelValue", f);
-  }, u = (f) => {
-    f == null || f.preventDefault();
-    const p = m.value;
-    !t.disabled && !t.loading && p.trim() && y("submit", p);
-  }, i = () => {
-    m.value = "", y("update:modelValue", ""), y("clear");
-  }, r = I(!1);
+  const v = (g) => {
+    r.value = g, u("update:modelValue", g);
+  }, p = (g) => {
+    g == null || g.preventDefault();
+    const I = r.value;
+    !a.disabled && !a.loading && I.trim() && u("submit", I);
+  }, l = () => {
+    r.value = "", u("update:modelValue", ""), u("clear");
+  }, f = D(!1);
   return {
-    inputValue: m,
-    inputWrapper: a,
-    isComposing: r,
-    handleChange: x,
-    handleSubmit: u,
-    handleClear: i,
+    inputValue: r,
+    inputWrapper: i,
+    isComposing: f,
+    handleChange: v,
+    handleSubmit: p,
+    handleClear: l,
     clearInput: () => {
-      i();
+      l();
     }
   };
 }
-const $e = "​", ee = (t) => t.split("").every((y) => y === $e), J = (t) => t.replace(/\u200B/g, ""), ye = () => document.createTextNode($e), Et = (t) => {
-  const y = t.textContent || "", m = J(y);
-  return !m || m.trim() === "";
-}, Ve = (t) => {
-  const y = t.nextSibling;
-  if (y && y.nodeType === Node.TEXT_NODE && ee(y.textContent || ""))
-    return;
-  const m = ye();
-  t.parentNode && t.parentNode.insertBefore(m, t.nextSibling);
-}, Tt = (t) => {
-  Array.from(t.childNodes).forEach((m) => {
-    if (m.nodeType === Node.TEXT_NODE && ee(m.textContent || "")) {
-      const a = m.previousSibling;
-      a && a.nodeType === Node.ELEMENT_NODE && a.classList.contains("template-field") || m.parentNode && m.parentNode.removeChild(m);
-    }
-  });
-};
-function _t(t, y, m, a, x, u, i, r, c, f, p, o, b, L) {
-  const E = (h) => !(t.disabled || t.loading || h.trim().length === 0 || o.value), v = () => {
-    E(m.value) && y("submit", m.value.trim());
-  }, R = (h, $) => {
-    if (!(h.key === "Enter")) return !1;
-    switch ($) {
+function St(a, u, r, i, v, p, l, f, T, g, I, h, $, x, _, F) {
+  const L = (y) => !(a.disabled || a.loading || y.trim().length === 0 || h.value), G = () => {
+    L(r.value) && (_ != null && _.value && (F == null || F()), u("submit", r.value.trim()));
+  }, U = (y, N) => {
+    if (!(y.key === "Enter")) return !1;
+    switch (N) {
       case "enter":
-        return !h.shiftKey && !h.ctrlKey && !h.metaKey;
+        return !y.shiftKey && !y.ctrlKey && !y.metaKey;
       case "ctrlEnter":
-        return (h.ctrlKey || h.metaKey) && !h.shiftKey;
+        return (y.ctrlKey || y.metaKey) && !y.shiftKey;
       case "shiftEnter":
-        return h.shiftKey && !h.ctrlKey && !h.metaKey;
+        return y.shiftKey && !y.ctrlKey && !y.metaKey;
       default:
         return !1;
     }
   };
   return {
-    handleKeyPress: (h) => {
-      if (a.value) return;
-      if (h.key === "Enter" && h.shiftKey && (b == null ? void 0 : b.value) === "single" && L) {
-        h.preventDefault(), L();
-        const V = h.target, H = V.selectionStart, C = m.value;
-        m.value = C.substring(0, H) + `
-` + C.substring(H), setTimeout(() => {
-          V.selectionStart = V.selectionEnd = H + 1;
+    handleKeyPress: (y) => {
+      if (i.value) return;
+      if (y.key === "Enter" && y.shiftKey && ($ == null ? void 0 : $.value) === "single" && x) {
+        y.preventDefault(), x();
+        const V = y.target, Q = V.selectionStart, z = r.value;
+        r.value = z.substring(0, Q) + `
+` + z.substring(Q), setTimeout(() => {
+          V.selectionStart = V.selectionEnd = Q + 1;
         }, 0);
         return;
       }
-      if (h.key === "Tab" && u.value && i.value) {
-        h.preventDefault(), r();
+      if (y.key === "Tab" && p.value && l.value) {
+        y.preventDefault(), f();
         return;
       }
-      if (u.value) {
-        if (h.key === "ArrowDown") {
-          h.preventDefault(), f("down");
+      if (p.value) {
+        if (y.key === "ArrowDown") {
+          y.preventDefault(), g("down");
           return;
         }
-        if (h.key === "ArrowUp") {
-          h.preventDefault(), f("up");
+        if (y.key === "ArrowUp") {
+          y.preventDefault(), g("up");
           return;
         }
-        if (h.key === "Enter" && i.value) {
-          h.preventDefault(), r();
+        if (y.key === "Enter" && l.value) {
+          y.preventDefault(), f();
           return;
         }
       }
-      if (h.key === "Escape") {
-        u.value ? (c(), h.preventDefault()) : x.isRecording && (p(), h.preventDefault()), y("escape-press");
+      if (y.key === "Escape") {
+        p.value ? (T(), y.preventDefault()) : v.isRecording && (I(), y.preventDefault()), u("escape-press");
         return;
       }
-      R(h, t.submitType) && E(m.value) && (h.preventDefault(), v());
+      U(y, a.submitType) && L(r.value) && (y.preventDefault(), G());
     },
-    triggerSubmit: v
-  };
-}
-function Nt(t) {
-  const y = (u, i, r) => {
-    var L, E;
-    const { startOffset: c, collapsed: f } = i;
-    let p = i.startContainer;
-    if ((L = p.parentElement) != null && L.classList.contains("template-field") && (p = p.parentElement), !f) return !1;
-    const o = p.nodeType === Node.TEXT_NODE && c === 0 && u.key === "ArrowLeft", b = p.nodeType === Node.TEXT_NODE && c === (((E = p.textContent) == null ? void 0 : E.length) || 0) && u.key === "ArrowRight";
-    if (o || b) {
-      let v = null, R = "inside";
-      if (o)
-        if (p.parentNode && p.parentNode.classList.contains("template-field"))
-          v = p.parentNode, R = "before";
-        else {
-          let w = p.previousSibling;
-          !w && p.parentNode && p.parentNode !== r && (w = p.parentNode.previousSibling), w && w.nodeType === Node.ELEMENT_NODE && w.classList.contains("template-field") && (v = w, R = "inside");
-        }
-      else if (b)
-        if (p.parentNode && p.parentNode.classList.contains("template-field"))
-          v = p.parentNode, R = "after";
-        else {
-          let w = p.nextSibling;
-          !w && p.parentNode && p.parentNode !== r && (w = p.parentNode.nextSibling), w && w.nodeType === Node.ELEMENT_NODE && w.classList.contains("template-field") && (v = w, R = "inside");
-        }
-      if (v) {
-        u.preventDefault();
-        const w = document.createRange(), h = z(r);
-        return h && (R === "before" ? w.setStartBefore(v) : R === "after" ? w.setStartAfter(v) : (w.selectNodeContents(v), w.collapse(u.key === "ArrowLeft")), h.removeAllRanges(), h.addRange(w)), !0;
-      }
-    }
-    if (p.nodeType === Node.ELEMENT_NODE && p.classList.contains("template-field")) {
-      const R = p.textContent || "", w = J(R);
-      if (!w || w.trim() === "") {
-        u.preventDefault();
-        const h = document.createRange(), $ = z(r);
-        if (!$) return !0;
-        if (u.key === "ArrowLeft")
-          h.setStartBefore(p);
-        else {
-          const V = p.nextSibling;
-          V && V.nodeType === Node.TEXT_NODE && ee(V.textContent || "") ? (h.setStart(V, 0), h.setEnd(V, 0)) : h.setStartAfter(p);
-        }
-        return h.collapse(!0), $.removeAllRanges(), $.addRange(h), !0;
-      }
-    }
-    if (p.nodeType === Node.TEXT_NODE && ee(p.textContent || "")) {
-      const v = p.previousSibling, R = p.nextSibling;
-      u.preventDefault();
-      const w = document.createRange(), h = z(r);
-      return h && (u.key === "ArrowLeft" ? v && v.nodeType === Node.ELEMENT_NODE && v.classList.contains("template-field") ? (w.selectNodeContents(v), w.collapse(!1)) : w.setStartBefore(p) : R ? R.nodeType === Node.ELEMENT_NODE && R.classList.contains("template-field") ? (w.selectNodeContents(R), w.collapse(!0)) : pt(r) ? (w.setStart(R, 1), w.collapse(!0)) : w.setStartAfter(p) : w.setStartAfter(p), h.removeAllRanges(), h.addRange(w)), !0;
-    }
-    return !1;
-  }, m = (u, i, r) => {
-    if (!i.collapsed) return !1;
-    const { startContainer: c, startOffset: f } = i;
-    if (c.nodeType === Node.TEXT_NODE && ee(c.textContent || "")) {
-      const o = c.previousSibling;
-      if (o && o.nodeType === Node.ELEMENT_NODE && o.classList.contains("template-field")) {
-        const b = o, L = b.textContent || "", E = J(L);
-        if (!E || E.trim() === "") {
-          u.preventDefault();
-          const v = b.previousSibling, R = c.nextSibling;
-          b.parentNode && b.parentNode.removeChild(b), c.parentNode && c.parentNode.removeChild(c);
-          const w = z(r);
-          if (w) {
-            const h = document.createRange();
-            v ? v.nodeType === Node.ELEMENT_NODE && v.classList.contains("template-field") ? (h.selectNodeContents(v), h.collapse(!1)) : v.nodeType === Node.TEXT_NODE && ee(v.textContent || "") ? (h.setStart(v, 0), h.setEnd(v, 0)) : h.setStartAfter(v) : R ? h.setStartBefore(R) : h.setStart(r, 0), h.collapse(!0), w.removeAllRanges(), w.addRange(h);
-          }
-          return t.handleInput(), !0;
-        } else {
-          u.preventDefault();
-          const v = z(r);
-          if (v) {
-            const R = document.createRange();
-            R.selectNodeContents(b), R.collapse(!1), v.removeAllRanges(), v.addRange(R);
-          }
-          return !0;
-        }
-      }
-    }
-    if (c.nodeType === Node.TEXT_NODE && c.parentNode && c.parentNode.classList.contains("template-field") && c.textContent) {
-      const o = c.textContent;
-      if (J(o).length === 1 && f === o.length) {
-        u.preventDefault(), c.textContent = "";
-        const L = c.parentNode, E = z(r);
-        if (E) {
-          const v = document.createRange();
-          v.selectNodeContents(L), v.collapse(!0), E.removeAllRanges(), E.addRange(v);
-        }
-        return t.handleInput(), !0;
-      }
-    }
-    if (f === 0) {
-      let o = null;
-      if (c.nodeType === Node.ELEMENT_NODE && c.classList.contains("template-field") ? o = c : c.nodeType === Node.TEXT_NODE && c.parentNode && c.parentNode.classList.contains("template-field") && (o = c.parentNode), o) {
-        u.preventDefault();
-        const b = z(r);
-        return b && (i.setStartBefore(o), i.collapse(!0), b.removeAllRanges(), b.addRange(i)), !0;
-      }
-    }
-    return !1;
-  }, a = (u, i, r) => {
-    if (!i.collapsed) return !1;
-    const { startContainer: c, startOffset: f } = i;
-    if (c.nodeType === Node.TEXT_NODE && c.parentNode && c.parentNode.classList.contains("template-field") && c.textContent) {
-      const o = c.textContent, b = J(o);
-      if (f === o.length && b.length === 1) {
-        u.preventDefault(), c.textContent = "";
-        const L = c.parentNode, E = z(r);
-        if (E) {
-          const v = document.createRange();
-          v.selectNodeContents(L), v.collapse(!0), E.removeAllRanges(), E.addRange(v);
-        }
-        return t.handleInput(), !0;
-      }
-    }
-    return !1;
-  };
-  return {
-    handleTemplateKeyDown: (u) => {
-      if (t.isComposing.value) return;
-      const i = t.editor.value;
-      if (!i) return;
-      const r = z(i);
-      if (!r || r.rangeCount === 0) return;
-      const c = r.getRangeAt(0);
-      if (u.key === "Enter") {
-        u.preventDefault(), t.onSubmit(t.getValueFromDOM());
-        return;
-      }
-      (u.key === "ArrowLeft" || u.key === "ArrowRight") && !u.shiftKey && y(u, c, i) || u.key === "Backspace" && m(u, c, i) || u.key === "Delete" && a(u, c, i);
-    }
+    triggerSubmit: G
   };
 }
-function xt(t) {
-  const y = We({
+function bt(a) {
+  const u = nt({
     isRecording: !1,
     isSupported: typeof window < "u" && "webkitSpeechRecognition" in window || "SpeechRecognition" in window,
     error: void 0
-  }), m = y.isSupported ? new (window.webkitSpeechRecognition || window.SpeechRecognition)() : void 0;
-  m !== void 0 && (m.continuous = t.continuous ?? !1, m.interimResults = t.interimResults ?? !0, m.lang = t.lang ?? navigator.language, m.onstart = () => {
-    var i;
-    y.isRecording = !0, y.error = void 0, (i = t.onStart) == null || i.call(t);
-  }, m.onend = () => {
-    var i;
-    y.isRecording = !1, (i = t.onEnd) == null || i.call(t);
-  }, m.onresult = (i) => {
-    var c, f;
-    const r = Array.from(i.results).map((p) => p[0].transcript).join("");
-    i.results[0].isFinal ? (c = t.onFinal) == null || c.call(t, r) : (f = t.onInterim) == null || f.call(t, r);
-  }, m.onerror = (i) => {
-    var r;
-    y.error = new Error(i.error), y.isRecording = !1, (r = t.onError) == null || r.call(t, y.error);
+  }), r = u.isSupported ? new (window.webkitSpeechRecognition || window.SpeechRecognition)() : void 0;
+  r !== void 0 && (r.continuous = a.continuous ?? !1, r.interimResults = a.interimResults ?? !0, r.lang = a.lang ?? navigator.language, r.onstart = () => {
+    var l;
+    u.isRecording = !0, u.error = void 0, (l = a.onStart) == null || l.call(a);
+  }, r.onend = () => {
+    var l;
+    u.isRecording = !1, (l = a.onEnd) == null || l.call(a);
+  }, r.onresult = (l) => {
+    var T, g;
+    const f = Array.from(l.results).map((I) => I[0].transcript).join("");
+    l.results[0].isFinal ? (T = a.onFinal) == null || T.call(a, f) : (g = a.onInterim) == null || g.call(a, f);
+  }, r.onerror = (l) => {
+    var f;
+    u.error = new Error(l.error), u.isRecording = !1, (f = a.onError) == null || f.call(a, u.error);
   });
-  const a = () => {
-    var i;
-    if (!m) {
-      const r = new Error("浏览器不支持语音识别");
-      y.error = r, (i = t.onError) == null || i.call(t, r);
+  const i = () => {
+    var l;
+    if (!r) {
+      const f = new Error("浏览器不支持语音识别");
+      u.error = f, (l = a.onError) == null || l.call(a, f);
       return;
     }
-    if (y.isRecording) {
+    if (u.isRecording) {
       try {
-        m.stop(), setTimeout(() => {
+        r.stop(), setTimeout(() => {
           try {
-            m.start();
-          } catch (r) {
-            u(r);
+            r.start();
+          } catch (f) {
+            p(f);
           }
         }, 100);
-      } catch (r) {
-        u(r);
+      } catch (f) {
+        p(f);
       }
       return;
     }
     try {
-      m.start();
-    } catch (r) {
-      u(r);
+      r.start();
+    } catch (f) {
+      p(f);
     }
-  }, x = () => {
-    if (m && y.isRecording)
+  }, v = () => {
+    if (r && u.isRecording)
       try {
-        m.stop();
-      } catch (i) {
-        u(i);
+        r.stop();
+      } catch (l) {
+        p(l);
       }
-  }, u = (i) => {
-    var r;
-    y.error = i instanceof Error ? i : new Error("语音识别操作失败"), y.isRecording = !1, (r = t.onError) == null || r.call(t, y.error);
+  }, p = (l) => {
+    var f;
+    u.error = l instanceof Error ? l : new Error("语音识别操作失败"), u.isRecording = !1, (f = a.onError) == null || f.call(a, u.error);
   };
   return {
-    speechState: y,
-    start: a,
-    stop: x
+    speechState: u,
+    start: i,
+    stop: v
   };
 }
-const kt = (t, y) => {
-  if (!y || !t)
-    return [{ text: t, isMatch: !1 }];
-  const m = t.toLowerCase(), a = y.toLowerCase(), x = [];
-  let u = 0;
-  for (; u < m.length; ) {
-    const f = m.indexOf(a, u);
-    if (f === -1) break;
-    x.push({
-      start: f,
-      end: f + y.length
-    }), u = f + 1;
+const Ct = (a, u) => {
+  if (!u || !a)
+    return [{ text: a, isMatch: !1 }];
+  const r = a.toLowerCase(), i = u.toLowerCase(), v = [];
+  let p = 0;
+  for (; p < r.length; ) {
+    const g = r.indexOf(i, p);
+    if (g === -1) break;
+    v.push({
+      start: g,
+      end: g + u.length
+    }), p = g + 1;
   }
-  if (x.length === 0)
-    return [{ text: t, isMatch: !1 }];
-  const i = [];
-  for (const f of x)
-    if (i.length === 0)
-      i.push(f);
+  if (v.length === 0)
+    return [{ text: a, isMatch: !1 }];
+  const l = [];
+  for (const g of v)
+    if (l.length === 0)
+      l.push(g);
     else {
-      const p = i[i.length - 1];
-      f.start <= p.end ? p.end = Math.max(p.end, f.end) : i.push(f);
+      const I = l[l.length - 1];
+      g.start <= I.end ? I.end = Math.max(I.end, g.end) : l.push(g);
     }
-  const r = [];
-  let c = 0;
-  for (const f of i)
-    c < f.start && r.push({
-      text: t.substring(c, f.start),
+  const f = [];
+  let T = 0;
+  for (const g of l)
+    T < g.start && f.push({
+      text: a.substring(T, g.start),
       isMatch: !1
-    }), r.push({
-      text: t.substring(f.start, f.end),
+    }), f.push({
+      text: a.substring(g.start, g.end),
       isMatch: !0
-    }), c = f.end;
-  return c < t.length && r.push({
-    text: t.substring(c),
+    }), T = g.end;
+  return T < a.length && f.push({
+    text: a.substring(T),
     isMatch: !1
-  }), r;
+  }), f;
 };
-function Rt(t, y, m, a) {
-  const x = I(!1), u = I(-1), i = I(-1), r = I(""), c = I(!1), f = I(null), p = I(!1), o = I(null), b = K(() => {
-    if (!t.suggestions || !m.value || t.template) return [];
-    const e = m.value.toLowerCase();
-    return t.suggestions.filter((l) => l.toLowerCase().includes(e));
-  }), L = K(() => {
-    let e = -1;
-    return o.value === "mouse" && i.value !== -1 ? e = i.value : o.value === "keyboard" && u.value !== -1 && (e = u.value), b.value[e] || null;
-  }), E = (e) => e === u.value || e === i.value, v = (e) => {
-    if (o.value === null) {
-      r.value = "", c.value = !1;
+function kt(a, u, r, i) {
+  const v = D(!1), p = D(-1), l = D(-1), f = D(""), T = D(!1), g = D(null), I = D(!1), h = D(null), $ = P(() => {
+    if (!a.suggestions || !r.value || a.template) return [];
+    const R = r.value.toLowerCase();
+    return a.suggestions.filter((K) => K.toLowerCase().includes(R));
+  }), x = P(() => {
+    let R = -1;
+    return h.value === "mouse" && l.value !== -1 ? R = l.value : h.value === "keyboard" && p.value !== -1 && (R = p.value), $.value[R] || null;
+  }), _ = (R) => R === p.value || R === l.value, F = (R) => {
+    if (h.value === null) {
+      f.value = "", T.value = !1;
       return;
     }
-    const l = e || L.value;
-    l && m.value && l.toLowerCase().startsWith(m.value.toLowerCase()) ? (r.value = l.substring(m.value.length), c.value = !0) : (r.value = "", c.value = !1);
-  }, R = () => {
-    x.value = !1, u.value = -1, i.value = -1, o.value = null, r.value = "", c.value = !1;
-  }, w = () => {
-    x.value = !0, u.value = -1, i.value = -1, o.value = null, v();
-  }, h = () => {
-    a.value || p.value || W(() => {
-      m.value && t.suggestions && t.suggestions.length > 0 && !t.template && b.value.length > 0 ? w() : R();
+    const K = R || x.value;
+    K && r.value && K.toLowerCase().startsWith(r.value.toLowerCase()) ? (f.value = K.substring(r.value.length), T.value = !0) : (f.value = "", T.value = !1);
+  }, L = () => {
+    v.value = !1, p.value = -1, l.value = -1, h.value = null, f.value = "", T.value = !1;
+  }, G = () => {
+    v.value = !0, p.value = -1, l.value = -1, h.value = null, F();
+  }, U = () => {
+    i.value || I.value || J(() => {
+      r.value && a.suggestions && a.suggestions.length > 0 && !a.template && $.value.length > 0 ? G() : L();
     });
   };
-  te(m, h), te(() => t.suggestions, h);
-  const $ = (e) => {
-    p.value = !0, m.value = e, y("update:modelValue", e), y("suggestion-select", e), H(), W(() => {
-      p.value = !1;
+  oe(r, U), oe(() => a.suggestions, U);
+  const H = (R) => {
+    I.value = !0, r.value = R, u("update:modelValue", R), u("suggestion-select", R), N(), J(() => {
+      I.value = !1;
     });
-  }, V = () => {
-    L.value && $(L.value);
-  }, H = () => {
-    R();
+  }, y = () => {
+    x.value && H(x.value);
+  }, N = () => {
+    L();
   };
   return {
-    showSuggestionsPopup: x,
-    completionPlaceholder: r,
-    showTabHint: c,
-    suggestionsListRef: f,
-    filteredSuggestions: b,
-    activeSuggestion: L,
-    isItemHighlighted: E,
-    updateCompletionPlaceholder: v,
-    updateSuggestionsState: h,
-    selectSuggestion: $,
-    acceptCurrentSuggestion: V,
-    closeSuggestionsPopup: H,
-    navigateSuggestions: (e) => {
-      if (!x.value || b.value.length === 0) return;
-      o.value = "keyboard", u.value === -1 ? u.value = e === "down" ? 0 : b.value.length - 1 : e === "down" ? u.value = (u.value + 1) % b.value.length : u.value = (u.value - 1 + b.value.length) % b.value.length;
-      const l = b.value[u.value];
-      l && v(l);
-      const n = f.value;
-      if (n) {
-        const s = n.children[u.value];
-        s && s.scrollIntoView({ block: "nearest" });
+    showSuggestionsPopup: v,
+    completionPlaceholder: f,
+    showTabHint: T,
+    suggestionsListRef: g,
+    filteredSuggestions: $,
+    activeSuggestion: x,
+    isItemHighlighted: _,
+    updateCompletionPlaceholder: F,
+    updateSuggestionsState: U,
+    selectSuggestion: H,
+    acceptCurrentSuggestion: y,
+    closeSuggestionsPopup: N,
+    navigateSuggestions: (R) => {
+      if (!v.value || $.value.length === 0) return;
+      h.value = "keyboard", p.value === -1 ? p.value = R === "down" ? 0 : $.value.length - 1 : R === "down" ? p.value = (p.value + 1) % $.value.length : p.value = (p.value - 1 + $.value.length) % $.value.length;
+      const K = $.value[p.value];
+      K && F(K);
+      const re = g.value;
+      if (re) {
+        const E = re.children[p.value];
+        E && E.scrollIntoView({ block: "nearest" });
       }
     },
-    handleSuggestionItemHover: (e) => {
-      o.value = "mouse", i.value = e, v(b.value[e]);
+    handleSuggestionItemHover: (R) => {
+      h.value = "mouse", l.value = R, F($.value[R]);
     },
     handleSuggestionItemLeave: () => {
-      if (i.value = -1, u.value !== -1) {
-        o.value = "keyboard";
-        const e = b.value[u.value];
-        e && v(e);
+      if (l.value = -1, p.value !== -1) {
+        h.value = "keyboard";
+        const R = $.value[p.value];
+        R && F(R);
       } else
-        o.value = null, v();
+        h.value = null, F();
     },
     handleClickOutside: () => {
-      H();
+      N();
     },
-    highlightSuggestionText: kt
+    highlightSuggestionText: Ct
   };
 }
-const Dt = { class: "action-buttons" }, Ft = {
+const xt = { class: "action-buttons" }, It = {
   key: 0,
   class: "action-buttons__utility"
-}, Lt = { class: "action-buttons__submit-content" }, It = {
+}, Rt = { class: "action-buttons__submit-content" }, Ot = {
   key: 0,
   class: "action-buttons__cancel-text"
-}, Be = /* @__PURE__ */ be({
+}, ze = /* @__PURE__ */ Re({
   __name: "ActionButtons",
   props: {
     loading: { type: Boolean, default: !1 },
@@ -445,34 +296,34 @@ const Dt = { class: "action-buttons" }, Ft = {
     stopText: { default: void 0 }
   },
   emits: ["clear", "toggle-speech", "submit", "cancel"],
-  setup(t, { emit: y }) {
-    const m = mt(), a = t, x = y, u = K(() => a.allowSpeech), i = K(() => a.speechStatus.isRecording), r = K(() => a.disabled), c = K(() => r.value || a.isOverLimit), f = K(() => a.allowFiles || a.allowSpeech || a.showClear), p = () => {
-      r.value || x("clear");
-    }, o = () => {
-      if (!r.value) {
-        const E = !a.speechStatus.isRecording;
-        x("toggle-speech", E);
+  setup(a, { emit: u }) {
+    const r = ft(), i = a, v = u, p = P(() => i.allowSpeech), l = P(() => i.speechStatus.isRecording), f = P(() => i.disabled), T = P(() => f.value || i.isOverLimit), g = P(() => i.allowFiles || i.allowSpeech || i.showClear), I = () => {
+      f.value || v("clear");
+    }, h = () => {
+      if (!f.value) {
+        const _ = !i.speechStatus.isRecording;
+        v("toggle-speech", _);
       }
-    }, b = () => {
-      c.value || x("submit");
-    }, L = () => {
-      r.value || x("cancel");
+    }, $ = () => {
+      T.value || v("submit");
+    }, x = () => {
+      f.value || v("cancel");
     };
-    return (E, v) => (D(), O("div", Dt, [
-      f.value ? (D(), O("div", Ft, [
-        E.allowFiles && !E.loading ? (D(), Q(T(Me), {
+    return (_, F) => (m(), O("div", xt, [
+      g.value ? (m(), O("div", It, [
+        _.allowFiles && !_.loading ? (m(), q(w(Ue), {
           key: 0,
           content: "上传文件",
           placement: "top"
         }, {
-          default: Y(() => [
-            G(T(fe), {
+          default: Z(() => [
+            X(w(xe), {
               class: "action-buttons__button action-buttons__file-button",
               type: "text",
-              disabled: r.value
+              disabled: f.value
             }, {
-              default: Y(() => [
-                G(T(gt), {
+              default: Z(() => [
+                X(w(pt), {
                   class: "action-buttons__icon",
                   alt: "上传文件"
                 })
@@ -481,67 +332,67 @@ const Dt = { class: "action-buttons" }, Ft = {
             }, 8, ["disabled"])
           ]),
           _: 1
-        })) : P("", !0),
-        u.value && !E.loading ? (D(), Q(T(fe), {
+        })) : W("", !0),
+        p.value && !_.loading ? (m(), q(w(xe), {
           key: 1,
-          class: oe(["action-buttons__button action-buttons__speech-button", { "is-recording": i.value }]),
+          class: le(["action-buttons__button action-buttons__speech-button", { "is-recording": l.value }]),
           type: "text",
-          disabled: r.value,
-          onClick: o
+          disabled: f.value,
+          onClick: h
         }, {
-          default: Y(() => [
-            i.value ? (D(), Q(T(yt), {
+          default: Z(() => [
+            l.value ? (m(), q(w(vt), {
               key: 1,
               class: "action-buttons__icon action-buttons__icon--recording",
               alt: "语音中"
-            })) : (D(), Q(T(vt), {
+            })) : (m(), q(w(ht), {
               key: 0,
               class: "action-buttons__icon",
               alt: "录音"
             }))
           ]),
           _: 1
-        }, 8, ["disabled", "class"])) : P("", !0),
-        E.showClear ? (D(), Q(T(Me), {
+        }, 8, ["disabled", "class"])) : W("", !0),
+        _.showClear ? (m(), q(w(Ue), {
           key: 2,
           content: "清空内容",
           placement: "top"
         }, {
-          default: Y(() => [
-            G(T(fe), {
+          default: Z(() => [
+            X(w(xe), {
               class: "action-buttons__button action-buttons__clear-button",
               type: "text",
-              disabled: r.value || !E.hasContent,
-              onClick: p
+              disabled: f.value || !_.hasContent,
+              onClick: I
             }, {
-              default: Y(() => [
-                (D(), Q(it(T(m)), { class: "action-buttons__icon action-buttons__icon--close" }))
+              default: Z(() => [
+                (m(), q(st(w(r)), { class: "action-buttons__icon action-buttons__icon--close" }))
               ]),
               _: 1
             }, 8, ["disabled"])
           ]),
           _: 1
-        })) : P("", !0)
-      ])) : P("", !0),
-      E.hasContent || E.loading ? (D(), Q(T(fe), {
+        })) : W("", !0)
+      ])) : W("", !0),
+      _.hasContent || _.loading ? (m(), q(w(xe), {
         key: 1,
         type: "text",
         class: "action-buttons__button action-buttons__submit",
-        disabled: E.loading ? r.value : c.value,
-        onClick: v[0] || (v[0] = (R) => E.loading ? L() : b())
+        disabled: _.loading ? f.value : T.value,
+        onClick: F[0] || (F[0] = (L) => _.loading ? x() : $())
       }, {
-        default: Y(() => [
-          U("div", Lt, [
-            E.loading ? (D(), O("div", {
+        default: Z(() => [
+          M("div", Rt, [
+            _.loading ? (m(), O("div", {
               key: 1,
-              class: oe(["action-buttons__cancel", { "action-buttons__cancel--icon-only": !E.stopText }])
+              class: le(["action-buttons__cancel", { "action-buttons__cancel--icon-only": !_.stopText }])
             }, [
-              G(T(Ct), {
+              X(w(yt), {
                 class: "action-buttons__icon action-buttons__icon--stop",
                 alt: "停止"
               }),
-              E.stopText ? (D(), O("span", It, le(E.stopText), 1)) : P("", !0)
-            ], 2)) : (D(), Q(T(bt), {
+              _.stopText ? (m(), O("span", Ot, se(_.stopText), 1)) : W("", !0)
+            ], 2)) : (m(), q(w(gt), {
               key: 0,
               class: "action-buttons__icon action-buttons__icon--send",
               alt: "发送"
@@ -549,513 +400,456 @@ const Dt = { class: "action-buttons" }, Ft = {
           ])
         ]),
         _: 1
-      }, 8, ["disabled"])) : P("", !0)
+      }, 8, ["disabled"])) : W("", !0)
     ]));
   }
-});
-function Ot(t, y) {
-  const m = I(!1), a = We({ ...y }), x = (e) => {
-    Object.assign(a, e);
-  }, u = (e) => {
-    const l = [];
-    let n = 0;
-    const s = /\[(.*?)\]/g;
-    let g;
-    for (; (g = s.exec(e)) !== null; )
-      g.index > n && l.push({ type: "text", content: e.substring(n, g.index) }), l.push({ type: "field", content: g[1] }), n = g.index + g[0].length;
-    return n < e.length && l.push({ type: "text", content: e.substring(n) }), l;
-  }, i = () => {
-    if (!t.value) return "";
-    let e = "";
-    const l = (n) => {
-      let s = "";
-      if (n.nodeType === Node.TEXT_NODE) {
-        const g = n.textContent || "";
-        s += J(g);
-      } else if (n.nodeType === Node.ELEMENT_NODE) {
-        const g = n;
-        if (g.classList.contains("template-field")) {
-          const _ = g.textContent || "";
-          s += J(_);
-        } else if (g.tagName.toLowerCase() === "span") {
-          const _ = g.textContent || "";
-          s += J(_);
-        } else if (g.tagName.toLowerCase() === "br")
-          s += `
-`;
-        else
-          for (const _ of Array.from(g.childNodes))
-            s += l(_);
-      }
-      return s;
+}), Tt = ["data-id", "data-type"], $t = ["data-id", "data-type"], Bt = /* @__PURE__ */ Re({
+  inheritAttrs: !1,
+  __name: "Block",
+  props: {
+    id: {},
+    type: {},
+    content: {},
+    readonly: { type: Boolean },
+    asChild: { type: Boolean }
+  },
+  setup(a) {
+    const u = a, r = ot();
+    return (i, v) => {
+      const p = at("Block", !0);
+      return u.type !== "block" ? (m(), O("span", ge({
+        key: 0,
+        "data-id": u.id,
+        "data-type": u.type
+      }, w(r)), se(u.content), 17, Tt)) : (m(), O(ce, { key: 1 }, [
+        u.asChild ? (m(!0), O(ce, { key: 0 }, ye(u.content, (l) => (m(), q(p, ge({
+          key: `${l.id}-${l.type}`
+        }, { ref_for: !0 }, l), null, 16))), 128)) : (m(), O("span", ge({
+          key: 1,
+          "data-id": u.id,
+          "data-type": u.type
+        }, w(r)), [
+          (m(!0), O(ce, null, ye(u.content, (l) => (m(), q(p, ge({
+            key: `${l.id}-${l.type}`
+          }, { ref_for: !0 }, l), null, 16))), 128))
+        ], 16, $t))
+      ], 64));
     };
-    return t.value.childNodes.forEach((n) => {
-      e += l(n);
-    }), e;
-  }, r = (e) => a.initialValues && typeof a.initialValues[e] == "string" ? a.initialValues[e] : "", c = (e, l) => {
-    const n = document.createElement("span");
-    return n.className = "template-field", n.setAttribute("data-placeholder", e), l && (n.textContent = l), W(() => {
-      f(n, l || "");
-    }), n;
-  }, f = (e, l) => {
-    const n = J(l);
-    if (!n || n.trim() === "") {
-      const s = e.getAttribute("data-placeholder") || "";
-      s ? p(e, s, !0) : (e.style.minWidth = "", e.style.width = "");
-    } else
-      p(e, n, !1);
-    Ve(e);
-  }, p = (e, l, n) => {
-    const s = document.createElement("span");
-    s.className = "template-field", s.style.visibility = "hidden", s.style.position = "absolute", s.style.top = "-9999px", s.style.left = "-9999px", s.style.whiteSpace = "nowrap", s.style.padding = "3px 8px", s.style.margin = "0 2px", s.style.boxSizing = "border-box", s.textContent = l, document.body.appendChild(s);
-    const g = getComputedStyle(s), _ = s.offsetWidth, A = parseFloat(g.fontSize);
-    document.body.removeChild(s);
-    const M = n ? 1.5 : 2, j = _ / A, B = Math.max(M, Math.ceil(j));
-    e.style.setProperty("min-width", `${B}em`, "important");
-    const X = 20;
-    B > X ? (e.style.setProperty("max-width", `${X}em`, "important"), e.style.setProperty("white-space", "normal", "important"), e.style.setProperty("word-break", "break-word", "important")) : e.style.removeProperty("max-width");
-  }, o = (e) => {
-    const n = (e === void 0 ? i() : e).trim().length > 0;
-    m.value !== n && (m.value = n, a.onContentStatusChange(n));
-  }, b = (e, l = "inside", n = !1) => {
-    W(() => {
-      const s = z(t.value);
-      if (!s) return;
-      const g = document.createRange();
-      switch (l) {
-        case "before":
-          g.setStartBefore(e);
-          break;
-        case "after":
-          g.setStartAfter(e);
-          break;
-        case "inside":
-        default:
-          g.selectNodeContents(e), g.collapse(n);
-          break;
+  }
+}), Et = /* @__PURE__ */ je(Bt, [["__scopeId", "data-v-35531fd7"]]);
+function Lt(a, u = {}) {
+  let r = [], i = [], v = a;
+  return { commit: (I) => {
+    var h;
+    r.push(v), v = I, i.length && ((h = u.onRemoveHistory) == null || h.call(u, i)), i = [];
+  }, undo: () => r.length ? (i.push(v), v = r.pop(), v) : null, redo: () => i.length ? (r.push(v), v = i.pop(), v) : null, clear: () => {
+    var I, h;
+    r.length && ((I = u.onRemoveHistory) == null || I.call(u, r)), i.length && ((h = u.onRemoveHistory) == null || h.call(u, i)), r = [], i = [];
+  }, get: () => v };
+}
+const Dt = { class: "editor-container" }, Le = "​", De = "​", Pt = /* @__PURE__ */ Re({
+  __name: "TemplateEditor",
+  props: {
+    modelValue: { default: () => [] },
+    modelModifiers: {}
+  },
+  emits: /* @__PURE__ */ lt(["submit"], ["update:modelValue"]),
+  setup(a, { expose: u, emit: r }) {
+    const i = typeof window.ShadowRoot.prototype.getSelection == "function", v = typeof window.Selection.prototype.getComposedRanges == "function";
+    function p() {
+      const e = navigator.userAgent;
+      return e.includes("Safari") && !e.includes("Chrome") && !e.includes("Chromium") && !e.includes("CriOS");
+    }
+    const l = p(), f = () => Math.random().toString(36).substring(2, 15), T = rt(a, "modelValue"), g = r, I = D(0), h = (e) => e.map((t, s) => ({
+      id: `id-${s}`,
+      ...t.type === "template" ? { ...t, prefix: Le, suffix: De } : t
+    })), $ = (e) => e.map((t) => ({ type: t.type, content: t.content })), x = D(h(T.value || [])), _ = P(() => x.value.map((e) => e.type === "template" ? [
+      { id: e.id, type: "prefix", content: e.prefix },
+      { id: e.id, type: "template", content: e.content },
+      { id: e.id, type: "suffix", content: e.suffix }
+    ] : [e]).flat()), F = P(() => x.value.map((e) => e.type === "text" ? e : l ? {
+      id: e.id,
+      type: "block",
+      asChild: !0,
+      content: [
+        { id: e.id, type: "prefix", content: e.prefix },
+        {
+          id: e.id,
+          type: "block",
+          content: [
+            { id: e.id, type: "template", content: e.content },
+            { id: e.id, type: "suffix", content: e.suffix }
+          ]
+        }
+      ]
+    } : {
+      id: e.id,
+      type: "block",
+      asChild: !0,
+      content: [
+        {
+          id: e.id,
+          type: "block",
+          content: [
+            { id: e.id, type: "prefix", content: e.prefix },
+            { id: e.id, type: "template", content: e.content }
+          ]
+        },
+        { id: e.id, type: "suffix", content: e.suffix }
+      ]
+    })), L = D(null), G = (e) => {
+      const t = Date.now(), s = JSON.stringify(e);
+      return `${t}:${s}`;
+    }, U = (e) => {
+      const t = parseInt(e.slice(0, 13)), s = JSON.parse(e.slice(14));
+      return {
+        timestamp: t,
+        data: s
+      };
+    }, H = /* @__PURE__ */ new Map(), y = Lt(G(x.value), {
+      onRemoveHistory: (e) => {
+        for (const t of e)
+          H.delete(t);
       }
-      s.removeAllRanges(), s.addRange(g), e.focus && e.focus();
     });
-  }, L = () => {
-    W(() => {
-      const e = t.value;
-      if (e) {
-        const l = document.createRange(), n = z(e);
-        l.selectNodeContents(e), l.collapse(!1), n && (n.removeAllRanges(), n.addRange(l)), e.focus();
+    oe(
+      () => T.value,
+      (e) => {
+        x.value = h(e || []), y.commit(G(x.value));
+      },
+      { deep: !0 }
+    );
+    const N = (e, t = document.body) => t.contains(e) ? e instanceof HTMLElement && e.dataset.id ? e : e.parentElement ? N(e.parentElement, t) : null : null, V = (e) => e === L.value, Q = (e) => {
+      const t = window.getSelection();
+      if (!t)
+        return null;
+      const s = t.rangeCount > 0 ? t.getRangeAt(0) : null, c = e.getRootNode();
+      if (!(c instanceof ShadowRoot))
+        return s;
+      if (v) {
+        const o = t.getComposedRanges(l ? c : { shadowRoots: [c] });
+        return (o == null ? void 0 : o[0]) ?? null;
       }
-    });
-  }, E = (e, l) => {
-    const n = t.value;
-    if (!n) return null;
-    n.innerHTML = "";
-    let s = null;
-    if (!l || l === a.template)
-      e.forEach((g) => {
-        if (g.type === "field") {
-          const _ = r(g.content), A = c(g.content, _);
-          n.appendChild(A);
-          const M = ye();
-          n.appendChild(M), s || (s = A);
-        } else
-          n.appendChild(document.createTextNode(g.content));
-      }), a.initialValues && Object.keys(a.initialValues).length > 0 && W(() => {
-        const g = i();
-        g !== a.value && (a.onValueChange(g), a.onInput(g));
-      });
-    else {
-      const g = v(e, l);
-      g.success ? g.elements.forEach((_) => {
-        if (n.appendChild(_.node), _.isField) {
-          const A = ye();
-          n.appendChild(A);
-        }
-        _.isField && !s && (s = _.node);
-      }) : (n.appendChild(document.createTextNode(l)), s = null);
-    }
-    return s;
-  }, v = (e, l) => {
-    const n = [];
-    let s = 0, g = 0, _ = !0;
-    for (; g < e.length && s <= l.length && _; ) {
-      const A = e[g];
-      if (A.type === "text")
-        l.substring(s).startsWith(A.content) ? (n.push({
-          node: document.createTextNode(A.content),
-          isField: !1
-        }), s += A.content.length, g++) : _ = !1;
-      else {
-        let M = "";
-        const j = e.find((B, X) => X > g && B.type === "text");
-        if (j) {
-          const B = l.substring(s), X = B.indexOf(j.content);
-          X !== -1 ? (M = B.substring(0, X), s += M.length) : _ = !1;
-        } else
-          M = l.substring(s), s = l.length;
-        if (_) {
-          const B = c(A.content, M);
-          n.push({ node: B, isField: !0 }), g++;
-        }
+      if (i) {
+        const o = c.getSelection();
+        return o.rangeCount > 0 ? o.getRangeAt(0) : null;
       }
-    }
-    if (_ && g < e.length)
-      for (let A = g; A < e.length; A++) {
-        const M = e[A];
-        if (M.type === "field") {
-          const j = !a.value || a.value === "" ? r(M.content) : "", B = c(M.content, j);
-          n.push({ node: B, isField: !0 });
-        } else
-          n.push({
-            node: document.createTextNode(M.content),
-            isField: !1
-          });
+      return s;
+    }, z = (e, t) => {
+      var c;
+      if (!e.firstChild || e.firstChild.nodeType !== Node.TEXT_NODE)
+        return console.warn("el.firstChild is not a text node. set anchor and focus to the element with offset 0", e), { node: e, offset: 0 };
+      const s = ((c = e.firstChild.textContent) == null ? void 0 : c.length) ?? 0;
+      return t > s && console.warn("offset is too large", { offset: t, el: e }), { node: e.firstChild, offset: Math.min(t, s) };
+    }, ee = (e, t, s, c) => {
+      const o = window.getSelection();
+      if (!o)
+        return;
+      const { node: d, offset: b } = z(e, t);
+      if (!s) {
+        o.setBaseAndExtent(d, b, d, b);
+        return;
       }
-    return { success: _, elements: n };
-  }, R = () => {
-    if (!t.value) return;
-    a.isInternalUpdate = !0;
-    const e = u(a.template), l = E(e, a.value);
-    o(), W(() => {
-      if (S(), l) {
-        const n = l.textContent || "", s = J(n);
-        s && s.trim() !== "" ? b(l, "inside", !1) : b(l, "inside", !0);
+      const { node: S, offset: C } = z(s, c ?? 0);
+      o.setBaseAndExtent(d, b, S, C);
+    }, R = (e, t) => {
+      const s = f(), c = { id: s, type: "text", content: e };
+      if (t) {
+        const o = x.value.findIndex((d) => d.id === t);
+        o !== -1 ? x.value = x.value.slice(0, o + 1).concat(c).concat(x.value.slice(o + 1)) : console.warn(`can not find item with id: ${t}`);
       } else
-        L();
-      a.isInternalUpdate = !1;
-    });
-  }, w = () => {
-    if (a.isComposing) return;
-    $(), C(), h(), S();
-    const e = i();
-    e !== a.value && (a.onValueChange(e), a.onInput(e)), o(e), e === "" && t.value && Array.from(t.value.childNodes).every((n) => n.nodeType === Node.ELEMENT_NODE && n.classList.contains("template-field") ? Et(n) : !!(n.nodeType === Node.TEXT_NODE && ee(n.textContent || ""))) && $();
-  }, h = () => {
-    if (!t.value) return;
-    Tt(t.value), t.value.querySelectorAll(".template-field").forEach((l) => {
-      Ve(l);
-    });
-  }, $ = () => {
-    if (!t.value) return;
-    const e = [];
-    t.value.childNodes.forEach((l) => {
-      if (l.nodeType === Node.TEXT_NODE) {
-        const n = l.textContent || "";
-        if (ee(n)) {
-          const s = l.previousSibling;
-          if (s && s.nodeType === Node.ELEMENT_NODE && s.classList.contains("template-field"))
-            return;
-        }
-        (n.trim() === "" || ee(n)) && e.push(l);
-      } else l.nodeType === Node.ELEMENT_NODE && l.tagName.toLowerCase() === "br" && e.push(l);
-    }), e.forEach((l) => {
-      l.parentNode && l.parentNode.removeChild(l);
-    });
-  }, V = (e) => {
-    if (!a.template || !a.initialValues)
-      return "字段";
-    for (const [l, n] of Object.entries(a.initialValues))
-      if (n === e)
-        return l;
-    return e.length <= 2 || /^[[\]{}()]+$/.test(e) || e.includes("[") && e.includes("]") ? e : "字段";
-  }, H = (e) => {
-    const l = e.getAttribute("data-placeholder");
-    if (l)
-      return l;
-    const n = e.getAttribute("title") || e.getAttribute("data-field") || e.getAttribute("data-key") || e.getAttribute("placeholder") || "";
-    if (n)
-      return n;
-    const s = e.textContent || "";
-    return V(s);
-  }, C = () => {
-    if (!t.value) return;
-    t.value.querySelectorAll("span").forEach((l) => {
-      const n = l, s = n.style, g = n.classList.contains("template-field"), _ = n.hasAttribute("data-placeholder");
-      if (g && _)
+        x.value.unshift(c);
+      J(() => {
+        var d;
+        const o = (d = L.value) == null ? void 0 : d.querySelector(`[data-id="${s}"][data-type="text"]`);
+        o && ee(o, e.length);
+      }), T.value = $(x.value);
+    }, K = D({
+      hasStarted: !1,
+      range: null
+    }), re = (e) => {
+      var S;
+      const t = e;
+      e.preventDefault();
+      const { inputType: s } = t, c = (t.data || ((S = t.dataTransfer) == null ? void 0 : S.getData("text/plain")) || "").replace(Le, "").replace(De, ""), o = t.getTargetRanges()[0];
+      if (!o) {
+        console.warn("range is null", o);
         return;
-      const A = s.backgroundColor && // 标准格式
-      (s.backgroundColor === "rgba(0, 0, 0, 0.05)" || s.backgroundColor === "rgba(0, 0, 0, 0.08)" || // 可能的变体格式
-      s.backgroundColor.includes("rgba(0, 0, 0, 0.05)") || s.backgroundColor.includes("rgba(0, 0, 0, 0.08)") || // 十六进制或其他可能的格式
-      s.backgroundColor.toLowerCase().includes("0.05") || s.backgroundColor.toLowerCase().includes("0.08")), M = s.borderRadius === "4px" || s.padding === "3px 8px" || s.margin === "0px 2px" || s.whiteSpace === "nowrap" && s.padding && s.margin;
-      if (A || M || _) {
-        if (n.className = "template-field", !n.getAttribute("data-placeholder")) {
-          const B = H(n);
-          B && n.setAttribute("data-placeholder", B);
+      }
+      const d = [
+        "insertText",
+        "insertFromPaste",
+        "insertReplacementText",
+        "deleteContentBackward",
+        "deleteContentForward",
+        "deleteWordBackward",
+        "deleteWordForward",
+        "deleteSoftLineBackward",
+        "deleteSoftLineForward",
+        "deleteByCut"
+      ], b = Q(L.value);
+      if (d.includes(s)) {
+        if (c && V(o.startContainer) && V(o.endContainer)) {
+          R(c), b && H.set(y.get(), E(b));
+          return;
         }
-        n.removeAttribute("style");
-        const j = n.textContent || "";
-        f(n, j);
+        const C = E(o);
+        C.startId && C.endId ? (me(C, s, c), b && H.set(y.get(), E(b))) : console.warn("range is not valid, range:", C);
+      } else s === "insertCompositionText" && K.value.hasStarted && (K.value = { hasStarted: !1, range: E(o) });
+    }, E = (e) => {
+      const t = N(e.startContainer, L.value), s = N(e.endContainer, L.value);
+      return {
+        collapsed: e.collapsed,
+        endContainer: e.endContainer,
+        endId: s == null ? void 0 : s.dataset.id,
+        endOffset: e.endOffset,
+        endType: s == null ? void 0 : s.dataset.type,
+        startContainer: e.startContainer,
+        startId: t == null ? void 0 : t.dataset.id,
+        startOffset: e.startOffset,
+        startType: t == null ? void 0 : t.dataset.type
+      };
+    }, te = (e, t, s, c) => e.slice(0, s) + t + e.slice(c), me = (e, t, s) => {
+      const c = we(e);
+      if (!Array.isArray(c) || c.length === 0)
+        return;
+      const o = _e(c, e, t, s);
+      if (o.some((S) => S.tag === "new")) {
+        const { afterId: S, content: C } = o[0];
+        R(C, S);
+        return;
       }
-    });
-  }, S = () => {
-    if (!t.value) return;
-    t.value.querySelectorAll(".template-field").forEach((l) => {
-      const n = l.textContent || "";
-      f(l, n);
-    });
-  };
-  return {
-    // 状态
-    hasContent: m,
-    // 解析和DOM操作
-    parseTemplateToParts: u,
-    getValueFromDOM: i,
-    getInitialContentForField: r,
-    createFieldElement: c,
-    // 光标操作
-    setCursorTo: b,
-    setCursorToEnd: L,
-    // DOM更新
-    updateEditorDOM: R,
-    renderTemplateToDOM: E,
-    // 事件处理
-    handleInput: w,
-    checkHasContent: o,
-    cleanupEmptyTextNodes: $,
-    // 推断 placeholder
-    inferPlaceholderForContent: V,
-    extractPlaceholderFromElement: H,
-    // 方法
-    resetFields: () => {
-      if (!t.value) return;
-      a.isInternalUpdate = !0;
-      const e = t.value;
-      e.innerHTML = "";
-      const l = u(a.template);
-      let n = "";
-      l.forEach((s) => {
-        if (s.type === "field") {
-          const g = r(s.content), _ = c(s.content, g);
-          g && (n += g), e.appendChild(_);
-        } else
-          e.appendChild(document.createTextNode(s.content)), n += s.content;
-      }), a.onValueChange(n), L(), o(n), W(() => {
-        a.isInternalUpdate = !1;
+      const d = o, b = [];
+      for (const [S, C] of d.entries()) {
+        const A = x.value.find(($e) => $e.id === C.id), ue = S === 0 ? s : "";
+        A ? A.type === "text" ? A.content = te(A.content, ue, C.startOffset, C.endOffset) : A.type === "template" ? C.type === "prefix" || C.type === "suffix" ? C.startOffset === 0 && C.endOffset === 1 && ue.length === 0 ? A[C.type] = "" : console.warn(`${C.type} can not be inserted text. it only can be deleted`, C) : C.startOffset < 0 || C.endOffset > A.content.length ? b.push(A.id) : A.content = te(A.content, ue, C.startOffset, C.endOffset) : console.warn("dataItem.type is not text or template", A) : console.warn("can not find dataItem", C);
+      }
+      x.value = x.value.filter((S) => !b.includes(S.id)), x.value = x.value.filter((S) => S.type === "text" ? S.content.length > 0 : [S.prefix, S.suffix, S.content].join("").length > 0);
+      for (const S of x.value.filter((C) => C.type === "template"))
+        S.prefix.length === 0 && (S.prefix = Le), S.suffix.length === 0 && (S.suffix = De);
+      d.length > 0 && Oe(d, s), T.value = $(x.value);
+    }, Oe = (e, t) => {
+      const s = e[0], c = `[data-id="${s.id}"][data-type="${s.type}"]`, o = e.slice(1).map((d) => `[data-id="${d.id}"][data-type="${d.type}"]`);
+      J(() => {
+        var b, S;
+        const d = (b = L.value) == null ? void 0 : b.querySelector(c);
+        if (d)
+          ee(d, s.startOffset + t.length);
+        else if (t.length === 0)
+          for (const C of o) {
+            const A = (S = L.value) == null ? void 0 : S.querySelector(C);
+            if (A) {
+              ee(A, 0);
+              break;
+            }
+          }
+        else
+          console.warn(`can not find el with selector: ${c}`);
       });
-    },
-    activateFirstField: () => {
-      var l;
-      const e = (l = t.value) == null ? void 0 : l.querySelector(".template-field");
-      e ? b(e, "inside", !1) : L();
-    },
-    // 选项更新
-    updateOptions: x
-  };
-}
-const At = /* @__PURE__ */ be({
-  __name: "TemplateEditor",
-  props: /* @__PURE__ */ De({
-    value: {},
-    autofocus: { type: Boolean }
-  }, {
-    value: { default: "" },
-    valueModifiers: {}
-  }),
-  emits: /* @__PURE__ */ De(["input", "content-status", "submit", "focus", "blur", "empty-content"], ["update:value"]),
-  setup(t, { expose: y, emit: m }) {
-    const a = rt(t, "value"), x = t, u = m, i = I(null), r = I(""), c = I({}), f = I(!1), p = I(!1), o = Ot(i, {
-      template: r.value,
-      value: a.value,
-      initialValues: c.value,
-      isInternalUpdate: f,
-      isComposing: p,
-      onValueChange: (C) => {
-        if (a.value !== C) {
-          const S = f.value;
-          f.value = !0, a.value = C, W(() => {
-            f.value = S;
-          });
+    }, we = (e) => {
+      const t = _.value.findIndex((b) => b.id === e.startId && b.type === e.startType), s = _.value.findIndex((b) => b.id === e.endId && b.type === e.endType);
+      if (t === -1 || s === -1 || t > s)
+        return console.warn("startIndex or endIndex is -1, or startIndex > endIndex. ", { range: e }), null;
+      const c = _.value[t], o = _.value[s];
+      if (t === s)
+        return [
+          {
+            id: c.id,
+            type: c.type,
+            startOffset: e.startOffset,
+            endOffset: e.endOffset
+          }
+        ];
+      const d = [
+        {
+          id: c.id,
+          type: c.type,
+          startOffset: e.startOffset,
+          endOffset: c.content.length
         }
-      },
-      onInput: (C) => {
-        u("input", C);
-      },
-      onContentStatusChange: (C) => u("content-status", C),
-      onSubmit: (C) => u("submit", C)
-    }), b = Nt({
-      editor: i,
-      isComposing: p,
-      getValueFromDOM: o.getValueFromDOM,
-      handleInput: o.handleInput,
-      onSubmit: (C) => u("submit", C)
-    }), L = (C, S) => {
-      let N = C;
-      return Object.entries(S).forEach(([q, e]) => {
-        const l = `[${q}]`;
-        N = N.replace(new RegExp(l.replace(/[[\]]/g, "\\$&"), "g"), e);
-      }), N;
-    }, E = (C) => {
-      f.value = !0, r.value = C.template, c.value = C.initialValues || {};
-      const S = L(r.value, c.value);
-      o.updateOptions({
-        template: r.value,
-        value: S,
-        // 使用新生成的内容而不是旧的inputValue
-        initialValues: c.value
-      }), o.updateEditorDOM(), a.value = S, W(() => {
-        f.value = !1;
-      });
-    }, v = () => {
-      p.value = !0;
-    }, R = () => {
-      p.value = !1, o.handleInput();
-    }, w = (C) => {
-      var q;
-      if (!i.value) return;
-      const S = C.target;
-      let N = null;
-      if (S.classList.contains("template-field") ? N = S : (q = S.parentElement) != null && q.classList.contains("template-field") && (N = S.parentElement), N && (!N.textContent || N.textContent.trim() === "")) {
-        const e = z(i.value), l = document.createRange();
-        e && (l.selectNodeContents(N), l.collapse(!0), e.removeAllRanges(), e.addRange(l), N.focus(), C.preventDefault(), C.stopPropagation());
+      ];
+      for (let b = t + 1; b < s; b++) {
+        const S = _.value[b];
+        d.push({
+          id: S.id,
+          type: S.type,
+          startOffset: 0,
+          endOffset: S.content.length
+        });
       }
-    }, h = (C) => {
-      if (typeof ShadowRoot.prototype.getSelection != "function")
-        return;
-      C.preventDefault();
-      const S = C.clipboardData;
-      if (!S) return;
-      const N = S.getData("text/html"), q = S.getData("text/plain");
-      if (N) {
-        const e = document.createElement("div");
-        e.innerHTML = N;
-        const l = e.querySelectorAll("span");
-        let n = !1;
-        if (l.forEach((s) => {
-          const g = s, _ = g.style, A = g.classList.contains("template-field"), M = g.hasAttribute("data-placeholder"), j = _.backgroundColor && // 标准格式
-          (_.backgroundColor === "rgba(0, 0, 0, 0.05)" || _.backgroundColor === "rgba(0, 0, 0, 0.08)" || // 可能的变体格式
-          _.backgroundColor.includes("rgba(0, 0, 0, 0.05)") || _.backgroundColor.includes("rgba(0, 0, 0, 0.08)") || // 十六进制或其他可能的格式
-          _.backgroundColor.toLowerCase().includes("0.05") || _.backgroundColor.toLowerCase().includes("0.08")), B = _.borderRadius === "4px" || _.padding === "3px 8px" || _.margin === "0px 2px" || _.whiteSpace === "nowrap";
-          if (A || M || j || B) {
-            if (n = !0, g.className = "template-field", !g.getAttribute("data-placeholder")) {
-              const X = o.extractPlaceholderFromElement(g);
-              X && g.setAttribute("data-placeholder", X);
-            }
-            g.removeAttribute("style");
+      return d.push({
+        id: o.id,
+        type: o.type,
+        startOffset: 0,
+        endOffset: e.endOffset
+      }), d;
+    }, _e = (e, t, s, c) => {
+      const o = e[0];
+      if (o.type !== "prefix" && o.type !== "suffix")
+        return e;
+      if (e.length === 1) {
+        if (t.collapsed)
+          if (t.startOffset === 0) {
+            const d = de(o, c);
+            return d ? [d] : [];
+          } else {
+            const d = ie(o, c);
+            return d ? [d] : [];
+          }
+        if (s.startsWith("insert"))
+          if (l) {
+            const d = de(o, c);
+            return d ? [d] : [];
+          } else {
+            const d = ie(o, c);
+            return d ? [d] : [];
+          }
+        if (s.startsWith("delete")) {
+          if (s.includes("Backward")) {
+            const d = de(o, c, 1);
+            return d ? [d] : [];
+          } else if (s.includes("Forward")) {
+            const d = ie(o, c, 1);
+            return d ? [d] : [];
           }
-        }), n) {
-          $(e);
-          return;
         }
       }
-      q && V(q);
-    }, $ = (C) => {
-      const S = z(i.value);
-      if (S && S.rangeCount > 0) {
-        const N = S.getRangeAt(0);
-        N.deleteContents();
-        const q = document.createDocumentFragment();
-        for (; C.firstChild; )
-          q.appendChild(C.firstChild);
-        N.insertNode(q), N.collapse(!1), S.removeAllRanges(), S.addRange(N), H();
+      return c.length > 0 ? e.slice(1) : e;
+    }, de = (e, t, s = 0) => {
+      const c = _.value.findIndex((o) => o.id === e.id && o.type === e.type);
+      if (c > 0) {
+        const o = _.value[c - 1], { id: d, type: b, content: S } = o;
+        if (b === "text" || b === "template")
+          return {
+            id: d,
+            type: b,
+            startOffset: S.length - s,
+            endOffset: S.length
+          };
+        if (t.length > 0)
+          return { tag: "new", afterId: d, type: "text", content: t };
+        if (console.warn("the previous item is not text or template", { current: e, previous: o }), s === 1)
+          return { ...e, endOffset: e.startOffset };
+      } else return t.length > 0 ? { tag: "new", type: "text", content: t } : (console.warn("the previous item of current is not found", { current: e }), null);
+      return e;
+    }, ie = (e, t, s = 0) => {
+      const c = _.value.findIndex((o) => o.id === e.id && o.type === e.type);
+      if (c < _.value.length - 1) {
+        const o = _.value[c + 1], { id: d, type: b } = o;
+        if (b === "text" || b === "template")
+          return {
+            id: d,
+            type: b,
+            startOffset: 0,
+            endOffset: 0 + s
+          };
+        if (t.length > 0)
+          return { tag: "new", afterId: e.id, type: "text", content: t };
+        if (console.warn("the next item is not text or template", { current: e, next: o }), s === 1)
+          return { ...e, startOffset: e.endOffset };
+      } else return t.length > 0 ? { tag: "new", afterId: e.id, type: "text", content: t } : (console.warn("the next item of current is not found", { current: e }), null);
+      return e;
+    }, fe = () => {
+      K.value = { hasStarted: !0, range: null };
+    }, Te = (e) => {
+      const t = K.value.range;
+      t ? (e.data && V(t.startContainer) && V(t.endContainer) ? (R(e.data), H.set(y.get(), E(t))) : t.startId && t.endId ? (me(t, "insertCompositionText", e.data), H.set(y.get(), E(t))) : console.warn("range is not valid, range:", t), I.value++) : console.warn("range is null, compositionEnd:", e), K.value = { hasStarted: !1, range: null };
+    }, Y = (() => {
+      const e = navigator.userAgent.toLowerCase();
+      return /macintosh|mac os x|iphone|ipad|ipod/.test(e);
+    })(), Se = (e) => {
+      const t = Y && e.metaKey && !e.shiftKey && e.key.toLowerCase() === "z" || // Cmd+Z
+      !Y && e.ctrlKey && !e.shiftKey && e.key.toLowerCase() === "z", s = Y && e.metaKey && e.shiftKey && e.key.toLowerCase() === "z" || // Cmd+Shift+z
+      !Y && e.ctrlKey && (e.key.toLowerCase() === "y" || e.shiftKey && e.key.toLowerCase() === "z"), c = e.key.toLowerCase() === "enter";
+      if (t) {
+        e.preventDefault();
+        const o = Q(L.value);
+        o && H.set(y.get(), E(o));
+        const d = y.undo();
+        d && pe(d);
       }
-    }, V = (C) => {
-      const S = z(i.value);
-      if (S && S.rangeCount > 0) {
-        const N = S.getRangeAt(0);
-        N.deleteContents(), N.insertNode(document.createTextNode(C)), N.collapse(!1), S.removeAllRanges(), S.addRange(N), H();
+      if (s) {
+        e.preventDefault();
+        const o = y.redo();
+        o && pe(o);
       }
-    }, H = () => {
-      p.value = !1, W(() => {
-        o.handleInput();
-        const C = o.getValueFromDOM();
-        if (C !== a.value) {
-          const S = f.value;
-          f.value = !0, a.value = C, u("input", C), W(() => {
-            f.value = S;
-          });
-        }
-        setTimeout(() => {
-          const S = o.getValueFromDOM();
-          S !== a.value && (f.value = !0, a.value = S, u("input", S), W(() => {
-            f.value = !1;
-          }));
-        }, 50);
-      });
-    };
-    return ut(() => {
-      r.value && o.updateEditorDOM(), x.autofocus && i.value && o.setCursorToEnd();
-    }), te(
-      () => r.value,
-      () => {
-        f.value || (o.updateOptions({
-          template: r.value,
-          value: a.value,
-          initialValues: c.value
-        }), o.updateEditorDOM());
+      c && (e.preventDefault(), g("submit"));
+    }, pe = (e) => {
+      const { data: t } = U(e);
+      if (x.value = t, H.has(e)) {
+        const s = H.get(e);
+        J(() => {
+          const c = L.value.querySelector(`[data-id="${s.startId}"][data-type="${s.startType}"]`), o = L.value.querySelector(`[data-id="${s.endId}"][data-type="${s.endType}"]`);
+          c && ee(c, s.startOffset, o, s.endOffset);
+        });
       }
-    ), te(
-      () => c.value,
-      () => {
-        f.value || (o.updateOptions({
-          template: r.value,
-          value: a.value,
-          initialValues: c.value
-        }), o.updateEditorDOM());
+    };
+    return u({
+      clearHistory: () => {
+        y.clear(), H.clear();
       },
-      { deep: !0 }
-    ), te(
-      () => a.value,
-      (C) => {
-        f.value || (o.updateOptions({
-          template: r.value,
-          value: C,
-          initialValues: c.value
-        }), o.updateEditorDOM()), (!C || C.trim() === "") && u("empty-content");
+      activateFirstField: () => {
+        if (!L.value)
+          return;
+        const e = x.value.find((t) => t.type === "template");
+        e && J(() => {
+          var s, c;
+          const t = (s = L.value) == null ? void 0 : s.querySelector(`[data-id="${e.id}"][data-type="template"]`);
+          if (t) {
+            const o = ((c = t.textContent) == null ? void 0 : c.length) || 0;
+            ee(t, o);
+          }
+        });
       }
-    ), y({
-      focus: () => {
-        var C;
-        (C = i.value) == null || C.focus(), o.setCursorToEnd();
-      },
-      resetFields: o.resetFields,
-      activateFirstField: o.activateFirstField,
-      getValueFromDOM: o.getValueFromDOM,
-      setTemplate: E
-    }), (C, S) => (D(), O("div", {
-      class: "template-editor",
-      ref_key: "contentEditableRef",
-      ref: i,
-      contenteditable: "true",
-      onInput: S[0] || (S[0] = //@ts-ignore
-      (...N) => T(o).handleInput && T(o).handleInput(...N)),
-      onKeydown: S[1] || (S[1] = //@ts-ignore
-      (...N) => T(b).handleTemplateKeyDown && T(b).handleTemplateKeyDown(...N)),
-      onClick: w,
-      onCompositionstart: v,
-      onCompositionend: R,
-      onFocus: S[2] || (S[2] = (N) => C.$emit("focus", N)),
-      onBlur: S[3] || (S[3] = (N) => C.$emit("blur", N)),
-      onPaste: h
-    }, null, 544));
+    }), (e, t) => (m(), O("div", Dt, [
+      (m(), O("div", {
+        contenteditable: "true",
+        ref_key: "editorRef",
+        ref: L,
+        key: I.value,
+        class: "editor",
+        onBeforeinput: re,
+        onCompositionstart: fe,
+        onCompositionend: Te,
+        onKeydown: Se
+      }, [
+        (m(!0), O(ce, null, ye(F.value, (s) => (m(), q(Et, ge({
+          key: `${s.id}-${s.type}`
+        }, { ref_for: !0 }, s), null, 16))), 128))
+      ], 32))
+    ]));
   }
-}), Mt = ["data-theme"], Vt = { class: "tiny-sender__container" }, Bt = {
+}), Ft = /* @__PURE__ */ je(Pt, [["__scopeId", "data-v-7353287c"]]), Kt = ["data-theme"], Wt = { class: "tiny-sender__container" }, At = {
   key: 0,
   class: "tiny-sender__header-slot"
-}, Wt = {
+}, Ht = {
   key: 0,
   class: "tiny-sender__prefix-slot"
-}, $t = { class: "tiny-sender__content-area" }, Pt = {
+}, Nt = { class: "tiny-sender__content-area" }, Vt = {
   key: 0,
   class: "tiny-sender__decorative-content"
-}, Kt = {
+}, Mt = {
   key: 2,
   class: "tiny-sender__input-field-wrapper"
-}, Ht = {
+}, qt = {
   key: 0,
   class: "tiny-sender__completion-placeholder"
-}, qt = { class: "user-input-mirror" }, Xt = {
+}, Ut = { class: "user-input-mirror" }, zt = {
   key: 0,
   class: "tiny-sender__tab-hint"
-}, zt = {
+}, jt = {
   key: 1,
   class: "tiny-sender__actions-slot"
-}, jt = { class: "tiny-sender__footer-left" }, Ut = { class: "tiny-sender__footer-right" }, Zt = { class: "real-word-length" }, Gt = {
+}, Xt = { class: "tiny-sender__footer-left" }, Jt = { class: "tiny-sender__footer-right" }, Gt = { class: "real-word-length" }, Qt = {
   key: 1,
   class: "tiny-sender__toolbar"
-}, Jt = { class: "tiny-sender__buttons-container" }, Qt = {
+}, Yt = { class: "tiny-sender__buttons-container" }, Zt = {
   key: 1,
   class: "tiny-sender__footer-slot"
-}, Yt = ["onMouseenter", "onMousedown"], en = { class: "suggestion-item__text" }, tn = {
+}, en = ["onMouseenter", "onMousedown"], tn = { class: "suggestion-item__text" }, nn = {
   key: 0,
   class: "tiny-sender__error"
-}, pe = /* @__PURE__ */ be({
+}, Ie = /* @__PURE__ */ Re({
   __name: "index",
   props: {
     autofocus: { type: Boolean, default: !1 },
@@ -1078,360 +872,367 @@ const At = /* @__PURE__ */ be({
     theme: { default: "light" },
     template: { default: "" },
     hasContent: { type: Boolean, default: void 0 },
-    templateInitialValues: { default: () => ({}) },
+    templateData: { default: () => [] },
     stopText: { default: "" }
   },
-  emits: ["update:modelValue", "submit", "clear", "speech-start", "speech-end", "speech-interim", "speech-error", "suggestion-select", "focus", "blur", "escape-press", "cancel", "reset-template"],
-  setup(t, { expose: y, emit: m }) {
-    const a = t, x = m, u = I(null), i = I(null), r = I(null), c = I(null), f = I(null), p = I(!1), { inputValue: o, isComposing: b, clearInput: L } = wt(a, x), {
-      showSuggestionsPopup: E,
-      completionPlaceholder: v,
-      showTabHint: R,
-      suggestionsListRef: w,
-      filteredSuggestions: h,
-      activeSuggestion: $,
-      isItemHighlighted: V,
-      updateSuggestionsState: H,
-      selectSuggestion: C,
-      acceptCurrentSuggestion: S,
-      closeSuggestionsPopup: N,
-      navigateSuggestions: q,
-      handleSuggestionItemHover: e,
-      handleSuggestionItemLeave: l,
-      highlightSuggestionText: n
-    } = Rt(a, x, o, b), s = I(a.mode), g = I(!1), _ = () => {
-      s.value === "single" && (s.value = "multiple", W(() => {
+  emits: ["update:modelValue", "update:templateData", "submit", "clear", "speech-start", "speech-end", "speech-interim", "speech-error", "suggestion-select", "focus", "blur", "escape-press", "cancel", "reset-template"],
+  setup(a, { expose: u, emit: r }) {
+    const i = a, v = r, p = D(null), l = D(null), f = D(null), T = D(null), g = D(null), I = P(() => i.templateData && i.templateData.length > 0), { inputValue: h, isComposing: $, clearInput: x } = _t(i, v), {
+      showSuggestionsPopup: _,
+      completionPlaceholder: F,
+      showTabHint: L,
+      suggestionsListRef: G,
+      filteredSuggestions: U,
+      activeSuggestion: H,
+      isItemHighlighted: y,
+      updateSuggestionsState: N,
+      selectSuggestion: V,
+      acceptCurrentSuggestion: Q,
+      closeSuggestionsPopup: z,
+      navigateSuggestions: ee,
+      handleSuggestionItemHover: R,
+      handleSuggestionItemLeave: K,
+      highlightSuggestionText: re
+    } = kt(i, v, h, $), E = D(i.mode), te = D(!1), me = () => {
+      E.value === "single" && (E.value = "multiple", J(() => {
         setTimeout(() => {
-          const d = document.querySelector(".tiny-textarea__inner");
-          if (d) {
-            d.style.whiteSpace = "pre-wrap";
-            const k = o.value.length;
-            d.focus(), d.setSelectionRange(k, k);
+          const n = document.querySelector(".tiny-textarea__inner");
+          if (n) {
+            n.style.whiteSpace = "pre-wrap";
+            const k = h.value.length;
+            n.focus(), n.setSelectionRange(k, k);
           }
         }, 50);
       }));
-    }, A = (d, k) => {
-      const F = document.createElement("span");
-      F.style.visibility = "hidden", F.style.position = "absolute", F.style.whiteSpace = "nowrap", F.style.font = k, F.textContent = d, document.body.appendChild(F);
-      const ne = F.offsetWidth;
-      return document.body.removeChild(F), ne;
-    }, M = () => {
-      var ce, Ne, xe;
-      if (a.mode !== "single" || !u.value || g.value || !i.value || !c.value) return;
-      const d = i.value.querySelector(".tiny-sender__content-area");
-      if (!d) return;
-      const k = ((Ne = (ce = u.value) == null ? void 0 : ce.querySelector) == null ? void 0 : Ne.call(ce, ".tiny-input__inner")) || d.querySelector(".tiny-input__inner"), F = f.value || i.value.querySelector(".tiny-sender__buttons-container");
+    }, Oe = (n, k) => {
+      const B = document.createElement("span");
+      B.style.visibility = "hidden", B.style.position = "absolute", B.style.whiteSpace = "nowrap", B.style.font = k, B.textContent = n, document.body.appendChild(B);
+      const ne = B.offsetWidth;
+      return document.body.removeChild(B), ne;
+    }, we = () => {
+      var Ce, Ae, He;
+      if (i.mode !== "single" || !p.value || te.value || !l.value || !T.value) return;
+      const n = l.value.querySelector(".tiny-sender__content-area");
+      if (!n) return;
+      const k = ((Ae = (Ce = p.value) == null ? void 0 : Ce.querySelector) == null ? void 0 : Ae.call(Ce, ".tiny-input__inner")) || n.querySelector(".tiny-input__inner"), B = g.value || l.value.querySelector(".tiny-sender__buttons-container");
       if (!k) {
         console.warn("Cannot find input element for overflow check");
         return;
       }
-      const ne = k.getBoundingClientRect(), Z = F == null ? void 0 : F.getBoundingClientRect();
+      const ne = k.getBoundingClientRect(), j = B == null ? void 0 : B.getBoundingClientRect();
       if (ne.width === 0) {
-        setTimeout(() => M(), 50);
+        setTimeout(() => we(), 50);
         return;
       }
-      const ge = window.getComputedStyle(k).font, nt = A(o.value, ge), Te = (xe = i.value) == null ? void 0 : xe.classList.contains("tr-sender-compact"), st = Te ? 12 : 20, lt = ne.width, ot = (Z == null ? void 0 : Z.width) || 0, _e = lt - ot - st, at = Te ? 50 : 80;
-      nt > _e && _e > at && s.value === "single" && (g.value = !0, s.value = "multiple", W(() => {
-        u.value ? setTimeout(() => {
-          var ke;
-          const de = (ke = i.value) == null ? void 0 : ke.querySelector(".tiny-textarea__inner");
-          if (de) {
-            de.style.whiteSpace = "pre-wrap";
-            const Re = o.value.length;
-            de.focus(), de.setSelectionRange(Re, Re);
+      const Be = window.getComputedStyle(k).font, Qe = Oe(h.value, Be), Ke = (He = l.value) == null ? void 0 : He.classList.contains("tr-sender-compact"), Ye = Ke ? 12 : 20, Ze = ne.width, et = (j == null ? void 0 : j.width) || 0, We = Ze - et - Ye, tt = Ke ? 50 : 80;
+      Qe > We && We > tt && E.value === "single" && (te.value = !0, E.value = "multiple", J(() => {
+        p.value ? setTimeout(() => {
+          var Ne;
+          const ke = (Ne = l.value) == null ? void 0 : Ne.querySelector(".tiny-textarea__inner");
+          if (ke) {
+            ke.style.whiteSpace = "pre-wrap";
+            const Ve = h.value.length;
+            ke.focus(), ke.setSelectionRange(Ve, Ve);
           }
-          g.value = !1;
-        }, 300) : g.value = !1;
+          te.value = !1;
+        }, 300) : te.value = !1;
       }));
-    }, j = () => {
-      if (p.value && r.value)
-        Ce();
-      else if (u.value)
-        u.value.focus();
+    }, _e = () => {
+      if (I.value && f.value)
+        Fe();
+      else if (p.value)
+        p.value.focus();
+      else {
+        const n = document.querySelector(".tiny-input__inner");
+        n == null || n.focus();
+      }
+    }, de = () => {
+      if (p.value)
+        p.value.blur();
       else {
-        const d = document.querySelector(".tiny-input__inner");
-        d == null || d.focus();
+        const n = document.querySelector(".tiny-input__inner");
+        n == null || n.blur();
       }
-    }, B = () => {
-      p.value = !1, x("reset-template"), W(() => {
-        o.value === "" && (s.value = a.mode || "single"), setTimeout(() => {
-          j();
+    }, ie = () => {
+      var n;
+      v("update:templateData", []), (n = f.value) == null || n.clearHistory(), J(() => {
+        h.value === "" && (E.value = i.mode || "single"), setTimeout(() => {
+          _e();
         }, 50);
-      });
-    }, X = () => {
-      var d;
-      L(), p.value ? B() : (d = i.value) == null || d.focus(), W(() => {
-        o.value === "" && (s.value = a.mode || "single");
-      }), N();
-    }, Pe = (d) => {
-      x("update:modelValue", d);
-    }, Ce = () => {
-      r.value && r.value.activateFirstField();
-    }, Ke = (d, k) => {
-      p.value = !0, W(() => {
-        r.value && r.value.setTemplate({ template: d, initialValues: k });
-      });
-    }, He = K(() => {
-      const d = typeof a.speech == "object" ? a.speech : {};
+      }), z();
+    }, fe = () => {
+      var n;
+      x(), I.value ? ie() : (n = l.value) == null || n.focus(), J(() => {
+        h.value === "" && (E.value = i.mode || "single");
+      }), z();
+    }, Te = (n) => {
+      v("update:templateData", n);
+    };
+    oe(
+      () => i.templateData,
+      () => {
+        h.value = i.templateData.map((n) => n.content).join("");
+      },
+      { deep: !0 }
+    );
+    const Pe = P(() => {
+      const n = typeof i.speech == "object" ? i.speech : {};
       return {
-        ...d,
-        onStart: () => x("speech-start"),
-        onEnd: (k) => x("speech-end", k),
-        onInterim: (k) => x("speech-interim", k),
+        ...n,
+        onStart: () => v("speech-start"),
+        onEnd: (k) => v("speech-end", k),
+        onInterim: (k) => v("speech-interim", k),
         onFinal: (k) => {
-          if (d.autoReplace)
-            o.value = k;
+          if (n.autoReplace)
+            h.value = k;
           else {
-            const F = o.value;
-            F && k && !F.endsWith(" ") && !k.startsWith(" ") && F.length > 0 ? o.value = F + " " + k : o.value = F + k;
+            const B = h.value;
+            B && k && !B.endsWith(" ") && !k.startsWith(" ") && B.length > 0 ? h.value = B + " " + k : h.value = B + k;
           }
-          x("speech-end", k);
+          v("speech-end", k);
         },
         onError: (k) => {
-          et(k.message), x("speech-error", k);
+          Je(k.message), v("speech-error", k);
         }
       };
-    }), { speechState: ie, start: Se, stop: we } = xt(He.value), he = () => {
-      ie.isRecording ? we() : Se();
-    }, re = K(() => a.maxLength !== 1 / 0 && o.value.length > a.maxLength), { handleKeyPress: qe, triggerSubmit: me } = _t(
-      a,
-      x,
-      o,
-      b,
-      ie,
-      E,
+    }), { speechState: Y, start: Se, stop: pe } = bt(Pe.value), be = () => {
+      Y.isRecording ? pe() : Se();
+    }, he = P(() => i.maxLength !== 1 / 0 && h.value.length > i.maxLength), { handleKeyPress: e, triggerSubmit: t } = St(
+      i,
+      v,
+      h,
       $,
-      S,
-      N,
-      q,
+      Y,
+      _,
+      H,
+      Q,
+      z,
+      ee,
+      be,
       he,
-      re,
-      s,
-      _
-    ), Xe = (d) => {
-      x("focus", d), o.value && h.value.length > 0 && !a.template && (E.value = !0, R.value = !0);
-    }, ze = (d) => {
-      x("blur", d), N();
-    }, je = K(() => s.value === "multiple" ? "textarea" : "text"), Ue = K(
+      E,
+      me,
+      I,
+      ie
+    ), s = (n) => {
+      v("focus", n), h.value && U.value.length > 0 && !i.template && (_.value = !0, L.value = !0);
+    }, c = (n) => {
+      v("blur", n), z();
+    }, o = P(() => E.value === "multiple" ? "textarea" : "text"), d = P(
       () => ({
         display: "flex",
-        justifyContent: a.showWordLimit && a.maxLength !== 1 / 0 ? "space-between" : "flex-end",
+        justifyContent: i.showWordLimit && i.maxLength !== 1 / 0 ? "space-between" : "flex-end",
         alignItems: "center"
       })
-    ), Ze = ct(), Ge = K(() => !!Ze.decorativeContent), ue = K(() => a.disabled || Ge.value), Je = K(() => a.loading), Ee = K(() => a.hasContent !== void 0 ? a.hasContent : !!o.value), Qe = K(() => ({
-      "is-disabled": ue.value,
-      "is-loading": Je.value,
-      "has-error": !!ae.value,
-      "is-auto-switching": g.value
-    })), Ye = K(() => ({
-      width: ht(a.suggestionPopupWidth),
+    ), b = it(), S = P(() => !!b.decorativeContent), C = P(() => i.disabled || S.value), A = P(() => i.loading), ue = P(() => i.hasContent !== void 0 ? i.hasContent : !!h.value), $e = P(() => ({
+      "is-disabled": C.value,
+      "is-loading": A.value,
+      "has-error": !!ve.value,
+      "is-auto-switching": te.value
+    })), Xe = P(() => ({
+      width: wt(i.suggestionPopupWidth),
       maxWidth: "100%"
       // 确保不超出父容器宽度
-    })), ae = I(""), et = (d) => {
-      ae.value = d, setTimeout(() => ae.value = "", 5e3);
-    }, tt = () => {
-      b.value = !1, setTimeout(() => {
-        b.value = !1, H();
+    })), ve = D(""), Je = (n) => {
+      ve.value = n, setTimeout(() => ve.value = "", 5e3);
+    }, Ge = () => {
+      $.value = !1, setTimeout(() => {
+        $.value = !1, N();
       }, 50);
     };
-    return te(o, () => {
-      W(M), o.value === "" && a.mode === "single" && (s.value = "single");
-    }), te(
-      () => p.value,
-      (d) => {
-        d && (s.value = "multiple");
+    oe(h, () => {
+      J(we), h.value === "" && i.mode === "single" && (E.value = "single");
+    }), oe(
+      () => I.value,
+      (n) => {
+        n && (E.value = "multiple");
       }
-    ), y({
-      focus: j,
-      blur: () => {
-        if (u.value)
-          u.value.blur();
-        else {
-          const d = document.querySelector(".tiny-input__inner");
-          d == null || d.blur();
-        }
-      },
-      clear: X,
-      submit: me,
+    );
+    const Fe = () => {
+      f.value && f.value.activateFirstField();
+    };
+    return u({
+      focus: _e,
+      blur: de,
+      clear: fe,
+      submit: t,
       startSpeech: Se,
-      stopSpeech: we,
-      activateTemplateFirstField: Ce,
-      setTemplate: Ke
-    }), (d, k) => (D(), O("div", {
+      stopSpeech: pe,
+      activateTemplateFirstField: Fe
+    }), (n, k) => (m(), O("div", {
       ref_key: "senderRef",
-      ref: i,
-      class: oe(["tiny-sender", [Qe.value, `theme-${d.theme}`, `mode-${s.value}`]]),
-      "data-theme": d.theme
+      ref: l,
+      class: le(["tiny-sender", [$e.value, `theme-${n.theme}`, `mode-${E.value}`]]),
+      "data-theme": n.theme
     }, [
-      U("div", Vt, [
-        U("div", {
+      M("div", Wt, [
+        M("div", {
           class: "tiny-sender__input-wrapper",
           ref_key: "inputWrapperRef",
-          ref: c
+          ref: T
         }, [
-          G(ve, { name: "tiny-sender-slide-down" }, {
-            default: Y(() => [
-              d.$slots.header ? (D(), O("div", Bt, [
-                se(d.$slots, "header")
-              ])) : P("", !0)
+          X(Ee, { name: "tiny-sender-slide-down" }, {
+            default: Z(() => [
+              n.$slots.header ? (m(), O("div", At, [
+                ae(n.$slots, "header")
+              ])) : W("", !0)
             ]),
             _: 3
           }),
-          U("div", {
-            class: oe(["tiny-sender__input-row", { "has-prefix": d.$slots.prefix, "has-header": d.$slots.header }])
+          M("div", {
+            class: le(["tiny-sender__input-row", { "has-prefix": n.$slots.prefix, "has-header": n.$slots.header }])
           }, [
-            d.$slots.prefix ? (D(), O("div", Wt, [
-              se(d.$slots, "prefix")
-            ])) : P("", !0),
-            U("div", $t, [
-              d.$slots.decorativeContent ? (D(), O("div", Pt, [
-                se(d.$slots, "decorativeContent")
-              ])) : P("", !0),
-              p.value ? (D(), Q(At, {
+            n.$slots.prefix ? (m(), O("div", Ht, [
+              ae(n.$slots, "prefix")
+            ])) : W("", !0),
+            M("div", Nt, [
+              n.$slots.decorativeContent ? (m(), O("div", Vt, [
+                ae(n.$slots, "decorativeContent")
+              ])) : W("", !0),
+              I.value ? (m(), q(Ft, {
                 key: 1,
                 ref_key: "templateEditorRef",
-                ref: r,
-                value: T(o),
-                "onUpdate:value": k[0] || (k[0] = (F) => Fe(o) ? o.value = F : null),
-                onInput: Pe,
-                onEmptyContent: B
-              }, null, 8, ["value"])) : (D(), O("div", Kt, [
-                G(T(ft), {
+                ref: f,
+                "model-value": i.templateData,
+                "onUpdate:modelValue": Te,
+                onSubmit: w(t)
+              }, null, 8, ["model-value", "onSubmit"])) : (m(), O("div", Mt, [
+                X(w(dt), {
                   ref_key: "inputRef",
-                  ref: u,
-                  autosize: d.autoSize,
-                  type: je.value,
+                  ref: p,
+                  autosize: n.autoSize,
+                  type: o.value,
                   resize: "none",
-                  modelValue: T(o),
-                  "onUpdate:modelValue": k[1] || (k[1] = (F) => Fe(o) ? o.value = F : null),
-                  disabled: ue.value,
-                  placeholder: d.placeholder,
-                  autofocus: d.autofocus,
-                  onKeydown: T(qe),
-                  onCompositionstart: k[2] || (k[2] = (F) => b.value = !0),
-                  onCompositionend: tt,
-                  onFocus: Xe,
-                  onBlur: ze
+                  modelValue: w(h),
+                  "onUpdate:modelValue": k[0] || (k[0] = (B) => ut(h) ? h.value = B : null),
+                  disabled: C.value,
+                  placeholder: n.placeholder,
+                  autofocus: n.autofocus,
+                  onKeydown: w(e),
+                  onCompositionstart: k[1] || (k[1] = (B) => $.value = !0),
+                  onCompositionend: Ge,
+                  onFocus: s,
+                  onBlur: c
                 }, null, 8, ["autosize", "type", "modelValue", "disabled", "placeholder", "autofocus", "onKeydown"]),
-                T(v) && !T(b) ? (D(), O("div", Ht, [
-                  U("span", qt, le(T(o)), 1),
-                  Le(le(T(v)) + " ", 1),
-                  T(R) ? (D(), O("div", Xt, "TAB")) : P("", !0)
-                ])) : P("", !0)
+                w(F) && !w($) ? (m(), O("div", qt, [
+                  M("span", Ut, se(w(h)), 1),
+                  Me(se(w(F)) + " ", 1),
+                  w(L) ? (m(), O("div", zt, "TAB")) : W("", !0)
+                ])) : W("", !0)
               ]))
             ]),
-            s.value === "single" ? (D(), O("div", zt, [
-              U("div", {
+            E.value === "single" ? (m(), O("div", jt, [
+              M("div", {
                 class: "tiny-sender__buttons-container",
                 ref_key: "buttonsContainerRef",
-                ref: f
+                ref: g
               }, [
-                se(d.$slots, "actions"),
-                G(Be, {
-                  "allow-speech": d.allowSpeech,
-                  "allow-files": d.allowFiles,
-                  loading: d.loading,
-                  disabled: ue.value,
-                  "show-clear": d.clearable,
-                  "has-content": Ee.value,
-                  "speech-status": T(ie),
-                  "submit-type": d.submitType,
-                  "is-over-limit": re.value,
-                  "stop-text": d.stopText,
-                  onClear: X,
-                  onToggleSpeech: he,
-                  onSubmit: T(me),
-                  onCancel: k[3] || (k[3] = (F) => d.$emit("cancel"))
+                ae(n.$slots, "actions"),
+                X(ze, {
+                  "allow-speech": n.allowSpeech,
+                  "allow-files": n.allowFiles,
+                  loading: n.loading,
+                  disabled: C.value,
+                  "show-clear": n.clearable,
+                  "has-content": ue.value,
+                  "speech-status": w(Y),
+                  "submit-type": n.submitType,
+                  "is-over-limit": he.value,
+                  "stop-text": n.stopText,
+                  onClear: fe,
+                  onToggleSpeech: be,
+                  onSubmit: w(t),
+                  onCancel: k[2] || (k[2] = (B) => n.$emit("cancel"))
                 }, null, 8, ["allow-speech", "allow-files", "loading", "disabled", "show-clear", "has-content", "speech-status", "submit-type", "is-over-limit", "stop-text", "onSubmit"])
               ], 512)
-            ])) : P("", !0)
+            ])) : W("", !0)
           ], 2),
-          G(ve, { name: "tiny-sender-slide-up" }, {
-            default: Y(() => [
-              s.value === "multiple" ? (D(), O("div", {
+          X(Ee, { name: "tiny-sender-slide-up" }, {
+            default: Z(() => [
+              E.value === "multiple" ? (m(), O("div", {
                 key: 0,
-                style: Ie(Ue.value),
+                style: qe(d.value),
                 class: "tiny-sender__footer-slot tiny-sender__bottom-row"
               }, [
-                U("div", jt, [
-                  se(d.$slots, "footer-left")
+                M("div", Xt, [
+                  ae(n.$slots, "footer-left")
                 ]),
-                U("div", Ut, [
-                  se(d.$slots, "footer-right"),
-                  d.showWordLimit && d.maxLength !== 1 / 0 ? (D(), O("div", {
+                M("div", Jt, [
+                  ae(n.$slots, "footer-right"),
+                  n.showWordLimit && n.maxLength !== 1 / 0 ? (m(), O("div", {
                     key: 0,
-                    class: oe(["tiny-sender__word-limit", { "is-over-limit": re.value }])
+                    class: le(["tiny-sender__word-limit", { "is-over-limit": he.value }])
                   }, [
-                    U("span", Zt, le(T(o).length), 1),
-                    Le("/" + le(d.maxLength), 1)
-                  ], 2)) : P("", !0),
-                  s.value === "multiple" ? (D(), O("div", Gt, [
-                    U("div", Jt, [
-                      G(Be, {
-                        "allow-speech": d.allowSpeech,
-                        "allow-files": d.allowFiles,
-                        loading: d.loading,
-                        disabled: ue.value,
-                        "show-clear": d.clearable,
-                        "has-content": Ee.value,
-                        "speech-status": T(ie),
-                        "submit-type": d.submitType,
-                        "is-over-limit": re.value,
-                        "stop-text": d.stopText,
-                        onClear: X,
-                        onToggleSpeech: he,
-                        onSubmit: T(me),
-                        onCancel: k[4] || (k[4] = (F) => d.$emit("cancel"))
+                    M("span", Gt, se(w(h).length), 1),
+                    Me("/" + se(n.maxLength), 1)
+                  ], 2)) : W("", !0),
+                  E.value === "multiple" ? (m(), O("div", Qt, [
+                    M("div", Yt, [
+                      X(ze, {
+                        "allow-speech": n.allowSpeech,
+                        "allow-files": n.allowFiles,
+                        loading: n.loading,
+                        disabled: C.value,
+                        "show-clear": n.clearable,
+                        "has-content": ue.value,
+                        "speech-status": w(Y),
+                        "submit-type": n.submitType,
+                        "is-over-limit": he.value,
+                        "stop-text": n.stopText,
+                        onClear: fe,
+                        onToggleSpeech: be,
+                        onSubmit: w(t),
+                        onCancel: k[3] || (k[3] = (B) => n.$emit("cancel"))
                       }, null, 8, ["allow-speech", "allow-files", "loading", "disabled", "show-clear", "has-content", "speech-status", "submit-type", "is-over-limit", "stop-text", "onSubmit"])
                     ])
-                  ])) : P("", !0)
+                  ])) : W("", !0)
                 ])
-              ], 4)) : d.$slots.footer ? (D(), O("div", Qt, [
-                se(d.$slots, "footer")
-              ])) : P("", !0)
+              ], 4)) : n.$slots.footer ? (m(), O("div", Zt, [
+                ae(n.$slots, "footer")
+              ])) : W("", !0)
             ]),
             _: 3
           })
         ], 512)
       ]),
-      G(ve, { name: "tiny-sender-slide-up" }, {
-        default: Y(() => [
-          T(E) && T(h).length ? (D(), O("div", {
+      X(Ee, { name: "tiny-sender-slide-up" }, {
+        default: Z(() => [
+          w(_) && w(U).length ? (m(), O("div", {
             key: 0,
             ref_key: "suggestionsListRef",
-            ref: w,
+            ref: G,
             class: "tiny-sender__suggestions",
-            style: Ie(Ye.value)
+            style: qe(Xe.value)
           }, [
-            (D(!0), O(Oe, null, Ae(T(h), (F, ne) => (D(), O("div", {
+            (m(!0), O(ce, null, ye(w(U), (B, ne) => (m(), O("div", {
               key: ne,
-              class: oe(["suggestion-item", { highlighted: T(V)(ne) }]),
-              onMouseenter: (Z) => T(e)(ne),
-              onMouseleave: k[5] || (k[5] = //@ts-ignore
-              (...Z) => T(l) && T(l)(...Z)),
-              onMousedown: dt((Z) => T(C)(F), ["prevent"])
+              class: le(["suggestion-item", { highlighted: w(y)(ne) }]),
+              onMouseenter: (j) => w(R)(ne),
+              onMouseleave: k[4] || (k[4] = //@ts-ignore
+              (...j) => w(K) && w(K)(...j)),
+              onMousedown: ct((j) => w(V)(B), ["prevent"])
             }, [
-              G(T(St), { class: "suggestion-item__icon" }),
-              U("span", en, [
-                (D(!0), O(Oe, null, Ae(T(n)(F, T(o)), (Z, ge) => (D(), O("span", {
-                  key: ge,
-                  class: oe({ "suggestion-item__text--match": Z.isMatch, "suggestion-item__text--normal": !Z.isMatch })
-                }, le(Z.text), 3))), 128))
+              X(w(mt), { class: "suggestion-item__icon" }),
+              M("span", tn, [
+                (m(!0), O(ce, null, ye(w(re)(B, w(h)), (j, Be) => (m(), O("span", {
+                  key: Be,
+                  class: le({ "suggestion-item__text--match": j.isMatch, "suggestion-item__text--normal": !j.isMatch })
+                }, se(j.text), 3))), 128))
               ])
-            ], 42, Yt))), 128))
-          ], 4)) : P("", !0)
+            ], 42, en))), 128))
+          ], 4)) : W("", !0)
         ]),
         _: 1
       }),
-      ae.value ? (D(), O("div", tn, le(ae.value), 1)) : P("", !0)
-    ], 10, Mt));
+      ve.value ? (m(), O("div", nn, se(ve.value), 1)) : W("", !0)
+    ], 10, Kt));
   }
 });
-pe.name = "TrSender";
-const nn = function(t) {
-  t.component(pe.name, pe);
+Ie.name = "TrSender";
+const sn = function(a) {
+  a.component(Ie.name, Ie);
 };
-pe.install = nn;
+Ie.install = sn;
 export {
-  pe as default
+  Ie as default
 };