@ryzeup/richtexteditor 1.0.26 → 1.0.27

package/dist/index.es.js

@@ -11,7 +11,7 @@ var ze = (r, s, u) => s in r ? pt(r, s, { enumerable: !0, configurable: !0, writ
   return r;
 }, se = (r, s) => vt(r, yt(s));
 import * as Ct from "react";
-import i, { useRef as $, useState as k, useEffect as I } from "react";
+import i, { useRef as W, useState as D, useEffect as U } from "react";
 import { createPortal as bt } from "react-dom";
 window.React = Ct;
 var je = {
@@ -21,17 +21,17 @@ var je = {
   style: void 0,
   attr: void 0
 }, De = i.createContext && /* @__PURE__ */ i.createContext(je), Lt = ["attr", "size", "title"];
-function Rt(r, s) {
+function xt(r, s) {
   if (r == null) return {};
-  var u = xt(r, s), g, p;
+  var u = Rt(r, s), g, p;
   if (Object.getOwnPropertySymbols) {
-    var C = Object.getOwnPropertySymbols(r);
-    for (p = 0; p < C.length; p++)
-      g = C[p], !(s.indexOf(g) >= 0) && Object.prototype.propertyIsEnumerable.call(r, g) && (u[g] = r[g]);
+    var b = Object.getOwnPropertySymbols(r);
+    for (p = 0; p < b.length; p++)
+      g = b[p], !(s.indexOf(g) >= 0) && Object.prototype.propertyIsEnumerable.call(r, g) && (u[g] = r[g]);
   }
   return u;
 }
-function xt(r, s) {
+function Rt(r, s) {
   if (r == null) return {};
   var u = {};
   for (var g in r)
@@ -41,17 +41,17 @@ function xt(r, s) {
     }
   return u;
 }
-function G() {
-  return G = Object.assign ? Object.assign.bind() : function(r) {
+function ee() {
+  return ee = Object.assign ? Object.assign.bind() : function(r) {
     for (var s = 1; s < arguments.length; s++) {
       var u = arguments[s];
       for (var g in u)
         Object.prototype.hasOwnProperty.call(u, g) && (r[g] = u[g]);
     }
     return r;
-  }, G.apply(this, arguments);
+  }, ee.apply(this, arguments);
 }
-function Oe(r, s) {
+function He(r, s) {
   var u = Object.keys(r);
   if (Object.getOwnPropertySymbols) {
     var g = Object.getOwnPropertySymbols(r);
@@ -61,12 +61,12 @@ function Oe(r, s) {
   }
   return u;
 }
-function ee(r) {
+function te(r) {
   for (var s = 1; s < arguments.length; s++) {
     var u = arguments[s] != null ? arguments[s] : {};
-    s % 2 ? Oe(Object(u), !0).forEach(function(g) {
+    s % 2 ? He(Object(u), !0).forEach(function(g) {
       St(r, g, u[g]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(r, Object.getOwnPropertyDescriptors(u)) : Oe(Object(u)).forEach(function(g) {
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(r, Object.getOwnPropertyDescriptors(u)) : He(Object(u)).forEach(function(g) {
       Object.defineProperty(r, g, Object.getOwnPropertyDescriptor(u, g));
     });
   }
@@ -76,10 +76,10 @@ function St(r, s, u) {
   return s = Mt(s), s in r ? Object.defineProperty(r, s, { value: u, enumerable: !0, configurable: !0, writable: !0 }) : r[s] = u, r;
 }
 function Mt(r) {
-  var s = At(r, "string");
+  var s = Tt(r, "string");
   return typeof s == "symbol" ? s : s + "";
 }
-function At(r, s) {
+function Tt(r, s) {
   if (typeof r != "object" || !r) return r;
   var u = r[Symbol.toPrimitive];
   if (u !== void 0) {
@@ -90,35 +90,35 @@ function At(r, s) {
   return (s === "string" ? String : Number)(r);
 }
 function Fe(r) {
-  return r && r.map((s, u) => /* @__PURE__ */ i.createElement(s.tag, ee({
+  return r && r.map((s, u) => /* @__PURE__ */ i.createElement(s.tag, te({
     key: u
   }, s.attr), Fe(s.child)));
 }
 function N(r) {
-  return (s) => /* @__PURE__ */ i.createElement(Tt, G({
-    attr: ee({}, r.attr)
+  return (s) => /* @__PURE__ */ i.createElement(At, ee({
+    attr: te({}, r.attr)
   }, s), Fe(r.child));
 }
-function Tt(r) {
+function At(r) {
   var s = (u) => {
     var {
       attr: g,
       size: p,
-      title: C
-    } = r, L = Rt(r, Lt), T = p || u.size || "1em", E;
-    return u.className && (E = u.className), r.className && (E = (E ? E + " " : "") + r.className), /* @__PURE__ */ i.createElement("svg", G({
+      title: b
+    } = r, S = xt(r, Lt), T = p || u.size || "1em", E;
+    return u.className && (E = u.className), r.className && (E = (E ? E + " " : "") + r.className), /* @__PURE__ */ i.createElement("svg", ee({
       stroke: "currentColor",
       fill: "currentColor",
       strokeWidth: "0"
-    }, u.attr, g, L, {
+    }, u.attr, g, S, {
       className: E,
-      style: ee(ee({
+      style: te(te({
         color: r.color || u.color
       }, u.style), r.style),
       height: T,
       width: T,
       xmlns: "http://www.w3.org/2000/svg"
-    }), C && /* @__PURE__ */ i.createElement("title", null, C), r.children);
+    }), b && /* @__PURE__ */ i.createElement("title", null, b), r.children);
   };
   return De !== void 0 ? /* @__PURE__ */ i.createElement(De.Consumer, null, (u) => s(u)) : s(je);
 }
@@ -134,10 +134,10 @@ function zt(r) {
 function Dt(r) {
   return N({ attr: { viewBox: "0 0 512 512" }, child: [{ tag: "path", attr: { d: "M24 56c0-13.3 10.7-24 24-24l32 0c13.3 0 24 10.7 24 24l0 120 16 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-80 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l16 0 0-96-8 0C34.7 80 24 69.3 24 56zM86.7 341.2c-6.5-7.4-18.3-6.9-24 1.2L51.5 357.9c-7.7 10.8-22.7 13.3-33.5 5.6s-13.3-22.7-5.6-33.5l11.1-15.6c23.7-33.2 72.3-35.6 99.2-4.9c21.3 24.4 20.8 60.9-1.1 84.7L86.8 432l33.2 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-88 0c-9.5 0-18.2-5.6-22-14.4s-2.1-18.9 4.3-25.9l72-78c5.3-5.8 5.4-14.6 .3-20.5zM224 64l256 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-256 0c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160l256 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-256 0c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160l256 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-256 0c-17.7 0-32-14.3-32-32s14.3-32 32-32z" }, child: [] }] })(r);
 }
-function Ot(r) {
+function Ht(r) {
   return N({ attr: { viewBox: "0 0 448 512" }, child: [{ tag: "path", attr: { d: "M12.83 352h262.34A12.82 12.82 0 0 0 288 339.17v-38.34A12.82 12.82 0 0 0 275.17 288H12.83A12.82 12.82 0 0 0 0 300.83v38.34A12.82 12.82 0 0 0 12.83 352zm0-256h262.34A12.82 12.82 0 0 0 288 83.17V44.83A12.82 12.82 0 0 0 275.17 32H12.83A12.82 12.82 0 0 0 0 44.83v38.34A12.82 12.82 0 0 0 12.83 96zM432 160H16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zm0 256H16a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h416a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z" }, child: [] }] })(r);
 }
-function Ht(r) {
+function Ot(r) {
   return N({ attr: { viewBox: "0 0 384 512" }, child: [{ tag: "path", attr: { d: "M333.49 238a122 122 0 0 0 27-65.21C367.87 96.49 308 32 233.42 32H34a16 16 0 0 0-16 16v48a16 16 0 0 0 16 16h31.87v288H34a16 16 0 0 0-16 16v48a16 16 0 0 0 16 16h209.32c70.8 0 134.14-51.75 141-122.4 4.74-48.45-16.39-92.06-50.83-119.6zM145.66 112h87.76a48 48 0 0 1 0 96h-87.76zm87.76 288h-87.76V288h87.76a56 56 0 0 1 0 112z" }, child: [] }] })(r);
 }
 function _t(r) {
@@ -161,10 +161,10 @@ function qt(r) {
 function Bt(r) {
   return N({ attr: { viewBox: "0 0 256 256", fill: "currentColor" }, child: [{ tag: "path", attr: { d: "M208,32H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM56.84,75.58a8,8,0,0,1,3.58-10.74l16-8A8,8,0,0,1,88,64v48a8,8,0,0,1-16,0V76.94l-4.42,2.22A8,8,0,0,1,56.84,75.58ZM92,180a8,8,0,0,1,0,16H68a8,8,0,0,1-6.4-12.8l21.67-28.89A3.92,3.92,0,0,0,84,152a4,4,0,0,0-7.77-1.33,8,8,0,0,1-15.09-5.34,20,20,0,1,1,35,18.53L84,180Zm100,4H120a8,8,0,0,1,0-16h72a8,8,0,0,1,0,16Zm0-48H120a8,8,0,0,1,0-16h72a8,8,0,0,1,0,16Zm0-48H120a8,8,0,0,1,0-16h72a8,8,0,0,1,0,16Z" }, child: [] }] })(r);
 }
-function Ut(r) {
+function Vt(r) {
   return N({ attr: { viewBox: "0 0 24 24", fill: "currentColor" }, child: [{ tag: "path", attr: { d: "M2 18H9V20H2V18ZM2 11H11V13H2V11ZM2 4H22V6H2V4ZM20.674 13.0251L21.8301 12.634L22.8301 14.366L21.914 15.1711C21.9704 15.4386 22 15.7158 22 16C22 16.2842 21.9704 16.5614 21.914 16.8289L22.8301 17.634L21.8301 19.366L20.674 18.9749C20.2635 19.3441 19.7763 19.6295 19.2391 19.8044L19 21H17L16.7609 19.8044C16.2237 19.6295 15.7365 19.3441 15.326 18.9749L14.1699 19.366L13.1699 17.634L14.086 16.8289C14.0296 16.5614 14 16.2842 14 16C14 15.7158 14.0296 15.4386 14.086 15.1711L13.1699 14.366L14.1699 12.634L15.326 13.0251C15.7365 12.6559 16.2237 12.3705 16.7609 12.1956L17 11H19L19.2391 12.1956C19.7763 12.3705 20.2635 12.6559 20.674 13.0251ZM18 17C18.5523 17 19 16.5523 19 16C19 15.4477 18.5523 15 18 15C17.4477 15 17 15.4477 17 16C17 16.5523 17.4477 17 18 17Z" }, child: [] }] })(r);
 }
-function Vt(r) {
+function Ut(r) {
   return N({ attr: { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, child: [{ tag: "path", attr: { d: "M12 21h-7a2 2 0 0 1 -2 -2v-14a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v7" }, child: [] }, { tag: "path", attr: { d: "M3 10h18" }, child: [] }, { tag: "path", attr: { d: "M10 3v18" }, child: [] }, { tag: "path", attr: { d: "M19.001 19m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" }, child: [] }, { tag: "path", attr: { d: "M19.001 15.5v1.5" }, child: [] }, { tag: "path", attr: { d: "M19.001 21v1.5" }, child: [] }, { tag: "path", attr: { d: "M22.032 17.25l-1.299 .75" }, child: [] }, { tag: "path", attr: { d: "M17.27 20l-1.3 .75" }, child: [] }, { tag: "path", attr: { d: "M15.97 17.25l1.3 .75" }, child: [] }, { tag: "path", attr: { d: "M20.733 20l1.3 .75" }, child: [] }] })(r);
 }
 function $t(r) {
@@ -295,30 +295,30 @@ const Xt = [
   handleFontSizeChange: g,
   handleFontFamilyChange: p,
   //   insertListBlock,
-  insertEmoji: C,
-  handleLink: L,
+  insertEmoji: b,
+  handleLink: S,
   removeFormatting: T,
   visibleActions: E,
-  className: R,
-  style: S
+  className: w,
+  style: x
 }) => {
-  var W, _;
-  const M = $(null), B = $(null), z = $(null), [U, V] = k(!1), [P, j] = k({
+  var X, B;
+  const R = W(null), H = W(null), k = W(null), [O, j] = D(!1), [P, z] = D({
     x: 0,
     y: 0
   });
-  I(() => {
-    const f = (b) => {
-      !b.target.closest(".rte-emoji-popup") && !b.target.closest("button[title='Emoji']") && V(!1);
+  U(() => {
+    const f = (L) => {
+      !L.target.closest(".rte-emoji-popup") && !L.target.closest("button[title='Emoji']") && j(!1);
     };
     return document.addEventListener("mousedown", f), () => document.removeEventListener("mousedown", f);
   }, []);
-  const q = (f) => {
-    var F;
+  const _ = (f) => {
+    var V;
     f.preventDefault();
-    const b = f.currentTarget.dataset.command;
-    if (b)
-      switch (b) {
+    const L = f.currentTarget.dataset.command;
+    if (L)
+      switch (L) {
         case "bold":
         case "italic":
         case "underline":
@@ -327,20 +327,20 @@ const Xt = [
         case "insertOrderedList":
         case "insertStaticOrderedList":
         case "removeFormat":
-          r(b);
+          r(L);
           break;
         case "insertImage": {
-          (F = M.current) == null || F.click();
+          (V = R.current) == null || V.click();
           break;
         }
         default:
-          console.warn("Unknown command:", b);
+          console.warn("Unknown command:", L);
       }
-  }, Y = (f) => {
+  }, $ = (f) => {
     r("foreColor", f.target.value);
-  }, te = (f) => {
+  }, Z = (f) => {
     r("backColor", f.target.value);
-  }, [x, D] = k({
+  }, [M, F] = D({
     bold: !1,
     italic: !1,
     underline: !1,
@@ -357,9 +357,9 @@ const Xt = [
     color: !1,
     highlight: !1
   });
-  return I(() => {
+  return U(() => {
     const f = () => {
-      D({
+      F({
         bold: document.queryCommandState("bold"),
         italic: document.queryCommandState("italic"),
         underline: document.queryCommandState("underline"),
@@ -379,67 +379,67 @@ const Xt = [
     };
     return document.addEventListener("selectionchange", f), () => document.removeEventListener("selectionchange", f);
   }, []), /* @__PURE__ */ i.createElement("div", {
-    className: `rte-toolbar ${R || ""}`,
-    style: S
+    className: `rte-toolbar ${w || ""}`,
+    style: x
   }, E.bold && /* @__PURE__ */ i.createElement("button", {
     "data-command": "bold",
     title: "Bold",
-    onMouseDown: q,
-    className: x.bold ? "rte-active" : ""
-  }, /* @__PURE__ */ i.createElement(Ht, null)), E.italic && /* @__PURE__ */ i.createElement("button", {
+    onMouseDown: _,
+    className: M.bold ? "rte-active" : ""
+  }, /* @__PURE__ */ i.createElement(Ot, null)), E.italic && /* @__PURE__ */ i.createElement("button", {
     "data-command": "italic",
     title: "Italic",
-    onMouseDown: q,
-    className: x.italic ? "rte-active" : ""
+    onMouseDown: _,
+    className: M.italic ? "rte-active" : ""
   }, /* @__PURE__ */ i.createElement(jt, null)), E.underline && /* @__PURE__ */ i.createElement("button", {
     "data-command": "underline",
     title: "Underline",
-    onMouseDown: q,
-    className: x.underline ? "rte-active" : ""
+    onMouseDown: _,
+    className: M.underline ? "rte-active" : ""
   }, /* @__PURE__ */ i.createElement(qt, null)), E.unorderedList && /* @__PURE__ */ i.createElement("button", {
     "data-command": "insertUnorderedList",
-    onMouseDown: q,
+    onMouseDown: _,
     title: "UnorderedList",
-    className: x.unorderedList ? "rte-active" : ""
-  }, /* @__PURE__ */ i.createElement(Ut, null)), E.staticUnorderedList && /* @__PURE__ */ i.createElement("button", {
+    className: M.unorderedList ? "rte-active" : ""
+  }, /* @__PURE__ */ i.createElement(Vt, null)), E.staticUnorderedList && /* @__PURE__ */ i.createElement("button", {
     "data-command": "insertStaticUnorderedList",
-    onMouseDown: q,
+    onMouseDown: _,
     title: "StaticUnorderedList",
-    className: x.unorderedList ? "rte-active" : ""
+    className: M.unorderedList ? "rte-active" : ""
   }, /* @__PURE__ */ i.createElement(It, null)), E.orderedList && /* @__PURE__ */ i.createElement("button", {
     "data-command": "insertOrderedList",
     title: "OrderedList",
-    onMouseDown: q,
-    className: x.orderedList ? "rte-active" : "",
+    onMouseDown: _,
+    className: M.orderedList ? "rte-active" : "",
     style: {
       fontSize: "medium"
     }
   }, /* @__PURE__ */ i.createElement(Bt, null)), E.staticOrderedList && /* @__PURE__ */ i.createElement("button", {
     "data-command": "insertStaticOrderedList",
     title: "StaticOrderedList",
-    onMouseDown: q,
-    className: x.orderedList ? "rte-active" : ""
+    onMouseDown: _,
+    className: M.orderedList ? "rte-active" : ""
   }, /* @__PURE__ */ i.createElement(Dt, null)), E.link && /* @__PURE__ */ i.createElement("button", {
     "data-command": "createLink",
     title: "Link",
-    onClick: L,
-    className: x.link ? "rte-active" : ""
+    onClick: S,
+    className: M.link ? "rte-active" : ""
   }, /* @__PURE__ */ i.createElement(Ft, null)), E.removeFormat && /* @__PURE__ */ i.createElement("button", {
     "data-command": "Remove format",
     title: "removeFormat",
     onMouseDown: (f) => {
       f.preventDefault(), s(), T();
     },
-    className: x.removeFormat ? "rte-active" : ""
+    className: M.removeFormat ? "rte-active" : ""
   }, /* @__PURE__ */ i.createElement(Zt, null)), E.image && /* @__PURE__ */ i.createElement("button", {
     "data-command": "insertImage",
     title: "Image",
-    onMouseDown: q,
-    className: x.image ? "rte-active" : ""
+    onMouseDown: _,
+    className: M.image ? "rte-active" : ""
   }, /* @__PURE__ */ i.createElement(zt, null)), /* @__PURE__ */ i.createElement("input", {
     type: "file",
     accept: "image/*",
-    ref: M,
+    ref: R,
     style: {
       display: "none"
     },
@@ -452,29 +452,29 @@ const Xt = [
     title: "Emoji",
     onMouseDown: (f) => {
       f.preventDefault(), s();
-      const b = f.currentTarget.getBoundingClientRect();
-      j({
-        x: b.left,
-        y: b.bottom + 8
+      const L = f.currentTarget.getBoundingClientRect();
+      z({
+        x: L.left,
+        y: L.bottom + 8
         // small spacing
-      }), V((F) => !F);
+      }), j((V) => !V);
     },
-    className: x.emoji ? "rte-active" : ""
-  }, /* @__PURE__ */ i.createElement(Pt, null)), U && /* @__PURE__ */ bt(/* @__PURE__ */ i.createElement("div", {
+    className: M.emoji ? "rte-active" : ""
+  }, /* @__PURE__ */ i.createElement(Pt, null)), O && /* @__PURE__ */ bt(/* @__PURE__ */ i.createElement("div", {
     className: "rte-emoji-popup",
     style: {
       top: P.y,
       left: P.x
     }
-  }, Xt.map((f, b) => /* @__PURE__ */ i.createElement("span", {
-    key: b,
+  }, Xt.map((f, L) => /* @__PURE__ */ i.createElement("span", {
+    key: L,
     style: {
       fontSize: "20px",
       cursor: "pointer",
       textAlign: "center"
     },
-    onMouseDown: (F) => {
-      F.preventDefault(), C(f), V(!1);
+    onMouseDown: (V) => {
+      V.preventDefault(), b(f), j(!1);
     }
   }, f))), document.body)), E.color && /* @__PURE__ */ i.createElement("div", {
     style: {
@@ -483,24 +483,24 @@ const Xt = [
   }, /* @__PURE__ */ i.createElement("button", {
     title: "Text Color",
     onMouseDown: (f) => {
-      var b;
-      f.preventDefault(), s(), (b = B.current) == null || b.click();
+      var L;
+      f.preventDefault(), s(), (L = H.current) == null || L.click();
     },
     style: {
       display: "flex",
       alignItems: "center",
       justifyContent: "center",
-      color: ((W = B.current) == null ? void 0 : W.value) || "#000",
+      color: ((X = H.current) == null ? void 0 : X.value) || "#000",
       fontSize: "18px"
     },
-    className: x.color ? "rte-active" : ""
+    className: M.color ? "rte-active" : ""
   }, /* @__PURE__ */ i.createElement(Wt, null)), /* @__PURE__ */ i.createElement("input", {
-    ref: B,
+    ref: H,
     type: "color",
     defaultValue: "#000000",
     onChange: (f) => {
-      var b;
-      Y(f), ((b = f.target.parentElement) == null ? void 0 : b.querySelector("button")).style.color = f.target.value;
+      var L;
+      $(f), ((L = f.target.parentElement) == null ? void 0 : L.querySelector("button")).style.color = f.target.value;
     },
     style: {
       position: "absolute",
@@ -516,23 +516,23 @@ const Xt = [
   }, /* @__PURE__ */ i.createElement("button", {
     title: "Highlight",
     onMouseDown: (f) => {
-      var b;
-      f.preventDefault(), s(), (b = z.current) == null || b.click();
+      var L;
+      f.preventDefault(), s(), (L = k.current) == null || L.click();
     },
     style: {
       display: "flex",
       alignItems: "center",
       justifyContent: "center",
-      color: ((_ = z.current) == null ? void 0 : _.value) || "#000",
+      color: ((B = k.current) == null ? void 0 : B.value) || "#000",
       fontSize: "18px"
     },
-    className: x.highlight ? "rte-active" : ""
+    className: M.highlight ? "rte-active" : ""
   }, /* @__PURE__ */ i.createElement(_t, null)), /* @__PURE__ */ i.createElement("input", {
-    ref: z,
+    ref: k,
     type: "color",
     onChange: (f) => {
-      var b;
-      te(f), ((b = f.target.parentElement) == null ? void 0 : b.querySelector("button")).style.color = f.target.value;
+      var L;
+      Z(f), ((L = f.target.parentElement) == null ? void 0 : L.querySelector("button")).style.color = f.target.value;
     },
     defaultValue: "#000000",
     style: {
@@ -546,30 +546,30 @@ const Xt = [
     title: "Align Left",
     onMouseDown: (f) => f.preventDefault(),
     onClick: () => r("justifyLeft"),
-    className: x.alignLeft ? "rte-active" : ""
-  }, /* @__PURE__ */ i.createElement(Ot, null)), /* @__PURE__ */ i.createElement("button", {
+    className: M.alignLeft ? "rte-active" : ""
+  }, /* @__PURE__ */ i.createElement(Ht, null)), /* @__PURE__ */ i.createElement("button", {
     title: "Align Center",
     onMouseDown: (f) => f.preventDefault(),
     onClick: () => r("justifyCenter"),
-    className: x.alignCenter ? "rte-active" : ""
+    className: M.alignCenter ? "rte-active" : ""
   }, /* @__PURE__ */ i.createElement(Nt, null)), /* @__PURE__ */ i.createElement("button", {
     title: "Align Right",
     onMouseDown: (f) => f.preventDefault(),
     onClick: () => r("justifyRight"),
-    className: x.alignRight ? "rte-active" : ""
+    className: M.alignRight ? "rte-active" : ""
   }, /* @__PURE__ */ i.createElement(kt, null))), E.table && /* @__PURE__ */ i.createElement("button", {
     title: "Insert Dynamic Table",
     onMouseDown: (f) => f.preventDefault(),
     onClick: () => r("insertTable"),
-    className: x.table ? "rte-active" : "",
+    className: M.table ? "rte-active" : "",
     style: {
       fontSize: "medium"
     }
-  }, /* @__PURE__ */ i.createElement(Vt, null)), E.table && /* @__PURE__ */ i.createElement("button", {
+  }, /* @__PURE__ */ i.createElement(Ut, null)), E.table && /* @__PURE__ */ i.createElement("button", {
     title: "Insert Static Table",
     onMouseDown: (f) => f.preventDefault(),
     onClick: () => r("insertStaticTable"),
-    className: x.table ? "rte-active" : "",
+    className: M.table ? "rte-active" : "",
     style: {
       fontSize: "medium"
     }
@@ -601,7 +601,7 @@ const Xt = [
     disabled: !0
   }, "Font Size"), Array.from({
     length: 16
-  }, (f, b) => 10 + b).map((f) => /* @__PURE__ */ i.createElement("option", {
+  }, (f, L) => 10 + L).map((f) => /* @__PURE__ */ i.createElement("option", {
     key: f,
     value: f
   }, f, "px"))));
@@ -611,70 +611,70 @@ const Xt = [
   filtered: u,
   insertMention: g,
   onClose: p,
-  query: C
+  query: b
 }) => {
-  const L = $(null), [T, E] = k(0);
-  return I(() => {
+  const S = W(null), [T, E] = D(0);
+  return U(() => {
     r && E(0);
-  }, [r]), I(() => {
-    const R = (S) => {
-      L.current && !L.current.contains(S.target) && p();
+  }, [r]), U(() => {
+    const w = (x) => {
+      S.current && !S.current.contains(x.target) && p();
     };
-    return r && document.addEventListener("mousedown", R), () => {
-      document.removeEventListener("mousedown", R);
+    return r && document.addEventListener("mousedown", w), () => {
+      document.removeEventListener("mousedown", w);
     };
-  }, [r, p]), I(() => {
+  }, [r, p]), U(() => {
     if (!r) return;
-    const R = (S) => {
-      if (!(!r || u.length === 0) && (S.key === "ArrowDown" && (S.preventDefault(), E((M) => Math.min(M + 1, u.length - 1))), S.key === "ArrowUp" && (S.preventDefault(), E((M) => Math.max(M - 1, 0))), S.key === "Enter")) {
-        S.preventDefault();
-        const M = u[T];
-        M && g(M);
+    const w = (x) => {
+      if (!(!r || u.length === 0) && (x.key === "ArrowDown" && (x.preventDefault(), E((R) => Math.min(R + 1, u.length - 1))), x.key === "ArrowUp" && (x.preventDefault(), E((R) => Math.max(R - 1, 0))), x.key === "Enter")) {
+        x.preventDefault();
+        const R = u[T];
+        R && g(R);
       }
     };
-    return window.addEventListener("keydown", R), () => window.removeEventListener("keydown", R);
-  }, [r, u, T]), I(() => {
-    if (!L.current) return;
-    const S = L.current.querySelectorAll("li")[T];
-    S && S.scrollIntoView({
+    return window.addEventListener("keydown", w), () => window.removeEventListener("keydown", w);
+  }, [r, u, T]), U(() => {
+    if (!S.current) return;
+    const x = S.current.querySelectorAll("li")[T];
+    x && x.scrollIntoView({
       block: "nearest",
       behavior: "smooth"
     });
   }, [T]), r ? /* @__PURE__ */ i.createElement("ul", {
-    ref: L,
+    ref: S,
     className: "rte-popup",
     style: {
       top: s.y,
       left: s.x
     }
   }, u.length > 0 ? u.map(({
-    name: R,
-    value: S
-  }, M) => {
-    const B = R.toLowerCase(), z = C.toLowerCase(), U = B.indexOf(z);
-    let V = R;
-    if (U !== -1 && C.length > 0) {
-      const P = U + C.length;
-      V = R.substring(0, U) + `<span class="rte-highlight">${R.substring(U, P)}</span>` + R.substring(P);
+    name: w,
+    value: x
+  }, R) => {
+    const H = w.toLowerCase(), k = b.toLowerCase(), O = H.indexOf(k);
+    let j = w;
+    if (O !== -1 && b.length > 0) {
+      const P = O + b.length;
+      j = w.substring(0, O) + `<span class="rte-highlight">${w.substring(O, P)}</span>` + w.substring(P);
     }
     return /* @__PURE__ */ i.createElement("li", {
-      key: S,
+      key: x,
       onMouseDown: (P) => {
         P.preventDefault(), g({
-          name: R,
-          value: S
+          name: w,
+          value: x
         });
       },
       style: {
         padding: "6px 12px",
         cursor: "pointer",
         fontSize: "14px",
-        background: M === T ? "#dce8ff" : "white"
+        background: R === T ? "#dce8ff" : "white"
       },
       dangerouslySetInnerHTML: {
-        __html: V
+        __html: j
       },
-      onMouseEnter: () => E(M)
+      onMouseEnter: () => E(R)
     });
   }) : /* @__PURE__ */ i.createElement("li", {
     style: {
@@ -683,10 +683,10 @@ const Xt = [
     }
   }, "No matches")) : null;
 };
-function He(r) {
+function Oe(r) {
   return N({ attr: { viewBox: "0 0 24 24" }, child: [{ tag: "g", attr: { id: "Circle_Minus" }, child: [{ tag: "g", attr: {}, child: [{ tag: "path", attr: { d: "M15,11.5h0a.5.5,0,0,1,0,1H9a.5.5,0,0,1,0-1Z" }, child: [] }, { tag: "path", attr: { d: "M12,21.934A9.933,9.933,0,1,1,21.932,12,9.945,9.945,0,0,1,12,21.934ZM12,3.068A8.933,8.933,0,1,0,20.932,12,8.944,8.944,0,0,0,12,3.068Z" }, child: [] }] }] }] })(r);
 }
-function J(r) {
+function G(r) {
   return N({ attr: { viewBox: "0 0 24 24" }, child: [{ tag: "g", attr: { id: "Circle_Plus" }, child: [{ tag: "g", attr: {}, child: [{ tag: "path", attr: { d: "M15,12.5H12.5V15a.5.5,0,0,1-1,0V12.5H9a.5.5,0,0,1,0-1h2.5V9a.5.5,0,0,1,1,0v2.5H15A.5.5,0,0,1,15,12.5Z" }, child: [] }, { tag: "path", attr: { d: "M12,21.932A9.934,9.934,0,1,1,21.932,12,9.944,9.944,0,0,1,12,21.932ZM12,3.065A8.934,8.934,0,1,0,20.932,12,8.944,8.944,0,0,0,12,3.065Z" }, child: [] }] }] }] })(r);
 }
 const Qt = ({
@@ -697,42 +697,81 @@ const Qt = ({
   onClose: p
 }) => {
   if (!r) return null;
-  const C = {
+  const b = {
     top: u,
     left: s
   };
   return /* @__PURE__ */ i.createElement("div", {
-    style: C,
+    style: b,
     className: "rte-table-menu",
     onMouseLeave: p
   }, /* @__PURE__ */ i.createElement("button", {
     onClick: () => g("insertRowAbove")
-  }, /* @__PURE__ */ i.createElement(J, null), " Insert row above"), /* @__PURE__ */ i.createElement("button", {
+  }, /* @__PURE__ */ i.createElement(G, null), " Insert row above"), /* @__PURE__ */ i.createElement("button", {
     onClick: () => g("insertRowBelow")
-  }, /* @__PURE__ */ i.createElement(J, null), " Insert row below"), /* @__PURE__ */ i.createElement("button", {
+  }, /* @__PURE__ */ i.createElement(G, null), " Insert row below"), /* @__PURE__ */ i.createElement("button", {
     onClick: () => g("insertColLeft")
-  }, /* @__PURE__ */ i.createElement(J, null), " Insert col left"), /* @__PURE__ */ i.createElement("button", {
+  }, /* @__PURE__ */ i.createElement(G, null), " Insert col left"), /* @__PURE__ */ i.createElement("button", {
     onClick: () => g("insertColRight")
-  }, /* @__PURE__ */ i.createElement(J, null), " Insert col right"), /* @__PURE__ */ i.createElement("button", {
+  }, /* @__PURE__ */ i.createElement(G, null), " Insert col right"), /* @__PURE__ */ i.createElement("button", {
     onClick: () => g("deleteRow")
-  }, /* @__PURE__ */ i.createElement(He, null), " Delete row"), /* @__PURE__ */ i.createElement("button", {
+  }, /* @__PURE__ */ i.createElement(Oe, null), " Delete row"), /* @__PURE__ */ i.createElement("button", {
     onClick: () => g("deleteCol")
-  }, /* @__PURE__ */ i.createElement(He, null), " Delete column"));
+  }, /* @__PURE__ */ i.createElement(Oe, null), " Delete column"));
 }, Jt = ({
   html: r,
   className: s,
   style: u
 }) => {
-  const g = (C) => {
-    const L = C.target;
-    if (L.tagName === "A") {
-      C.preventDefault();
-      const T = L.href;
+  const g = (b) => {
+    const S = b.target;
+    if (S.tagName === "A") {
+      b.preventDefault();
+      const T = S.href;
       T && window.open(T, "_blank", "noopener,noreferrer");
     }
-  }, p = (C) => {
-    let L = C.replace(/{{\s*(.*?)\s*}}/g, (T, E) => `<span style="color: blue">${E}</span>`);
-    return L = L.replace(/#arrayData/g, ""), L = L.replace(/\/arrayData/g, ""), L;
+  }, p = (b) => {
+    const S = document.createElement("div");
+    S.innerHTML = b;
+    const T = document.createTreeWalker(S, NodeFilter.SHOW_TEXT, null), E = [];
+    for (; T.nextNode(); ) {
+      const w = T.currentNode;
+      w.nodeValue && /{{\s*[\s\S]*?\s*}}/.test(w.nodeValue) && E.push(w);
+    }
+    return E.forEach((w) => {
+      var P;
+      const x = w.nodeValue || "", R = w.parentElement;
+      if (!R) return;
+      let H = R, k = !1;
+      for (; H; ) {
+        if (H.tagName === "FONT" && H.getAttribute("color")) {
+          k = !0;
+          break;
+        }
+        const z = (P = H.style) == null ? void 0 : P.color;
+        if (z && z !== "") {
+          k = !0;
+          break;
+        }
+        const _ = window.getComputedStyle(H);
+        if (_.color && _.color !== "rgb(0, 0, 0)" && _.color !== "rgba(0, 0, 0, 0)") {
+          k = !0;
+          break;
+        }
+        H = H.parentElement;
+      }
+      const O = document.createDocumentFragment();
+      let j = 0;
+      x.replace(/{{\s*([\s\S]*?)\s*}}/g, (z, _, $) => {
+        if ($ > j && O.appendChild(document.createTextNode(x.slice(j, $))), k)
+          O.appendChild(document.createTextNode(z));
+        else {
+          const Z = document.createElement("span");
+          Z.style.color = "blue", Z.textContent = z, O.appendChild(Z);
+        }
+        return j = $ + z.length, z;
+      }), j < x.length && O.appendChild(document.createTextNode(x.slice(j))), R.replaceChild(O, w);
+    }), S.innerHTML = S.innerHTML.replace(/{{#arrayData}}/g, "").replace(/{{\/arrayData}}/g, ""), S.innerHTML;
   };
   return /* @__PURE__ */ i.createElement("div", {
     className: `rte-preview ${s || ""}`,
@@ -748,16 +787,16 @@ const Qt = ({
   onClose: u,
   onInsert: g
 }) => {
-  const [p, C] = k(""), [L, T] = k(""), [E, R] = k(""), [S, M] = k("_self");
-  if (I(() => {
-    r ? (C(s.url || ""), T(s.text || ""), R(s.title || ""), M(s.target || "_self")) : (C(""), T(""), R(""), M("_self"));
+  const [p, b] = D(""), [S, T] = D(""), [E, w] = D(""), [x, R] = D("_self");
+  if (U(() => {
+    r ? (b(s.url || ""), T(s.text || ""), w(s.title || ""), R(s.target || "_self")) : (b(""), T(""), w(""), R("_self"));
   }, [r, s]), !r) return null;
-  const B = () => {
+  const H = () => {
     g({
       url: p,
-      text: L,
+      text: S,
       title: E,
-      target: S
+      target: x
     });
   };
   return /* @__PURE__ */ i.createElement(i.Fragment, null, /* @__PURE__ */ i.createElement("div", {
@@ -772,23 +811,23 @@ const Qt = ({
     className: "rte-link-modal__input",
     placeholder: "URL",
     value: p,
-    onChange: (z) => C(z.target.value)
+    onChange: (k) => b(k.target.value)
   }), /* @__PURE__ */ i.createElement("input", {
     type: "text",
     className: "rte-link-modal__input",
     placeholder: "Text to Display",
-    value: L,
-    onChange: (z) => T(z.target.value)
+    value: S,
+    onChange: (k) => T(k.target.value)
   }), /* @__PURE__ */ i.createElement("input", {
     type: "text",
     className: "rte-link-modal__input",
     placeholder: "Title",
     value: E,
-    onChange: (z) => R(z.target.value)
+    onChange: (k) => w(k.target.value)
   }), /* @__PURE__ */ i.createElement("select", {
     className: "rte-link-modal__select",
-    value: S,
-    onChange: (z) => M(z.target.value)
+    value: x,
+    onChange: (k) => R(k.target.value)
   }, /* @__PURE__ */ i.createElement("option", {
     value: "_self"
   }, "Same tab"), /* @__PURE__ */ i.createElement("option", {
@@ -800,7 +839,7 @@ const Qt = ({
     onClick: u
   }, "Cancel"), /* @__PURE__ */ i.createElement("button", {
     className: "rte-link-modal__btn rte-link-modal__btn--ok",
-    onClick: B
+    onClick: H
   }, "OK"))));
 };
 function _e(r) {
@@ -831,26 +870,26 @@ const rn = ({
     staticOrderedList: !1
   },
   classNames: p = {},
-  styles: C = {},
-  handleGetHtml: L = () => {
+  styles: b = {},
+  handleGetHtml: S = () => {
   },
   onChange: T = () => {
   },
   value: E,
-  onMentionSelect: R = () => {
+  onMentionSelect: w = () => {
   },
-  handleAddAttributes: S = () => {
+  handleAddAttributes: x = () => {
   }
 }) => {
-  var Ee, we, Ce, be, Le, Re, xe, Se, Me, Ae, Te, Ne;
-  const M = $(null), [B, z] = k(E != null && E.length ? E : " "), [U, V] = k(""), [P, j] = k(!1), [q, Y] = k({
+  var Ee, we, Ce, be, Le, xe, Re, Se, Me, Te, Ae, Ne;
+  const R = W(null), [H, k] = D(E != null && E.length ? E : " "), [O, j] = D(""), [P, z] = D(!1), [_, $] = D({
     x: 0,
     y: 0
-  }), [te, x] = k([]), D = $(null), W = $(null), [_, f] = k({
+  }), [Z, M] = D([]), F = W(null), X = W(null), [B, f] = D({
     visible: !1,
     x: 0,
     y: 0
-  }), [b, F] = k(!1), Q = $(null), [Ie, de] = k({
+  }), [L, V] = D(!1), J = W(null), [Ie, de] = D({
     url: "",
     text: "",
     title: "",
@@ -866,71 +905,71 @@ const rn = ({
     staticOrderedList: (be = g.staticOrderedList) != null ? be : !0,
     align: !0,
     link: (Le = g.link) != null ? Le : !1,
-    image: (Re = g.image) != null ? Re : !1,
-    emoji: (xe = g.emoji) != null ? xe : !1,
+    image: (xe = g.image) != null ? xe : !1,
+    emoji: (Re = g.emoji) != null ? Re : !1,
     table: (Se = g.table) != null ? Se : !1,
     color: (Me = g.color) != null ? Me : !1,
-    fontFamily: (Ae = g.fontFamily) != null ? Ae : !1,
-    fontSize: (Te = g.fontSize) != null ? Te : !1,
+    fontFamily: (Te = g.fontFamily) != null ? Te : !1,
+    fontSize: (Ae = g.fontSize) != null ? Ae : !1,
     highlight: (Ne = g.fontSize) != null ? Ne : !1
-  }, [qe, ne] = k(""), [ue, re] = k([]), H = () => M.current, A = () => {
+  }, [qe, ne] = D(""), [ue, re] = D([]), q = () => R.current, A = () => {
     const e = Be(), t = /^<div[^>]*style=["'][^"']*font-size\s*:\s*\d+px[^"']*["'][^>]*>/.test(e.trim());
     let n = e;
     t || (n = `<div style="font-size:12px">${e}</div>`), n = n.replace(/<(ul|ol)([^>]*)>[\s\S]*?<\/\1>/g, (o, h, y) => {
       if (/list-type=["']static["']/.test(y) || o.includes("data-hidden-array-start") || o.includes("data-hidden-array-end")) return o;
-      const m = `<${h}${y}>`, c = '<span data-hidden-array-start="true" style="display:none">{{#arrayData}}</span>', v = '<span data-hidden-array-end="true" style="display:none">{{/arrayData}}</span>', w = `</${h}>`, O = o.replace(new RegExp(`^${m}`), "").replace(new RegExp(`${w}$`), "");
-      return `${m}${c}${O}${v}${w}`;
-    }), V(n), L == null || L(n);
+      const m = `<${h}${y}>`, c = '<span data-hidden-array-start="true" style="display:none">{{#arrayData}}</span>', v = '<span data-hidden-array-end="true" style="display:none">{{/arrayData}}</span>', C = `</${h}>`, I = o.replace(new RegExp(`^${m}`), "").replace(new RegExp(`${C}$`), "");
+      return `${m}${c}${I}${v}${C}`;
+    }), j(n), S == null || S(n);
     const a = ct(e);
     T(a);
     const d = Ye(), l = _e(d);
-    JSON.stringify(l) !== JSON.stringify(ue) && (re(l), R(l));
+    JSON.stringify(l) !== JSON.stringify(ue) && (re(l), w(l));
   }, Be = () => {
-    const e = H();
-    if (!e) return B;
+    const e = q();
+    if (!e) return H;
     const t = e.cloneNode(!0);
     t.querySelectorAll("table div").forEach((a) => a.remove()), t.querySelectorAll("table").forEach((a) => {
       a.removeAttribute("data-has-resize-handle");
     }), t.querySelectorAll(".rte-cell-highlight").forEach((a) => a.classList.remove("rte-cell-highlight"));
     let n = t.innerHTML;
-    return n = Ue(n), n;
-  }, Ue = (e) => {
+    return n = Ve(n), n;
+  }, Ve = (e) => {
     const t = document.createElement("div");
     return t.innerHTML = e, t.querySelectorAll("tbody").forEach((n) => {
       n.getAttribute("table-type") === "static" || (n.innerHTML = `{{#arrayData}}${n.innerHTML}{{/arrayData}}`);
     }), t.innerHTML;
-  }, Z = () => {
+  }, K = () => {
     const e = window.getSelection();
     if (!e || e.rangeCount === 0) return;
     const t = document.getElementById("rte-editor-body");
     if (!t) return;
     const n = e.getRangeAt(0);
-    t.contains(n.startContainer) && (D.current = n.cloneRange());
-  }, X = () => {
+    t.contains(n.startContainer) && (F.current = n.cloneRange());
+  }, Y = () => {
     const e = window.getSelection();
-    !e || !D.current || (e.removeAllRanges(), e.addRange(D.current));
+    !e || !F.current || (e.removeAllRanges(), e.addRange(F.current));
   }, me = (e, t) => {
     const n = window.getSelection();
-    n && n.rangeCount > 0 && (D.current = n.getRangeAt(0)), X(), document.execCommand(e, !1, t), A();
+    n && n.rangeCount > 0 && (F.current = n.getRangeAt(0)), Y(), document.execCommand(e, !1, t), A();
   };
-  I(() => {
-    const e = H();
+  U(() => {
+    const e = q();
     if (!e || !E) return;
-    const t = Ve(E);
+    const t = Ue(E);
     e.innerHTML = t, A();
   }, []);
-  const Ve = (e) => e.replace(/<span[^>]*data-hidden-table-start[^>]*>.*?<\/span>/g, "").replace(/<span[^>]*data-hidden-table-end[^>]*>.*?<\/span>/g, "").replace(/{{#arrayData}}/g, "").replace(/{{\/arrayData}}/g, "");
-  I(() => () => {
+  const Ue = (e) => e.replace(/(<table[\s\S]*?>[\s\S]*?<\/table>)/g, (t) => t.replace(/{{#arrayData}}/g, "").replace(/{{\/arrayData}}/g, ""));
+  U(() => () => {
     document.removeEventListener("mousemove", null), document.removeEventListener("mouseup", null);
-  }, []), I(() => {
-    S && S((e) => {
+  }, []), U(() => {
+    x && x((e) => {
       Ke(e);
     });
-  }, []), I(() => {
-    const e = H();
+  }, []), U(() => {
+    const e = q();
     if (!e) return;
     e.querySelectorAll("table").forEach((n) => {
-      n.hasAttribute("data-has-resize-handle") || (le(n), n.querySelectorAll("th, td").forEach((d) => K(d)));
+      n.hasAttribute("data-has-resize-handle") || (le(n), n.querySelectorAll("th, td").forEach((d) => Q(d)));
     });
   }, []);
   const ge = (e) => {
@@ -949,22 +988,22 @@ const rn = ({
       c || (c = document.createElement(e), c.style.margin = "0", c.style.paddingLeft = "20px", d.appendChild(c)), o = c, l = document.createElement("li"), l.textContent = "​", o.appendChild(l);
     } else {
       document.execCommand(e === "ul" ? "insertUnorderedList" : "insertOrderedList");
-      const c = H();
+      const c = q();
       if (o = c == null ? void 0 : c.querySelector(`${e}:last-child`), !o) return;
       h && o.setAttribute("list-type", "static"), l = o.querySelector("li:last-child");
     }
     const y = document.createRange();
-    y.setStart(l, 0), y.collapse(!0), n.removeAllRanges(), n.addRange(y), (m = H()) == null || m.focus(), A();
+    y.setStart(l, 0), y.collapse(!0), n.removeAllRanges(), n.addRange(y), (m = q()) == null || m.focus(), A();
   }, ae = (e, t) => {
     e === "insertOrderedList" || e === "insertStaticOrderedList" ? fe("ol", e) : e === "insertUnorderedList" || e === "insertStaticUnorderedList" ? fe("ul", e) : e.startsWith("justify") ? dt(e) : me(e, t), e === "insertTable" && pe(), e === "insertStaticTable" && pe("insertStaticTable");
   }, $e = (e) => {
     const t = document.createElement("span");
     t.textContent = "​", e.insertNode(t), e.setStartAfter(t), e.collapse(!0);
     const n = t.getBoundingClientRect();
-    t.remove(), Y({
+    t.remove(), $({
       x: n.left,
       y: n.bottom + window.scrollY
-    }), x(r || []), j(!0), W.current = e.cloneRange();
+    }), M(r || []), z(!0), X.current = e.cloneRange();
   }, We = () => {
     const e = window.getSelection();
     if (!e || e.rangeCount === 0) return null;
@@ -988,7 +1027,7 @@ const rn = ({
     const t = window.getSelection();
     if (!t) return;
     const n = We();
-    n ? (t.removeAllRanges(), t.addRange(n)) : W.current && (t.removeAllRanges(), t.addRange(W.current));
+    n ? (t.removeAllRanges(), t.addRange(n)) : X.current && (t.removeAllRanges(), t.addRange(X.current));
     const a = document.createElement("span");
     a.textContent = `{{${e.name}}}`, a.style.display = "inline", a.setAttribute("data-mention", e.value || e.name || "");
     try {
@@ -996,10 +1035,10 @@ const rn = ({
       if (o)
         o.deleteContents(), o.insertNode(a);
       else {
-        const m = document.createRange(), c = H();
+        const m = document.createRange(), c = q();
         m.selectNodeContents(c), m.collapse(!1), m.insertNode(a);
       }
-      const h = document.createTextNode(" ");
+      const h = document.createTextNode("​");
       a.after(h);
       const y = document.createRange();
       y.setStartAfter(h), y.collapse(!0), t.removeAllRanges(), t.addRange(y);
@@ -1007,12 +1046,12 @@ const rn = ({
       console.error("insertMention error:", o);
     }
     let d = _e([...ue, e]);
-    re(d), R(d), j(!1), (l = H()) == null || l.focus(), A();
+    re(d), w(d), z(!1), (l = q()) == null || l.focus(), A();
   }, Xe = (e) => {
-    const t = H();
+    const t = q();
     if (!t) return;
     let n = null;
-    D.current && t.contains(D.current.startContainer) ? n = D.current.cloneRange() : (n = document.createRange(), n.selectNodeContents(t), n.collapse(!1));
+    F.current && t.contains(F.current.startContainer) ? n = F.current.cloneRange() : (n = document.createRange(), n.selectNodeContents(t), n.collapse(!1));
     const a = window.getSelection();
     if (!a) return;
     a.removeAllRanges(), a.addRange(n);
@@ -1021,14 +1060,14 @@ const rn = ({
     const l = document.createTextNode(" ");
     d.after(l);
     const o = document.createRange();
-    o.setStartAfter(l), o.collapse(!0), a.removeAllRanges(), a.addRange(o), D.current = o.cloneRange(), t.focus();
+    o.setStartAfter(l), o.collapse(!0), a.removeAllRanges(), a.addRange(o), F.current = o.cloneRange(), t.focus();
   }, Ke = (e) => {
     e.forEach((t) => Xe(t)), re((t) => {
       const n = [...t, ...e], a = Array.from(new Map(n.map((d) => [d.name, d])).values());
-      return R(a), a;
+      return w(a), a;
     }), A();
   }, Ye = () => {
-    const e = H();
+    const e = q();
     if (!e) return [];
     const t = e.querySelectorAll("span[data-mention]"), n = [];
     return t.forEach((a) => {
@@ -1058,8 +1097,8 @@ const rn = ({
           if (c) {
             const v = document.createElement("p");
             v.innerHTML = "<br />", (d = c.parentElement) == null || d.insertBefore(v, c.nextSibling), c.removeChild(o);
-            const w = document.createRange();
-            w.setStart(v, 0), w.collapse(!0), l == null || l.removeAllRanges(), l == null || l.addRange(w);
+            const C = document.createRange();
+            C.setStart(v, 0), C.collapse(!0), l == null || l.removeAllRanges(), l == null || l.addRange(C);
           }
         }
         A();
@@ -1084,7 +1123,7 @@ const rn = ({
       if (oe(a))
         return;
       setTimeout(() => {
-        $e(n.getRangeAt(0)), ne(""), x(r), j(!0);
+        $e(n.getRangeAt(0)), ne(""), M(r), z(!0);
       }, 0);
       return;
     }
@@ -1105,40 +1144,40 @@ const rn = ({
     const e = window.getSelection();
     if (!e || !e.anchorNode) return;
     if (oe(e.anchorNode)) {
-      j(!1);
+      z(!1);
       return;
     }
     let t = e.anchorNode.textContent || "";
     t = t.replace(/\u00A0/g, " ");
     const n = t.match(/@([^\n]*)$/);
     if (!n) {
-      j(!1);
+      z(!1);
       return;
     }
     const a = n[1].trim().toLowerCase();
     ne(a);
     const d = r.filter((l) => l.name.toLowerCase().includes(a));
-    d.length > 0 ? (x(d), j(!0)) : j(!1);
+    d.length > 0 ? (M(d), z(!0)) : z(!1);
   }, Ge = (e) => {
     var a;
     const t = (a = e.target.files) == null ? void 0 : a[0];
     if (!t) return;
     const n = new FileReader();
     n.onload = (d) => {
-      var w;
-      const l = (w = d.target) == null ? void 0 : w.result;
-      X();
+      var C;
+      const l = (C = d.target) == null ? void 0 : C.result;
+      Y();
       const o = window.getSelection();
       let h = o && o.rangeCount ? o.getRangeAt(0) : null;
       const y = document.createElement("img");
       y.src = l, y.alt = t.name || "image", y.className = "rte-inserted-image", y.contentEditable = "true";
-      const m = H();
+      const m = q();
       if (!h || !m) {
         m == null || m.appendChild(y);
-        const O = document.createTextNode(" ");
-        m == null || m.appendChild(O);
+        const I = document.createTextNode(" ");
+        m == null || m.appendChild(I);
         const ie = document.createRange();
-        ie.setStartAfter(O), ie.collapse(!0), o == null || o.removeAllRanges(), o == null || o.addRange(ie), m == null || m.focus(), A(), e.target.value = "";
+        ie.setStartAfter(I), ie.collapse(!0), o == null || o.removeAllRanges(), o == null || o.addRange(ie), m == null || m.focus(), A(), e.target.value = "";
         return;
       }
       h.deleteContents(), h.insertNode(y);
@@ -1149,14 +1188,14 @@ const rn = ({
     }, n.readAsDataURL(t);
   }, et = (e) => {
     var d;
-    X();
+    Y();
     const t = window.getSelection();
     if (!(t != null && t.rangeCount)) return;
     const n = t.getRangeAt(0), a = document.createTextNode(e);
-    n.insertNode(a), n.setStartAfter(a), n.collapse(!0), t.removeAllRanges(), t.addRange(n), (d = H()) == null || d.focus(), A();
+    n.insertNode(a), n.setStartAfter(a), n.collapse(!0), t.removeAllRanges(), t.addRange(n), (d = q()) == null || d.focus(), A();
   }, pe = (e) => {
     var c;
-    ft(), X();
+    ft(), Y();
     const t = document.createElement("table");
     t.style.borderCollapse = "collapse", t.style.width = "100%", t.style.border = "1px solid #ccc", t.style.margin = "8px 0", t.style.position = "relative", t.style.textAlign = "center", p.table && t.classList.add(p.table);
     const n = document.createElement("thead");
@@ -1168,10 +1207,10 @@ const rn = ({
     const l = document.createElement("tr");
     p.tr && l.classList.add(p.tr);
     for (let v = 0; v < 2; v++) {
-      const w = document.createElement("th");
-      w.textContent = "", w.style.border = "1px solid #999", w.style.padding = "4px", w.style.position = "relative", w.style.backgroundColor = "lightgray", w.style.height = "20px", p.th && w.classList.add(p.th);
-      const O = document.createElement("td");
-      O.textContent = "", O.style.border = "1px solid #999", O.style.padding = "4px", O.style.position = "relative", O.style.backgroundColor = "#fff", O.style.height = "20px", p.td && O.classList.add(p.td), K(w), K(O), d.appendChild(w), l.appendChild(O);
+      const C = document.createElement("th");
+      C.textContent = "", C.style.border = "1px solid #999", C.style.padding = "4px", C.style.position = "relative", C.style.backgroundColor = "lightgray", C.style.height = "20px", p.th && C.classList.add(p.th);
+      const I = document.createElement("td");
+      I.textContent = "", I.style.border = "1px solid #999", I.style.padding = "4px", I.style.position = "relative", I.style.backgroundColor = "#fff", I.style.height = "20px", p.td && I.classList.add(p.td), Q(C), Q(I), d.appendChild(C), l.appendChild(I);
     }
     n.appendChild(d), a.appendChild(l), t.appendChild(n), t.appendChild(a), le(t);
     const o = window.getSelection();
@@ -1181,7 +1220,7 @@ const rn = ({
     const y = document.createElement("p");
     y.innerHTML = "<br/>", t.after(y);
     const m = document.createRange();
-    m.setStart(y, 0), m.collapse(!0), o.removeAllRanges(), o.addRange(m), (c = H()) == null || c.focus(), A();
+    m.setStart(y, 0), m.collapse(!0), o.removeAllRanges(), o.addRange(m), (c = q()) == null || c.focus(), A();
   }, le = (e) => {
     if (e.dataset.hasResizeHandle === "true") return;
     const t = document.createElement("div");
@@ -1202,14 +1241,14 @@ const rn = ({
       const h = e.getBoundingClientRect();
       d = h.width, l = h.height;
       const y = (c) => {
-        const v = Math.max(100, d + (c.clientX - n)), w = Math.max(20, l + (c.clientY - a));
-        e.style.width = `${v}px`, e.style.height = `${w}px`, A();
+        const v = Math.max(100, d + (c.clientX - n)), C = Math.max(20, l + (c.clientY - a));
+        e.style.width = `${v}px`, e.style.height = `${C}px`, A();
       }, m = () => {
         document.removeEventListener("mousemove", y), document.removeEventListener("mouseup", m), A();
       };
       document.addEventListener("mousemove", y), document.addEventListener("mouseup", m);
     }), e.appendChild(t);
-  }, K = (e) => {
+  }, Q = (e) => {
     const t = document.createElement("div"), n = document.createElement("div");
     Object.assign(t.style, {
       position: "absolute",
@@ -1263,10 +1302,10 @@ const rn = ({
   }, ve = () => {
     document.querySelectorAll(".rte-cell-highlight").forEach((e) => e.classList.remove("rte-cell-highlight"));
   }, rt = (e) => {
-    if (!_.cell) return;
-    const t = _.cell.closest("table"), n = _.cell.cellIndex, a = _.cell.parentElement.rowIndex, d = (l) => {
+    if (!B.cell) return;
+    const t = B.cell.closest("table"), n = B.cell.cellIndex, a = B.cell.parentElement.rowIndex, d = (l) => {
       const o = l.tagName.toLowerCase(), h = document.createElement(o);
-      return h.textContent = "", h.style.cssText = l.style.cssText, K(h), h;
+      return h.textContent = "", h.style.cssText = l.style.cssText, Q(h), h;
     };
     switch (e) {
       case "insertRowAbove": {
@@ -1306,20 +1345,20 @@ const rn = ({
         });
         break;
     }
-    A(), f(se(ce({}, _), {
+    A(), f(se(ce({}, B), {
       visible: !1
     })), ve();
   }, at = () => {
-    Z(), Q.current = D.current, de({
+    K(), J.current = F.current, de({
       url: "",
       text: "",
       title: "",
       target: "_self"
-    }), F(!0);
+    }), V(!0);
   }, ot = (e) => {
     const t = window.getSelection();
-    if (!t || !Q.current) return;
-    t.removeAllRanges(), t.addRange(Q.current);
+    if (!t || !J.current) return;
+    t.removeAllRanges(), t.addRange(J.current);
     let n = e.url.trim();
     /^https?:\/\//i.test(n) || (n = "https://" + n);
     const a = document.createElement("a");
@@ -1329,7 +1368,7 @@ const rn = ({
     const l = document.createTextNode(" ");
     a.after(l);
     const o = document.createRange();
-    o.setStartAfter(l), o.collapse(!0), t.removeAllRanges(), t.addRange(o), F(!1), A();
+    o.setStartAfter(l), o.collapse(!0), t.removeAllRanges(), t.addRange(o), V(!1), A();
   }, lt = (e) => {
     const t = e.target;
     if (t.tagName === "A") {
@@ -1340,37 +1379,37 @@ const rn = ({
       }
       e.preventDefault();
       const a = document.createRange();
-      a.selectNode(n), Q.current = a, de({
+      a.selectNode(n), J.current = a, de({
         url: n.href,
         text: n.textContent || n.href,
         title: n.title,
         target: n.target
-      }), F(!0);
+      }), V(!0);
     }
   }, it = () => {
-    const e = H();
+    const e = q();
     if (!e) return;
     const t = window.getSelection();
-    if ((!t || t.rangeCount === 0) && D.current) {
+    if ((!t || t.rangeCount === 0) && F.current) {
       const c = window.getSelection();
-      c == null || c.removeAllRanges(), c == null || c.addRange(D.current);
+      c == null || c.removeAllRanges(), c == null || c.addRange(F.current);
     }
     const n = window.getSelection();
     if (!n || n.rangeCount === 0) return;
     const a = n.getRangeAt(0);
-    X(), document.execCommand("removeFormat", !1);
+    Y(), document.execCommand("removeFormat", !1);
     const d = a.cloneContents(), l = document.createElement("div");
     l.appendChild(d);
     const o = document.createTreeWalker(l, NodeFilter.SHOW_ELEMENT, null), h = [];
     for (; o.nextNode(); ) {
-      const c = o.currentNode, v = c.tagName.toUpperCase(), w = c.getAttribute && c.getAttribute("data-mention") !== null;
-      v !== "A" && !w && h.push(c);
+      const c = o.currentNode, v = c.tagName.toUpperCase(), C = c.getAttribute && c.getAttribute("data-mention") !== null;
+      v !== "A" && !C && h.push(c);
     }
     for (let c = h.length - 1; c >= 0; c--) {
-      const v = h[c], w = v.parentNode;
-      if (w) {
-        for (; v.firstChild; ) w.insertBefore(v.firstChild, v);
-        w.removeChild(v);
+      const v = h[c], C = v.parentNode;
+      if (C) {
+        for (; v.firstChild; ) C.insertBefore(v.firstChild, v);
+        C.removeChild(v);
       }
     }
     l.querySelectorAll("[style]").forEach((c) => c.removeAttribute("style")), a.deleteContents();
@@ -1455,16 +1494,16 @@ const rn = ({
     const h = document.createDocumentFragment();
     for (; a.firstChild; ) h.appendChild(a.firstChild);
     o.insertNode(h), o.collapse(!1), l.removeAllRanges(), l.addRange(o);
-    const y = M.current;
+    const y = R.current;
     y && (y.querySelectorAll("table").forEach((m) => {
       const c = m;
       c.hasAttribute("data-has-resize-handle") || (le(c), c.querySelectorAll("th, td").forEach((v) => {
-        const w = v;
-        w.dataset.hasResizeHandles || K(w);
+        const C = v;
+        C.dataset.hasResizeHandles || Q(C);
       }));
     }), A());
   }, mt = (e) => {
-    X();
+    Y();
     const t = window.getSelection();
     if (!t || !t.rangeCount) return;
     const n = t.getRangeAt(0), a = document.createElement("span");
@@ -1494,25 +1533,25 @@ const rn = ({
     } = e, a = document.createElement("span");
     a.textContent = "​", t.insertNode(a);
     const d = a.getBoundingClientRect();
-    a.remove(), Y({
+    a.remove(), $({
       x: d.left,
       y: d.bottom + window.scrollY
     }), ne(n.toLowerCase());
     const l = r.filter((o) => o.name.toLowerCase().includes(n.toLowerCase()));
-    x(l), j(!0), W.current = t.cloneRange();
+    M(l), z(!0), X.current = t.cloneRange();
   };
   function ft() {
-    const e = M.current;
+    const e = R.current;
     if (!e) return;
     const t = window.getSelection();
     if (!t || t.rangeCount > 0 && e.contains(t.anchorNode))
       return;
     const n = document.createRange();
-    n.selectNodeContents(e), n.collapse(!1), t.removeAllRanges(), t.addRange(n), D.current = n.cloneRange();
+    n.selectNodeContents(e), n.collapse(!1), t.removeAllRanges(), t.addRange(n), F.current = n.cloneRange();
   }
   const ht = (e) => {
     const t = e.target;
-    if (!t || !(t.textContent || "").match(/{{([\s\S]+?)}}/) || !M.current) return;
+    if (!t || !(t.textContent || "").match(/{{([\s\S]+?)}}/) || !R.current) return;
     let l = t.firstChild;
     if ((!l || l.nodeType !== Node.TEXT_NODE) && (l = t.childNodes[0]), !l || l.nodeType !== Node.TEXT_NODE) return;
     const o = l.textContent || "", h = o.indexOf("{{"), y = o.indexOf("}}");
@@ -1524,14 +1563,14 @@ const rn = ({
   };
   return /* @__PURE__ */ i.createElement("div", {
     className: `rte-wrapper ${(p == null ? void 0 : p.wrapper) || ""}`,
-    style: C.wrapper
+    style: b.wrapper
   }, /* @__PURE__ */ i.createElement("div", {
     style: {
       flex: 1
     }
   }, /* @__PURE__ */ i.createElement(Kt, {
     exec: ae,
-    saveSelection: Z,
+    saveSelection: K,
     handleFileChange: Ge,
     handleFontSizeChange: (e) => mt(e.target.value),
     handleFontFamilyChange: (e) => ae("fontName", e.target.value),
@@ -1540,58 +1579,58 @@ const rn = ({
     removeFormatting: it,
     visibleActions: Pe,
     className: p.toolbar,
-    style: C.toolbar
+    style: b.toolbar
   }), /* @__PURE__ */ i.createElement("div", {
-    ref: M,
+    ref: R,
     id: "rte-editor-body",
     className: `rte-editor ${(p == null ? void 0 : p.editor) || ""}`,
-    style: C.editor,
+    style: b.editor,
     contentEditable: !0,
     suppressContentEditableWarning: !0,
     onPaste: ut,
     onKeyUp: () => {
-      Z(), ye();
+      K(), ye();
     },
-    onMouseUp: Z,
+    onMouseUp: K,
     onInput: () => {
-      he(), Z();
+      he(), K();
     },
     onKeyDown: Qe,
     onBeforeInput: Je,
     onContextMenu: nt,
     onClick: (e) => {
-      lt(e), Z(), ye();
+      lt(e), K(), ye();
     },
     onDoubleClick: ht
   }), /* @__PURE__ */ i.createElement(Yt, {
     show: P,
-    position: q,
-    filtered: te,
+    position: _,
+    filtered: Z,
     insertMention: Ze,
-    onClose: () => j(!1),
+    onClose: () => z(!1),
     query: qe
   }), s && /* @__PURE__ */ i.createElement("div", {
     className: `rte-output ${(p == null ? void 0 : p.output) || ""}`,
-    style: C.output
-  }, /* @__PURE__ */ i.createElement("h4", null, "Output HTML:"), /* @__PURE__ */ i.createElement("p", null, U)), /* @__PURE__ */ i.createElement(Qt, {
-    visible: _.visible,
-    x: _.x,
-    y: _.y,
+    style: b.output
+  }, /* @__PURE__ */ i.createElement("h4", null, "Output HTML:"), /* @__PURE__ */ i.createElement("p", null, O)), /* @__PURE__ */ i.createElement(Qt, {
+    visible: B.visible,
+    x: B.x,
+    y: B.y,
     onAction: rt,
     onClose: () => {
-      f(se(ce({}, _), {
+      f(se(ce({}, B), {
         visible: !1
       })), ve();
     }
   }), /* @__PURE__ */ i.createElement(Gt, {
-    visible: b,
+    visible: L,
     linkData: Ie,
-    onClose: () => F(!1),
+    onClose: () => V(!1),
     onInsert: ot
   })), u ? /* @__PURE__ */ i.createElement(Jt, {
     className: p.preview,
-    style: C.preview,
-    html: U
+    style: b.preview,
+    html: O
   }) : null);
 };
 export {