@opentiny/tiny-robot 0.3.0-alpha.15 → 0.3.0-alpha.16

package/dist/sender/index.js

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