@ryzeup/richtexteditor 1.0.18 → 1.0.19

package/dist/index.es.js

@@ -1,173 +1,173 @@
-var it = Object.defineProperty, st = Object.defineProperties;
-var dt = Object.getOwnPropertyDescriptors;
-var Le = Object.getOwnPropertySymbols;
-var ut = Object.prototype.hasOwnProperty, mt = Object.prototype.propertyIsEnumerable;
-var xe = (r, c, d) => c in r ? it(r, c, { enumerable: !0, configurable: !0, writable: !0, value: d }) : r[c] = d, ae = (r, c) => {
-  for (var d in c || (c = {}))
-    ut.call(c, d) && xe(r, d, c[d]);
-  if (Le)
-    for (var d of Le(c))
-      mt.call(c, d) && xe(r, d, c[d]);
+var dt = Object.defineProperty, ut = Object.defineProperties;
+var mt = Object.getOwnPropertyDescriptors;
+var xe = Object.getOwnPropertySymbols;
+var gt = Object.prototype.hasOwnProperty, ft = Object.prototype.propertyIsEnumerable;
+var Le = (r, i, d) => i in r ? dt(r, i, { enumerable: !0, configurable: !0, writable: !0, value: d }) : r[i] = d, ae = (r, i) => {
+  for (var d in i || (i = {}))
+    gt.call(i, d) && Le(r, d, i[d]);
+  if (xe)
+    for (var d of xe(i))
+      ft.call(i, d) && Le(r, d, i[d]);
   return r;
-}, oe = (r, c) => st(r, dt(c));
-import * as gt from "react";
-import o, { useRef as P, useState as M, useEffect as I } from "react";
-import { createPortal as ft } from "react-dom";
-window.React = gt;
-var Ne = {
+}, oe = (r, i) => ut(r, mt(i));
+import * as ht from "react";
+import o, { useRef as P, useState as A, useEffect as I } from "react";
+import { createPortal as pt } from "react-dom";
+window.React = ht;
+var ke = {
   color: void 0,
   size: void 0,
   className: void 0,
   style: void 0,
   attr: void 0
-}, Se = o.createContext && /* @__PURE__ */ o.createContext(Ne), ht = ["attr", "size", "title"];
-function pt(r, c) {
+}, Se = o.createContext && /* @__PURE__ */ o.createContext(ke), vt = ["attr", "size", "title"];
+function yt(r, i) {
   if (r == null) return {};
-  var d = vt(r, c), u, m;
+  var d = Et(r, i), u, f;
   if (Object.getOwnPropertySymbols) {
-    var y = Object.getOwnPropertySymbols(r);
-    for (m = 0; m < y.length; m++)
-      u = y[m], !(c.indexOf(u) >= 0) && Object.prototype.propertyIsEnumerable.call(r, u) && (d[u] = r[u]);
+    var w = Object.getOwnPropertySymbols(r);
+    for (f = 0; f < w.length; f++)
+      u = w[f], !(i.indexOf(u) >= 0) && Object.prototype.propertyIsEnumerable.call(r, u) && (d[u] = r[u]);
   }
   return d;
 }
-function vt(r, c) {
+function Et(r, i) {
   if (r == null) return {};
   var d = {};
   for (var u in r)
     if (Object.prototype.hasOwnProperty.call(r, u)) {
-      if (c.indexOf(u) >= 0) continue;
+      if (i.indexOf(u) >= 0) continue;
       d[u] = r[u];
     }
   return d;
 }
-function J() {
-  return J = Object.assign ? Object.assign.bind() : function(r) {
-    for (var c = 1; c < arguments.length; c++) {
-      var d = arguments[c];
+function Q() {
+  return Q = Object.assign ? Object.assign.bind() : function(r) {
+    for (var i = 1; i < arguments.length; i++) {
+      var d = arguments[i];
       for (var u in d)
         Object.prototype.hasOwnProperty.call(d, u) && (r[u] = d[u]);
     }
     return r;
-  }, J.apply(this, arguments);
+  }, Q.apply(this, arguments);
 }
-function Me(r, c) {
+function Me(r, i) {
   var d = Object.keys(r);
   if (Object.getOwnPropertySymbols) {
     var u = Object.getOwnPropertySymbols(r);
-    c && (u = u.filter(function(m) {
-      return Object.getOwnPropertyDescriptor(r, m).enumerable;
+    i && (u = u.filter(function(f) {
+      return Object.getOwnPropertyDescriptor(r, f).enumerable;
     })), d.push.apply(d, u);
   }
   return d;
 }
-function G(r) {
-  for (var c = 1; c < arguments.length; c++) {
-    var d = arguments[c] != null ? arguments[c] : {};
-    c % 2 ? Me(Object(d), !0).forEach(function(u) {
-      Et(r, u, d[u]);
+function J(r) {
+  for (var i = 1; i < arguments.length; i++) {
+    var d = arguments[i] != null ? arguments[i] : {};
+    i % 2 ? Me(Object(d), !0).forEach(function(u) {
+      wt(r, u, d[u]);
     }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(r, Object.getOwnPropertyDescriptors(d)) : Me(Object(d)).forEach(function(u) {
       Object.defineProperty(r, u, Object.getOwnPropertyDescriptor(d, u));
     });
   }
   return r;
 }
-function Et(r, c, d) {
-  return c = yt(c), c in r ? Object.defineProperty(r, c, { value: d, enumerable: !0, configurable: !0, writable: !0 }) : r[c] = d, r;
+function wt(r, i, d) {
+  return i = Ct(i), i in r ? Object.defineProperty(r, i, { value: d, enumerable: !0, configurable: !0, writable: !0 }) : r[i] = d, r;
 }
-function yt(r) {
-  var c = wt(r, "string");
-  return typeof c == "symbol" ? c : c + "";
+function Ct(r) {
+  var i = bt(r, "string");
+  return typeof i == "symbol" ? i : i + "";
 }
-function wt(r, c) {
+function bt(r, i) {
   if (typeof r != "object" || !r) return r;
   var d = r[Symbol.toPrimitive];
   if (d !== void 0) {
-    var u = d.call(r, c);
+    var u = d.call(r, i);
     if (typeof u != "object") return u;
     throw new TypeError("@@toPrimitive must return a primitive value.");
   }
-  return (c === "string" ? String : Number)(r);
+  return (i === "string" ? String : Number)(r);
 }
-function ke(r) {
-  return r && r.map((c, d) => /* @__PURE__ */ o.createElement(c.tag, G({
+function Ne(r) {
+  return r && r.map((i, d) => /* @__PURE__ */ o.createElement(i.tag, J({
     key: d
-  }, c.attr), ke(c.child)));
+  }, i.attr), Ne(i.child)));
 }
 function z(r) {
-  return (c) => /* @__PURE__ */ o.createElement(Ct, J({
-    attr: G({}, r.attr)
-  }, c), ke(r.child));
+  return (i) => /* @__PURE__ */ o.createElement(Rt, Q({
+    attr: J({}, r.attr)
+  }, i), Ne(r.child));
 }
-function Ct(r) {
-  var c = (d) => {
+function Rt(r) {
+  var i = (d) => {
     var {
       attr: u,
-      size: m,
-      title: y
-    } = r, b = pt(r, ht), R = m || d.size || "1em", E;
-    return d.className && (E = d.className), r.className && (E = (E ? E + " " : "") + r.className), /* @__PURE__ */ o.createElement("svg", J({
+      size: f,
+      title: w
+    } = r, R = yt(r, vt), b = f || d.size || "1em", p;
+    return d.className && (p = d.className), r.className && (p = (p ? p + " " : "") + r.className), /* @__PURE__ */ o.createElement("svg", Q({
       stroke: "currentColor",
       fill: "currentColor",
       strokeWidth: "0"
-    }, d.attr, u, b, {
-      className: E,
-      style: G(G({
+    }, d.attr, u, R, {
+      className: p,
+      style: J(J({
         color: r.color || d.color
       }, d.style), r.style),
-      height: R,
-      width: R,
+      height: b,
+      width: b,
       xmlns: "http://www.w3.org/2000/svg"
-    }), y && /* @__PURE__ */ o.createElement("title", null, y), r.children);
+    }), w && /* @__PURE__ */ o.createElement("title", null, w), r.children);
   };
-  return Se !== void 0 ? /* @__PURE__ */ o.createElement(Se.Consumer, null, (d) => c(d)) : c(Ne);
+  return Se !== void 0 ? /* @__PURE__ */ o.createElement(Se.Consumer, null, (d) => i(d)) : i(ke);
 }
-function bt(r) {
+function xt(r) {
   return z({ attr: { viewBox: "0 0 448 512" }, child: [{ tag: "path", attr: { d: "M352 64c0-17.7-14.3-32-32-32L128 32c-17.7 0-32 14.3-32 32s14.3 32 32 32l192 0c17.7 0 32-14.3 32-32zm96 128c0-17.7-14.3-32-32-32L32 160c-17.7 0-32 14.3-32 32s14.3 32 32 32l384 0c17.7 0 32-14.3 32-32zM0 448c0 17.7 14.3 32 32 32l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L32 416c-17.7 0-32 14.3-32 32zM352 320c0-17.7-14.3-32-32-32l-192 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l192 0c17.7 0 32-14.3 32-32z" }, child: [] }] })(r);
 }
-function Rt(r) {
+function Lt(r) {
   return z({ attr: { viewBox: "0 0 448 512" }, child: [{ tag: "path", attr: { d: "M448 64c0 17.7-14.3 32-32 32L192 96c-17.7 0-32-14.3-32-32s14.3-32 32-32l224 0c17.7 0 32 14.3 32 32zm0 256c0 17.7-14.3 32-32 32l-224 0c-17.7 0-32-14.3-32-32s14.3-32 32-32l224 0c17.7 0 32 14.3 32 32zM0 192c0-17.7 14.3-32 32-32l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 224c-17.7 0-32-14.3-32-32zM448 448c0 17.7-14.3 32-32 32L32 480c-17.7 0-32-14.3-32-32s14.3-32 32-32l384 0c17.7 0 32 14.3 32 32z" }, child: [] }] })(r);
 }
-function Lt(r) {
+function St(r) {
   return z({ attr: { viewBox: "0 0 512 512" }, child: [{ tag: "path", attr: { d: "M0 96C0 60.7 28.7 32 64 32l384 0c35.3 0 64 28.7 64 64l0 320c0 35.3-28.7 64-64 64L64 480c-35.3 0-64-28.7-64-64L0 96zM323.8 202.5c-4.5-6.6-11.9-10.5-19.8-10.5s-15.4 3.9-19.8 10.5l-87 127.6L170.7 297c-4.6-5.7-11.5-9-18.7-9s-14.2 3.3-18.7 9l-64 80c-5.8 7.2-6.9 17.1-2.9 25.4s12.4 13.6 21.6 13.6l96 0 32 0 208 0c8.9 0 17.1-4.9 21.2-12.8s3.6-17.4-1.4-24.7l-120-176zM112 192a48 48 0 1 0 0-96 48 48 0 1 0 0 96z" }, child: [] }] })(r);
 }
-function xt(r) {
+function Mt(r) {
   return z({ 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 St(r) {
+function At(r) {
   return z({ 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 Mt(r) {
+function zt(r) {
   return z({ 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 zt(r) {
+function kt(r) {
   return z({ attr: { viewBox: "0 0 544 512" }, child: [{ tag: "path", attr: { d: "M0 479.98L99.92 512l35.45-35.45-67.04-67.04L0 479.98zm124.61-240.01a36.592 36.592 0 0 0-10.79 38.1l13.05 42.83-50.93 50.94 96.23 96.23 50.86-50.86 42.74 13.08c13.73 4.2 28.65-.01 38.15-10.78l35.55-41.64-173.34-173.34-41.52 35.44zm403.31-160.7l-63.2-63.2c-20.49-20.49-53.38-21.52-75.12-2.35L190.55 183.68l169.77 169.78L530.27 154.4c19.18-21.74 18.15-54.63-2.35-75.13z" }, child: [] }] })(r);
 }
-function At(r) {
+function Nt(r) {
   return z({ attr: { viewBox: "0 0 320 512" }, child: [{ tag: "path", attr: { d: "M320 48v32a16 16 0 0 1-16 16h-62.76l-80 320H208a16 16 0 0 1 16 16v32a16 16 0 0 1-16 16H16a16 16 0 0 1-16-16v-32a16 16 0 0 1 16-16h62.76l80-320H112a16 16 0 0 1-16-16V48a16 16 0 0 1 16-16h192a16 16 0 0 1 16 16z" }, child: [] }] })(r);
 }
-function Nt(r) {
+function Tt(r) {
   return z({ attr: { viewBox: "0 0 512 512" }, child: [{ tag: "path", attr: { d: "M326.612 185.391c59.747 59.809 58.927 155.698.36 214.59-.11.12-.24.25-.36.37l-67.2 67.2c-59.27 59.27-155.699 59.262-214.96 0-59.27-59.26-59.27-155.7 0-214.96l37.106-37.106c9.84-9.84 26.786-3.3 27.294 10.606.648 17.722 3.826 35.527 9.69 52.721 1.986 5.822.567 12.262-3.783 16.612l-13.087 13.087c-28.026 28.026-28.905 73.66-1.155 101.96 28.024 28.579 74.086 28.749 102.325.51l67.2-67.19c28.191-28.191 28.073-73.757 0-101.83-3.701-3.694-7.429-6.564-10.341-8.569a16.037 16.037 0 0 1-6.947-12.606c-.396-10.567 3.348-21.456 11.698-29.806l21.054-21.055c5.521-5.521 14.182-6.199 20.584-1.731a152.482 152.482 0 0 1 20.522 17.197zM467.547 44.449c-59.261-59.262-155.69-59.27-214.96 0l-67.2 67.2c-.12.12-.25.25-.36.37-58.566 58.892-59.387 154.781.36 214.59a152.454 152.454 0 0 0 20.521 17.196c6.402 4.468 15.064 3.789 20.584-1.731l21.054-21.055c8.35-8.35 12.094-19.239 11.698-29.806a16.037 16.037 0 0 0-6.947-12.606c-2.912-2.005-6.64-4.875-10.341-8.569-28.073-28.073-28.191-73.639 0-101.83l67.2-67.19c28.239-28.239 74.3-28.069 102.325.51 27.75 28.3 26.872 73.934-1.155 101.96l-13.087 13.087c-4.35 4.35-5.769 10.79-3.783 16.612 5.864 17.194 9.042 34.999 9.69 52.721.509 13.906 17.454 20.446 27.294 10.606l37.106-37.106c59.271-59.259 59.271-155.699.001-214.959z" }, child: [] }] })(r);
 }
-function kt(r) {
+function Dt(r) {
   return z({ attr: { viewBox: "0 0 512 512" }, child: [{ tag: "path", attr: { d: "M80 368H16a16 16 0 0 0-16 16v64a16 16 0 0 0 16 16h64a16 16 0 0 0 16-16v-64a16 16 0 0 0-16-16zm0-320H16A16 16 0 0 0 0 64v64a16 16 0 0 0 16 16h64a16 16 0 0 0 16-16V64a16 16 0 0 0-16-16zm0 160H16a16 16 0 0 0-16 16v64a16 16 0 0 0 16 16h64a16 16 0 0 0 16-16v-64a16 16 0 0 0-16-16zm416 176H176a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h320a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zm0-320H176a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h320a16 16 0 0 0 16-16V80a16 16 0 0 0-16-16zm0 160H176a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h320a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z" }, child: [] }] })(r);
 }
-function Tt(r) {
+function Ot(r) {
   return z({ attr: { viewBox: "0 0 496 512" }, child: [{ tag: "path", attr: { d: "M248 8C111 8 0 119 0 256s111 248 248 248 248-111 248-248S385 8 248 8zm80 168c17.7 0 32 14.3 32 32s-14.3 32-32 32-32-14.3-32-32 14.3-32 32-32zm-160 0c17.7 0 32 14.3 32 32s-14.3 32-32 32-32-14.3-32-32 14.3-32 32-32zm194.8 170.2C334.3 380.4 292.5 400 248 400s-86.3-19.6-114.8-53.8c-13.6-16.3 11-36.7 24.6-20.5 22.4 26.9 55.2 42.2 90.2 42.2s67.8-15.4 90.2-42.2c13.4-16.2 38.1 4.2 24.6 20.5z" }, child: [] }] })(r);
 }
-function Dt(r) {
+function Ht(r) {
   return z({ attr: { viewBox: "0 0 512 512" }, child: [{ tag: "path", attr: { d: "M464 32H48C21.49 32 0 53.49 0 80v352c0 26.51 21.49 48 48 48h416c26.51 0 48-21.49 48-48V80c0-26.51-21.49-48-48-48zM224 416H64v-96h160v96zm0-160H64v-96h160v96zm224 160H288v-96h160v96zm0-160H288v-96h160v96z" }, child: [] }] })(r);
 }
-function Ot(r) {
+function _t(r) {
   return z({ attr: { viewBox: "0 0 448 512" }, child: [{ tag: "path", attr: { d: "M32 64h32v160c0 88.22 71.78 160 160 160s160-71.78 160-160V64h32a16 16 0 0 0 16-16V16a16 16 0 0 0-16-16H272a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h32v160a80 80 0 0 1-160 0V64h32a16 16 0 0 0 16-16V16a16 16 0 0 0-16-16H32a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16zm400 384H16a16 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 jt(r) {
   return z({ attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { fill: "none", d: "M0 0h24v24H0z" }, child: [] }, { tag: "path", attr: { d: "M2 20h20v4H2v-4zm3.49-3h2.42l1.27-3.58h5.65L16.09 17h2.42L13.25 3h-2.5L5.49 17zm4.42-5.61 2.03-5.79h.12l2.03 5.79H9.91z" }, child: [] }] })(r);
 }
-function jt(r) {
+function Ft(r) {
   return z({ attr: { viewBox: "0 0 24 24" }, child: [{ tag: "path", attr: { fill: "none", d: "M0 0h24v24H0V0z" }, child: [] }, { tag: "path", attr: { d: "M20 8V5H6.39l3 3h1.83l-.55 1.28 2.09 2.1L14.21 8zM3.41 4.86 2 6.27l6.97 6.97L6.5 19h3l1.57-3.66L16.73 21l1.41-1.41z" }, child: [] }] })(r);
 }
-const _t = [
+const Pt = [
   "😀",
   "😁",
   "😂",
@@ -279,57 +279,57 @@ const _t = [
   "👏",
   "🫶",
   "👐"
-], Ft = ({
+], It = ({
   exec: r,
-  saveSelection: c,
+  saveSelection: i,
   handleFileChange: d,
   handleFontSizeChange: u,
-  handleFontFamilyChange: m,
+  handleFontFamilyChange: f,
   //   insertListBlock,
-  insertEmoji: y,
-  handleLink: b,
-  removeFormatting: R,
-  visibleActions: E,
+  insertEmoji: w,
+  handleLink: R,
+  removeFormatting: b,
+  visibleActions: p,
   className: O,
-  style: _
+  style: j
 }) => {
-  var V, T;
-  const A = P(null), j = P(null), L = P(null), [K, $] = M(!1), [q, B] = M({
+  var U, D;
+  const k = P(null), _ = P(null), L = P(null), [K, W] = A(!1), [q, B] = A({
     x: 0,
     y: 0
   });
   I(() => {
-    const f = (w) => {
-      !w.target.closest(".rte-emoji-popup") && !w.target.closest("button[title='Emoji']") && $(!1);
+    const m = (C) => {
+      !C.target.closest(".rte-emoji-popup") && !C.target.closest("button[title='Emoji']") && W(!1);
     };
-    return document.addEventListener("mousedown", f), () => document.removeEventListener("mousedown", f);
+    return document.addEventListener("mousedown", m), () => document.removeEventListener("mousedown", m);
   }, []);
-  const F = (f) => {
+  const F = (m) => {
     var H;
-    f.preventDefault();
-    const w = f.currentTarget.dataset.command;
-    if (w)
-      switch (w) {
+    m.preventDefault();
+    const C = m.currentTarget.dataset.command;
+    if (C)
+      switch (C) {
         case "bold":
         case "italic":
         case "underline":
         case "insertUnorderedList":
         case "insertOrderedList":
         case "removeFormat":
-          r(w);
+          r(C);
           break;
         case "insertImage": {
-          (H = A.current) == null || H.click();
+          (H = k.current) == null || H.click();
           break;
         }
         default:
-          console.warn("Unknown command:", w);
+          console.warn("Unknown command:", C);
       }
-  }, ee = (f) => {
-    r("foreColor", f.target.value);
-  }, te = (f) => {
-    r("backColor", f.target.value);
-  }, [S, k] = M({
+  }, G = (m) => {
+    r("foreColor", m.target.value);
+  }, ee = (m) => {
+    r("backColor", m.target.value);
+  }, [M, N] = A({
     bold: !1,
     italic: !1,
     underline: !1,
@@ -347,8 +347,8 @@ const _t = [
     highlight: !1
   });
   return I(() => {
-    const f = () => {
-      k({
+    const m = () => {
+      N({
         bold: document.queryCommandState("bold"),
         italic: document.queryCommandState("italic"),
         underline: document.queryCommandState("underline"),
@@ -366,117 +366,117 @@ const _t = [
         highlight: document.queryCommandState("backColor")
       });
     };
-    return document.addEventListener("selectionchange", f), () => document.removeEventListener("selectionchange", f);
+    return document.addEventListener("selectionchange", m), () => document.removeEventListener("selectionchange", m);
   }, []), /* @__PURE__ */ o.createElement("div", {
     className: `rte-toolbar ${O || ""}`,
-    style: _
-  }, E.bold && /* @__PURE__ */ o.createElement("button", {
+    style: j
+  }, p.bold && /* @__PURE__ */ o.createElement("button", {
     "data-command": "bold",
     title: "Bold",
     onMouseDown: F,
-    className: S.bold ? "rte-active" : ""
-  }, /* @__PURE__ */ o.createElement(Mt, null)), E.italic && /* @__PURE__ */ o.createElement("button", {
+    className: M.bold ? "rte-active" : ""
+  }, /* @__PURE__ */ o.createElement(zt, null)), p.italic && /* @__PURE__ */ o.createElement("button", {
     "data-command": "italic",
     title: "Italic",
     onMouseDown: F,
-    className: S.italic ? "rte-active" : ""
-  }, /* @__PURE__ */ o.createElement(At, null)), E.underline && /* @__PURE__ */ o.createElement("button", {
+    className: M.italic ? "rte-active" : ""
+  }, /* @__PURE__ */ o.createElement(Nt, null)), p.underline && /* @__PURE__ */ o.createElement("button", {
     "data-command": "underline",
     title: "Underline",
     onMouseDown: F,
-    className: S.underline ? "rte-active" : ""
-  }, /* @__PURE__ */ o.createElement(Ot, null)), E.unorderedList && /* @__PURE__ */ o.createElement("button", {
+    className: M.underline ? "rte-active" : ""
+  }, /* @__PURE__ */ o.createElement(_t, null)), p.unorderedList && /* @__PURE__ */ o.createElement("button", {
     "data-command": "insertUnorderedList",
     onMouseDown: F,
     title: "UnorderedList",
-    className: S.unorderedList ? "rte-active" : ""
-  }, /* @__PURE__ */ o.createElement(kt, null)), E.orderedList && /* @__PURE__ */ o.createElement("button", {
+    className: M.unorderedList ? "rte-active" : ""
+  }, /* @__PURE__ */ o.createElement(Dt, null)), p.orderedList && /* @__PURE__ */ o.createElement("button", {
     "data-command": "insertOrderedList",
     title: "OrderedList",
     onMouseDown: F,
-    className: S.orderedList ? "rte-active" : ""
-  }, /* @__PURE__ */ o.createElement(xt, null)), E.link && /* @__PURE__ */ o.createElement("button", {
+    className: M.orderedList ? "rte-active" : ""
+  }, /* @__PURE__ */ o.createElement(Mt, null)), p.link && /* @__PURE__ */ o.createElement("button", {
     "data-command": "createLink",
     title: "Link",
-    onClick: b,
-    className: S.link ? "rte-active" : ""
-  }, /* @__PURE__ */ o.createElement(Nt, null)), E.removeFormat && /* @__PURE__ */ o.createElement("button", {
+    onClick: R,
+    className: M.link ? "rte-active" : ""
+  }, /* @__PURE__ */ o.createElement(Tt, null)), p.removeFormat && /* @__PURE__ */ o.createElement("button", {
     "data-command": "Remove format",
     title: "removeFormat",
-    onMouseDown: (f) => {
-      f.preventDefault(), c(), R();
+    onMouseDown: (m) => {
+      m.preventDefault(), i(), b();
     },
-    className: S.removeFormat ? "rte-active" : ""
-  }, /* @__PURE__ */ o.createElement(jt, null)), E.image && /* @__PURE__ */ o.createElement("button", {
+    className: M.removeFormat ? "rte-active" : ""
+  }, /* @__PURE__ */ o.createElement(Ft, null)), p.image && /* @__PURE__ */ o.createElement("button", {
     "data-command": "insertImage",
     title: "Image",
     onMouseDown: F,
-    className: S.image ? "rte-active" : ""
-  }, /* @__PURE__ */ o.createElement(Lt, null)), /* @__PURE__ */ o.createElement("input", {
+    className: M.image ? "rte-active" : ""
+  }, /* @__PURE__ */ o.createElement(St, null)), /* @__PURE__ */ o.createElement("input", {
     type: "file",
     accept: "image/*",
-    ref: A,
+    ref: k,
     style: {
       display: "none"
     },
     onChange: d
-  }), E.emoji && /* @__PURE__ */ o.createElement("div", {
+  }), p.emoji && /* @__PURE__ */ o.createElement("div", {
     style: {
       position: "relative"
     }
   }, /* @__PURE__ */ o.createElement("button", {
     title: "Emoji",
-    onMouseDown: (f) => {
-      f.preventDefault(), c();
-      const w = f.currentTarget.getBoundingClientRect();
+    onMouseDown: (m) => {
+      m.preventDefault(), i();
+      const C = m.currentTarget.getBoundingClientRect();
       B({
-        x: w.left,
-        y: w.bottom + 8
+        x: C.left,
+        y: C.bottom + 8
         // small spacing
-      }), $((H) => !H);
+      }), W((H) => !H);
     },
-    className: S.emoji ? "rte-active" : ""
-  }, /* @__PURE__ */ o.createElement(Tt, null)), K && /* @__PURE__ */ ft(/* @__PURE__ */ o.createElement("div", {
+    className: M.emoji ? "rte-active" : ""
+  }, /* @__PURE__ */ o.createElement(Ot, null)), K && /* @__PURE__ */ pt(/* @__PURE__ */ o.createElement("div", {
     className: "rte-emoji-popup",
     style: {
       top: q.y,
       left: q.x
     }
-  }, _t.map((f, w) => /* @__PURE__ */ o.createElement("span", {
-    key: w,
+  }, Pt.map((m, C) => /* @__PURE__ */ o.createElement("span", {
+    key: C,
     style: {
       fontSize: "20px",
       cursor: "pointer",
       textAlign: "center"
     },
     onMouseDown: (H) => {
-      H.preventDefault(), y(f), $(!1);
+      H.preventDefault(), w(m), W(!1);
     }
-  }, f))), document.body)), E.color && /* @__PURE__ */ o.createElement("div", {
+  }, m))), document.body)), p.color && /* @__PURE__ */ o.createElement("div", {
     style: {
       position: "relative"
     }
   }, /* @__PURE__ */ o.createElement("button", {
     title: "Text Color",
-    onMouseDown: (f) => {
-      var w;
-      f.preventDefault(), c(), (w = j.current) == null || w.click();
+    onMouseDown: (m) => {
+      var C;
+      m.preventDefault(), i(), (C = _.current) == null || C.click();
     },
     style: {
       display: "flex",
       alignItems: "center",
       justifyContent: "center",
-      color: ((V = j.current) == null ? void 0 : V.value) || "#000",
+      color: ((U = _.current) == null ? void 0 : U.value) || "#000",
       fontSize: "18px"
     },
-    className: S.color ? "rte-active" : ""
-  }, /* @__PURE__ */ o.createElement(Ht, null)), /* @__PURE__ */ o.createElement("input", {
-    ref: j,
+    className: M.color ? "rte-active" : ""
+  }, /* @__PURE__ */ o.createElement(jt, null)), /* @__PURE__ */ o.createElement("input", {
+    ref: _,
     type: "color",
     defaultValue: "#000000",
-    onChange: (f) => {
-      var w;
-      ee(f), ((w = f.target.parentElement) == null ? void 0 : w.querySelector("button")).style.color = f.target.value;
+    onChange: (m) => {
+      var C;
+      G(m), ((C = m.target.parentElement) == null ? void 0 : C.querySelector("button")).style.color = m.target.value;
     },
     style: {
       position: "absolute",
@@ -485,30 +485,30 @@ const _t = [
       height: 0,
       pointerEvents: "none"
     }
-  })), E.highlight && /* @__PURE__ */ o.createElement("div", {
+  })), p.highlight && /* @__PURE__ */ o.createElement("div", {
     style: {
       position: "relative"
     }
   }, /* @__PURE__ */ o.createElement("button", {
     title: "Highlight",
-    onMouseDown: (f) => {
-      var w;
-      f.preventDefault(), c(), (w = L.current) == null || w.click();
+    onMouseDown: (m) => {
+      var C;
+      m.preventDefault(), i(), (C = L.current) == null || C.click();
     },
     style: {
       display: "flex",
       alignItems: "center",
       justifyContent: "center",
-      color: ((T = L.current) == null ? void 0 : T.value) || "#000",
+      color: ((D = L.current) == null ? void 0 : D.value) || "#000",
       fontSize: "18px"
     },
-    className: S.highlight ? "rte-active" : ""
-  }, /* @__PURE__ */ o.createElement(zt, null)), /* @__PURE__ */ o.createElement("input", {
+    className: M.highlight ? "rte-active" : ""
+  }, /* @__PURE__ */ o.createElement(kt, null)), /* @__PURE__ */ o.createElement("input", {
     ref: L,
     type: "color",
-    onChange: (f) => {
-      var w;
-      te(f), ((w = f.target.parentElement) == null ? void 0 : w.querySelector("button")).style.color = f.target.value;
+    onChange: (m) => {
+      var C;
+      ee(m), ((C = m.target.parentElement) == null ? void 0 : C.querySelector("button")).style.color = m.target.value;
     },
     defaultValue: "#000000",
     style: {
@@ -518,31 +518,31 @@ const _t = [
       height: 0,
       pointerEvents: "none"
     }
-  })), E.align && /* @__PURE__ */ o.createElement(o.Fragment, null, /* @__PURE__ */ o.createElement("button", {
+  })), p.align && /* @__PURE__ */ o.createElement(o.Fragment, null, /* @__PURE__ */ o.createElement("button", {
     title: "Align Left",
-    onMouseDown: (f) => f.preventDefault(),
+    onMouseDown: (m) => m.preventDefault(),
     onClick: () => r("justifyLeft"),
-    className: S.alignLeft ? "rte-active" : ""
-  }, /* @__PURE__ */ o.createElement(St, null)), /* @__PURE__ */ o.createElement("button", {
+    className: M.alignLeft ? "rte-active" : ""
+  }, /* @__PURE__ */ o.createElement(At, null)), /* @__PURE__ */ o.createElement("button", {
     title: "Align Center",
-    onMouseDown: (f) => f.preventDefault(),
+    onMouseDown: (m) => m.preventDefault(),
     onClick: () => r("justifyCenter"),
-    className: S.alignCenter ? "rte-active" : ""
-  }, /* @__PURE__ */ o.createElement(bt, null)), /* @__PURE__ */ o.createElement("button", {
+    className: M.alignCenter ? "rte-active" : ""
+  }, /* @__PURE__ */ o.createElement(xt, null)), /* @__PURE__ */ o.createElement("button", {
     title: "Align Right",
-    onMouseDown: (f) => f.preventDefault(),
+    onMouseDown: (m) => m.preventDefault(),
     onClick: () => r("justifyRight"),
-    className: S.alignRight ? "rte-active" : ""
-  }, /* @__PURE__ */ o.createElement(Rt, null))), E.table && /* @__PURE__ */ o.createElement("button", {
+    className: M.alignRight ? "rte-active" : ""
+  }, /* @__PURE__ */ o.createElement(Lt, null))), p.table && /* @__PURE__ */ o.createElement("button", {
     title: "Insert Table",
-    onMouseDown: (f) => f.preventDefault(),
+    onMouseDown: (m) => m.preventDefault(),
     onClick: () => r("insertTable"),
-    className: S.table ? "rte-active" : ""
-  }, /* @__PURE__ */ o.createElement(Dt, null)), E.fontFamily && /* @__PURE__ */ o.createElement("select", {
+    className: M.table ? "rte-active" : ""
+  }, /* @__PURE__ */ o.createElement(Ht, null)), p.fontFamily && /* @__PURE__ */ o.createElement("select", {
     className: "rte-dropdown",
     defaultValue: "",
-    onMouseDown: () => c(),
-    onChange: m
+    onMouseDown: () => i(),
+    onChange: f
   }, /* @__PURE__ */ o.createElement("option", {
     value: "",
     disabled: !0
@@ -556,62 +556,59 @@ const _t = [
     value: "Courier New"
   }, "Courier New"), /* @__PURE__ */ o.createElement("option", {
     value: "Verdana"
-  }, "Verdana")), E.fontSize && /* @__PURE__ */ o.createElement("select", {
-    className: "rte-dropdown",
+  }, "Verdana")), p.fontSize && /* @__PURE__ */ o.createElement("select", {
+    className: "rte-dropdown rte-fontsize-dropdown",
     defaultValue: "",
-    onMouseDown: () => c(),
+    onMouseDown: () => i(),
     onChange: u
   }, /* @__PURE__ */ o.createElement("option", {
     value: "",
     disabled: !0
-  }, "Font Size"), /* @__PURE__ */ o.createElement("option", {
-    value: "2"
-  }, "Small "), /* @__PURE__ */ o.createElement("option", {
-    value: "3"
-  }, "Normal"), /* @__PURE__ */ o.createElement("option", {
-    value: "4"
-  }, "Medium"), /* @__PURE__ */ o.createElement("option", {
-    value: "5"
-  }, "Large")));
-}, Pt = ({
+  }, "Font Size"), Array.from({
+    length: 16
+  }, (m, C) => 10 + C).map((m) => /* @__PURE__ */ o.createElement("option", {
+    key: m,
+    value: m
+  }, m, "px"))));
+}, Bt = ({
   show: r,
-  position: c,
+  position: i,
   filtered: d,
   insertMention: u,
-  onClose: m,
-  query: y
+  onClose: f,
+  query: w
 }) => {
-  const b = P(null);
+  const R = P(null);
   return I(() => {
-    const R = (E) => {
-      b.current && !b.current.contains(E.target) && m();
+    const b = (p) => {
+      R.current && !R.current.contains(p.target) && f();
     };
-    return r && document.addEventListener("mousedown", R), () => {
-      document.removeEventListener("mousedown", R);
+    return r && document.addEventListener("mousedown", b), () => {
+      document.removeEventListener("mousedown", b);
     };
-  }, [r, m]), r ? /* @__PURE__ */ o.createElement("ul", {
-    ref: b,
+  }, [r, f]), r ? /* @__PURE__ */ o.createElement("ul", {
+    ref: R,
     className: "rte-popup",
     style: {
-      top: c.y,
-      left: c.x
+      top: i.y,
+      left: i.x
     }
   }, d.length > 0 ? d.map(({
-    name: R,
-    value: E
+    name: b,
+    value: p
   }) => {
-    const O = R.toLowerCase(), _ = y.toLowerCase(), A = O.indexOf(_);
-    let j = R;
-    if (A !== -1 && y.length > 0) {
-      const L = A + y.length;
-      j = R.substring(0, A) + `<span class="rte-highlight">${R.substring(A, L)}</span>` + R.substring(L);
+    const O = b.toLowerCase(), j = w.toLowerCase(), k = O.indexOf(j);
+    let _ = b;
+    if (k !== -1 && w.length > 0) {
+      const L = k + w.length;
+      _ = b.substring(0, k) + `<span class="rte-highlight">${b.substring(k, L)}</span>` + b.substring(L);
     }
     return /* @__PURE__ */ o.createElement("li", {
-      key: E,
+      key: p,
       onMouseDown: (L) => {
         L.preventDefault(), u({
-          name: R,
-          value: E
+          name: b,
+          value: p
         });
       },
       style: {
@@ -620,7 +617,7 @@ const _t = [
         fontSize: "14px"
       },
       dangerouslySetInnerHTML: {
-        __html: j
+        __html: _
       },
       onMouseEnter: (L) => L.currentTarget.style.background = "#f0f0f0",
       onMouseLeave: (L) => L.currentTarget.style.background = "#fff"
@@ -632,81 +629,81 @@ const _t = [
     }
   }, "No matches")) : null;
 };
-function ze(r) {
+function Ae(r) {
   return z({ 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 Q(r) {
+function Z(r) {
   return z({ 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 It = ({
+const qt = ({
   visible: r,
-  x: c,
+  x: i,
   y: d,
   onAction: u,
-  onClose: m
+  onClose: f
 }) => {
   if (!r) return null;
-  const y = {
+  const w = {
     top: d,
-    left: c
+    left: i
   };
   return /* @__PURE__ */ o.createElement("div", {
-    style: y,
+    style: w,
     className: "rte-table-menu",
-    onMouseLeave: m
+    onMouseLeave: f
   }, /* @__PURE__ */ o.createElement("button", {
     onClick: () => u("insertRowAbove")
-  }, /* @__PURE__ */ o.createElement(Q, null), " Insert row above"), /* @__PURE__ */ o.createElement("button", {
+  }, /* @__PURE__ */ o.createElement(Z, null), " Insert row above"), /* @__PURE__ */ o.createElement("button", {
     onClick: () => u("insertRowBelow")
-  }, /* @__PURE__ */ o.createElement(Q, null), " Insert row below"), /* @__PURE__ */ o.createElement("button", {
+  }, /* @__PURE__ */ o.createElement(Z, null), " Insert row below"), /* @__PURE__ */ o.createElement("button", {
     onClick: () => u("insertColLeft")
-  }, /* @__PURE__ */ o.createElement(Q, null), " Insert col left"), /* @__PURE__ */ o.createElement("button", {
+  }, /* @__PURE__ */ o.createElement(Z, null), " Insert col left"), /* @__PURE__ */ o.createElement("button", {
     onClick: () => u("insertColRight")
-  }, /* @__PURE__ */ o.createElement(Q, null), " Insert col right"), /* @__PURE__ */ o.createElement("button", {
+  }, /* @__PURE__ */ o.createElement(Z, null), " Insert col right"), /* @__PURE__ */ o.createElement("button", {
     onClick: () => u("deleteRow")
-  }, /* @__PURE__ */ o.createElement(ze, null), " Delete row"), /* @__PURE__ */ o.createElement("button", {
+  }, /* @__PURE__ */ o.createElement(Ae, null), " Delete row"), /* @__PURE__ */ o.createElement("button", {
     onClick: () => u("deleteCol")
-  }, /* @__PURE__ */ o.createElement(ze, null), " Delete column"));
-}, Bt = ({
+  }, /* @__PURE__ */ o.createElement(Ae, null), " Delete column"));
+}, Ut = ({
   html: r,
-  className: c,
+  className: i,
   style: d
 }) => {
-  const u = (y) => {
-    const b = y.target;
-    if (b.tagName === "A") {
-      y.preventDefault();
-      const R = b.href;
-      R && window.open(R, "_blank", "noopener,noreferrer");
+  const u = (w) => {
+    const R = w.target;
+    if (R.tagName === "A") {
+      w.preventDefault();
+      const b = R.href;
+      b && window.open(b, "_blank", "noopener,noreferrer");
     }
-  }, m = (y) => {
-    let b = y.replace(/{{\s*(.*?)\s*}}/g, "$1");
-    return b = b.replace(/#arrayData/g, ""), b = b.replace(/\/arrayData/g, ""), b;
+  }, f = (w) => {
+    let R = w.replace(/{{\s*(.*?)\s*}}/g, (b, p) => `<span style="color: blue">${p}</span>`);
+    return R = R.replace(/#arrayData/g, ""), R = R.replace(/\/arrayData/g, ""), R;
   };
   return /* @__PURE__ */ o.createElement("div", {
-    className: `rte-preview ${c || ""}`,
+    className: `rte-preview ${i || ""}`,
     style: d,
     onClick: u,
     dangerouslySetInnerHTML: {
-      __html: m(r)
+      __html: f(r)
     }
   });
-}, qt = ({
+}, Vt = ({
   visible: r,
-  linkData: c,
+  linkData: i,
   onClose: d,
   onInsert: u
 }) => {
-  const [m, y] = M(""), [b, R] = M(""), [E, O] = M(""), [_, A] = M("_self");
+  const [f, w] = A(""), [R, b] = A(""), [p, O] = A(""), [j, k] = A("_self");
   if (I(() => {
-    r ? (y(c.url || ""), R(c.text || ""), O(c.title || ""), A(c.target || "_self")) : (y(""), R(""), O(""), A("_self"));
-  }, [r, c]), !r) return null;
-  const j = () => {
+    r ? (w(i.url || ""), b(i.text || ""), O(i.title || ""), k(i.target || "_self")) : (w(""), b(""), O(""), k("_self"));
+  }, [r, i]), !r) return null;
+  const _ = () => {
     u({
-      url: m,
-      text: b,
-      title: E,
-      target: _
+      url: f,
+      text: R,
+      title: p,
+      target: j
     });
   };
   return /* @__PURE__ */ o.createElement(o.Fragment, null, /* @__PURE__ */ o.createElement("div", {
@@ -716,28 +713,28 @@ const It = ({
     className: "rte-link-modal"
   }, /* @__PURE__ */ o.createElement("h4", {
     className: "rte-link-modal__title"
-  }, m ? "Edit Link" : "Insert Link"), /* @__PURE__ */ o.createElement("input", {
+  }, f ? "Edit Link" : "Insert Link"), /* @__PURE__ */ o.createElement("input", {
     type: "text",
     className: "rte-link-modal__input",
     placeholder: "URL",
-    value: m,
-    onChange: (L) => y(L.target.value)
+    value: f,
+    onChange: (L) => w(L.target.value)
   }), /* @__PURE__ */ o.createElement("input", {
     type: "text",
     className: "rte-link-modal__input",
     placeholder: "Text to Display",
-    value: b,
-    onChange: (L) => R(L.target.value)
+    value: R,
+    onChange: (L) => b(L.target.value)
   }), /* @__PURE__ */ o.createElement("input", {
     type: "text",
     className: "rte-link-modal__input",
     placeholder: "Title",
-    value: E,
+    value: p,
     onChange: (L) => O(L.target.value)
   }), /* @__PURE__ */ o.createElement("select", {
     className: "rte-link-modal__select",
-    value: _,
-    onChange: (L) => A(L.target.value)
+    value: j,
+    onChange: (L) => k(L.target.value)
   }, /* @__PURE__ */ o.createElement("option", {
     value: "_self"
   }, "Same tab"), /* @__PURE__ */ o.createElement("option", {
@@ -749,15 +746,15 @@ const It = ({
     onClick: d
   }, "Cancel"), /* @__PURE__ */ o.createElement("button", {
     className: "rte-link-modal__btn rte-link-modal__btn--ok",
-    onClick: j
+    onClick: _
   }, "OK"))));
 };
-function Ae(r) {
-  return Array.from(new Map(r.map((c) => [c.value, c])).values());
+function ze(r) {
+  return Array.from(new Map(r.map((i) => [i.value, i])).values());
 }
-const Wt = ({
+const Xt = ({
   atSuggestions: r = [],
-  showOutput: c = !1,
+  showOutput: i = !1,
   showPreview: d = !1,
   toolbarConfig: u = {
     link: !1,
@@ -769,27 +766,27 @@ const Wt = ({
     fontSize: !1,
     highlight: !1
   },
-  classNames: m = {},
-  styles: y = {},
-  handleGetHtml: b = () => {
+  classNames: f = {},
+  styles: w = {},
+  handleGetHtml: R = () => {
   },
-  onChange: R = () => {
+  onChange: b = () => {
   },
-  value: E,
+  value: p,
   onMentionSelect: O = () => {
   },
-  handleAddAttributes: _ = () => {
+  handleAddAttributes: j = () => {
   }
 }) => {
-  var he, pe, ve, Ee, ye, we, Ce, be;
-  const A = P(null), [j, L] = M(E != null && E.length ? E : " "), [K, $] = M(""), [q, B] = M(!1), [F, ee] = M({
+  var he, pe, ve, ye, Ee, we, Ce, be;
+  const k = P(null), [_, L] = A(p != null && p.length ? p : " "), [K, W] = A(""), [q, B] = A(!1), [F, G] = A({
     x: 0,
     y: 0
-  }), [te, S] = M([]), k = P(null), V = P(null), [T, f] = M({
+  }), [ee, M] = A([]), N = P(null), U = P(null), [D, m] = A({
     visible: !1,
     x: 0,
     y: 0
-  }), [w, H] = M(!1), X = P(null), [Te, le] = M({
+  }), [C, H] = A(!1), X = P(null), [Te, le] = A({
     url: "",
     text: "",
     title: "",
@@ -805,57 +802,58 @@ const Wt = ({
     link: (he = u.link) != null ? he : !1,
     image: (pe = u.image) != null ? pe : !1,
     emoji: (ve = u.emoji) != null ? ve : !1,
-    table: (Ee = u.table) != null ? Ee : !1,
-    color: (ye = u.color) != null ? ye : !1,
+    table: (ye = u.table) != null ? ye : !1,
+    color: (Ee = u.color) != null ? Ee : !1,
     fontFamily: (we = u.fontFamily) != null ? we : !1,
     fontSize: (Ce = u.fontSize) != null ? Ce : !1,
     highlight: (be = u.fontSize) != null ? be : !1
-  }, [Oe, ce] = M(""), [ie, ne] = M([]), D = () => A.current, x = () => {
-    const e = He();
-    $(e), b == null || b(e);
-    const t = ot(e);
-    R(t);
-    const n = $e(), a = Ae(n);
-    JSON.stringify(a) !== JSON.stringify(ie) && (ne(a), O(a));
+  }, [Oe, ce] = A(""), [ie, te] = A([]), T = () => k.current, S = () => {
+    const e = He(), t = /^<div[^>]*style=["'][^"']*font-size\s*:\s*\d+px[^"']*["'][^>]*>/.test(e.trim());
+    let n = e;
+    t || (n = `<div style="font-size:12px">${e}</div>`), W(n), R == null || R(n);
+    const a = ot(e);
+    b(a);
+    const s = $e(), l = ze(s);
+    JSON.stringify(l) !== JSON.stringify(ie) && (te(l), O(l));
   }, He = () => {
-    const e = D();
-    if (!e) return j;
+    const e = T();
+    if (!e) return _;
     const t = e.cloneNode(!0);
     t.querySelectorAll("table div").forEach((a) => a.remove()), t.querySelectorAll(".rte-cell-highlight").forEach((a) => a.classList.remove("rte-cell-highlight"));
     let n = t.innerHTML;
-    return n = je(n), n;
-  }, je = (e) => e.replace(/<tbody[^>]*>/g, "<tbody>{{#arrayData}}").replace(/<\/tbody>/g, "{{/arrayData}}</tbody>"), U = () => {
+    return n = _e(n), n;
+  }, _e = (e) => e.replace(/<tbody[^>]*>/g, "<tbody>{{#arrayData}}").replace(/<\/tbody>/g, "{{/arrayData}}</tbody>"), V = () => {
     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) && (k.current = n.cloneRange());
-  }, W = () => {
+    t.contains(n.startContainer) && (N.current = n.cloneRange());
+  }, $ = () => {
     const e = window.getSelection();
-    !e || !k.current || (e.removeAllRanges(), e.addRange(k.current));
+    !e || !N.current || (e.removeAllRanges(), e.addRange(N.current));
   }, se = (e, t) => {
     const n = window.getSelection();
-    n && n.rangeCount > 0 && (k.current = n.getRangeAt(0)), W(), document.execCommand(e, !1, t), x();
+    n && n.rangeCount > 0 && (N.current = n.getRangeAt(0)), $(), document.execCommand(e, !1, t), S();
   };
   I(() => {
-    const e = D();
-    if (!e || !E) return;
-    const t = _e(E);
-    e.innerHTML = t, x();
+    const e = T();
+    if (!e || !p) return;
+    const t = je(p);
+    e.innerHTML = t, S();
   }, []);
-  const _e = (e) => e.replace(/<span[^>]*data-hidden-table-start[^>]*>.*?<\/span>/g, "").replace(/<span[^>]*data-hidden-table-end[^>]*>.*?<\/span>/g, "").replace(/{{#arrayData}}/g, "").replace(/{{\/arrayData}}/g, "");
+  const je = (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(() => () => {
     document.removeEventListener("mousemove", null), document.removeEventListener("mouseup", null);
   }, []), I(() => {
-    _ && _((e) => {
-      Ue(e);
+    j && j((e) => {
+      Ve(e);
     });
   }, []), I(() => {
-    const e = D();
+    const e = T();
     if (!e) return;
     e.querySelectorAll("table").forEach((n) => {
-      ge(n), n.querySelectorAll("th, td").forEach((s) => Z(s));
+      ge(n), n.querySelectorAll("th, td").forEach((s) => Y(s));
     });
   }, []);
   const de = (e) => {
@@ -872,8 +870,8 @@ const Wt = ({
     if (e.querySelector("[data-hidden-array-start]")) return;
     const a = `{{#arrayData${n > 1 ? n : ""}}}`, s = `{{/arrayData${n > 1 ? n : ""}}}`, l = document.createElement("span");
     l.textContent = a, l.style.display = "none", l.setAttribute("data-hidden-array-start", "true"), e.insertBefore(l, e.firstChild);
-    const i = document.createElement("span");
-    i.textContent = s, i.style.display = "none", i.setAttribute("data-hidden-array-end", "true"), e.appendChild(i);
+    const c = document.createElement("span");
+    c.textContent = s, c.style.display = "none", c.setAttribute("data-hidden-array-end", "true"), e.appendChild(c);
   }, ue = (e) => {
     var v;
     const t = window.getSelection();
@@ -881,27 +879,27 @@ const Wt = ({
     const n = t.getRangeAt(0), a = de(n.startContainer);
     let s, l;
     if (a) {
-      let g = a.querySelector(e);
-      g || (g = document.createElement(e), g.style.margin = "0", g.style.paddingLeft = "20px", a.appendChild(g)), l = g, s = document.createElement("li"), s.textContent = "​", l.appendChild(s);
+      let h = a.querySelector(e);
+      h || (h = document.createElement(e), h.style.margin = "0", h.style.paddingLeft = "20px", a.appendChild(h)), l = h, s = document.createElement("li"), s.textContent = "​", l.appendChild(s);
     } else {
       document.execCommand(e === "ul" ? "insertUnorderedList" : "insertOrderedList");
-      const g = D();
-      if (l = g == null ? void 0 : g.querySelector(`${e}:last-child`), !l) return;
+      const h = T();
+      if (l = h == null ? void 0 : h.querySelector(`${e}:last-child`), !l) return;
       s = l.querySelector("li:last-child");
     }
     Pe(l);
-    const i = document.createRange();
-    i.setStart(s, 0), i.collapse(!0), t.removeAllRanges(), t.addRange(i), (v = D()) == null || v.focus(), x();
-  }, Y = (e, t) => {
+    const c = document.createRange();
+    c.setStart(s, 0), c.collapse(!0), t.removeAllRanges(), t.addRange(c), (v = T()) == null || v.focus(), S();
+  }, ne = (e, t) => {
     e === "insertOrderedList" ? ue("ol") : e === "insertUnorderedList" ? ue("ul") : e.startsWith("justify") ? ct(e) : se(e, t), e === "insertTable" && Qe();
   }, Ie = (e) => {
     const t = document.createElement("span");
     t.textContent = "​", e.insertNode(t), e.setStartAfter(t), e.collapse(!0);
     const n = t.getBoundingClientRect();
-    t.remove(), ee({
+    t.remove(), G({
       x: n.left,
       y: n.bottom + window.scrollY
-    }), S(r || []), B(!0), V.current = e.cloneRange();
+    }), M(r || []), B(!0), U.current = e.cloneRange();
   }, Be = () => {
     const e = window.getSelection();
     if (!e || e.rangeCount === 0) return null;
@@ -911,10 +909,10 @@ const Wt = ({
     let a = t;
     for (a.nodeType !== Node.TEXT_NODE && (a.childNodes && a.childNodes[n] ? a = a.childNodes[n] : a = t.previousSibling); a; ) {
       if (a.nodeType === Node.TEXT_NODE) {
-        const s = a.textContent || "", l = a === t ? n : s.length, i = s.lastIndexOf("@", l - 1);
-        if (i !== -1) {
+        const s = a.textContent || "", l = a === t ? n : s.length, c = s.lastIndexOf("@", l - 1);
+        if (c !== -1) {
           const v = document.createRange();
-          return v.setStart(a, i), v.setEnd(a, l), v;
+          return v.setStart(a, c), v.setEnd(a, l), v;
         }
       }
       a = a.previousSibling;
@@ -925,81 +923,81 @@ const Wt = ({
     const t = window.getSelection();
     if (!t) return;
     const n = Be();
-    n ? (t.removeAllRanges(), t.addRange(n)) : V.current && (t.removeAllRanges(), t.addRange(V.current));
+    n ? (t.removeAllRanges(), t.addRange(n)) : U.current && (t.removeAllRanges(), t.addRange(U.current));
     const a = document.createElement("span");
-    a.textContent = `{{${e.name}}}`, a.style.display = "inline", a.contentEditable = "false", a.setAttribute("data-mention", e.value || e.name || "");
+    a.textContent = `{{${e.name}}}`, a.style.display = "inline", a.setAttribute("data-mention", e.value || e.name || "");
     try {
-      const i = t.rangeCount ? t.getRangeAt(0) : null;
-      if (i)
-        i.deleteContents(), i.insertNode(a);
+      const c = t.rangeCount ? t.getRangeAt(0) : null;
+      if (c)
+        c.deleteContents(), c.insertNode(a);
       else {
-        const p = document.createRange(), h = D();
-        p.selectNodeContents(h), p.collapse(!1), p.insertNode(a);
+        const E = document.createRange(), g = T();
+        E.selectNodeContents(g), E.collapse(!1), E.insertNode(a);
       }
       const v = document.createTextNode(" ");
       a.after(v);
-      const g = document.createRange();
-      g.setStartAfter(v), g.collapse(!0), t.removeAllRanges(), t.addRange(g);
-    } catch (i) {
-      console.error("insertMention error:", i);
+      const h = document.createRange();
+      h.setStartAfter(v), h.collapse(!0), t.removeAllRanges(), t.addRange(h);
+    } catch (c) {
+      console.error("insertMention error:", c);
     }
-    let s = Ae([...ie, e]);
-    ne(s), O(s), B(!1), (l = D()) == null || l.focus(), x();
-  }, Ve = (e) => {
-    const t = D();
+    let s = ze([...ie, e]);
+    te(s), O(s), B(!1), (l = T()) == null || l.focus(), S();
+  }, Ue = (e) => {
+    const t = T();
     if (!t) return;
     let n = null;
-    k.current && t.contains(k.current.startContainer) ? n = k.current.cloneRange() : (n = document.createRange(), n.selectNodeContents(t), n.collapse(!1));
+    N.current && t.contains(N.current.startContainer) ? n = N.current.cloneRange() : (n = document.createRange(), n.selectNodeContents(t), n.collapse(!1));
     const a = window.getSelection();
     if (!a) return;
     a.removeAllRanges(), a.addRange(n);
     const s = document.createElement("span");
-    s.textContent = `{{${e.name}}}`, s.style.display = "inline", s.contentEditable = "false", s.setAttribute("data-mention", e.value || e.name), n.insertNode(s);
+    s.textContent = `{{${e.name}}}`, s.style.display = "inline", s.setAttribute("data-mention", e.value || e.name), n.insertNode(s);
     const l = document.createTextNode(" ");
     s.after(l);
-    const i = document.createRange();
-    i.setStartAfter(l), i.collapse(!0), a.removeAllRanges(), a.addRange(i), k.current = i.cloneRange(), t.focus();
-  }, Ue = (e) => {
-    e.forEach((t) => Ve(t)), ne((t) => {
+    const c = document.createRange();
+    c.setStartAfter(l), c.collapse(!0), a.removeAllRanges(), a.addRange(c), N.current = c.cloneRange(), t.focus();
+  }, Ve = (e) => {
+    e.forEach((t) => Ue(t)), te((t) => {
       const n = [...t, ...e], a = Array.from(new Map(n.map((s) => [s.name, s])).values());
       return O(a), a;
-    }), x();
+    }), S();
   }, $e = () => {
-    const e = D();
+    const e = T();
     if (!e) return [];
     const t = e.querySelectorAll("span[data-mention]"), n = [];
     return t.forEach((a) => {
-      const s = a.getAttribute("data-mention") || "", i = (a.textContent || "").match(/{{(.+?)}}/);
-      i && n.push({
-        name: i[1],
+      const s = a.getAttribute("data-mention") || "", c = (a.textContent || "").match(/{{(.+?)}}/);
+      c && n.push({
+        name: c[1],
         value: s
       });
     }), n;
   }, We = (e) => {
     var n, a, s;
     const t = e.key.toLowerCase();
-    if ((e.ctrlKey || e.metaKey) && ["b", "i", "u"].includes(t) && (e.preventDefault(), Y(t === "b" ? "bold" : t === "i" ? "italic" : t === "u" ? "underline" : "")), e.shiftKey && e.key === "2" && e.preventDefault(), e.key === "Enter") {
-      const l = window.getSelection(), i = l != null && l.anchorNode ? de(l.anchorNode) : null;
-      if (!i) return;
-      if (((n = i.textContent) == null ? void 0 : n.replace(/\u200B/g, "").trim()) === "") {
+    if ((e.ctrlKey || e.metaKey) && ["b", "i", "u"].includes(t) && (e.preventDefault(), ne(t === "b" ? "bold" : t === "i" ? "italic" : t === "u" ? "underline" : "")), e.shiftKey && e.key === "2" && e.preventDefault(), e.key === "Enter") {
+      const l = window.getSelection(), c = l != null && l.anchorNode ? de(l.anchorNode) : null;
+      if (!c) return;
+      if (((n = c.textContent) == null ? void 0 : n.replace(/\u200B/g, "").trim()) === "") {
         e.preventDefault();
-        const g = i.parentElement, p = g == null ? void 0 : g.closest("li");
-        if (p) {
-          g == null || g.removeChild(i);
-          const h = document.createElement("p");
-          h.innerHTML = "<br />", (a = p.parentElement) == null || a.insertBefore(h, p.nextSibling);
-          const C = document.createRange();
-          C.setStart(h, 0), C.collapse(!0), l == null || l.removeAllRanges(), l == null || l.addRange(C);
+        const h = c.parentElement, E = h == null ? void 0 : h.closest("li");
+        if (E) {
+          h == null || h.removeChild(c);
+          const g = document.createElement("p");
+          g.innerHTML = "<br />", (a = E.parentElement) == null || a.insertBefore(g, E.nextSibling);
+          const y = document.createRange();
+          y.setStart(g, 0), y.collapse(!0), l == null || l.removeAllRanges(), l == null || l.addRange(y);
         } else {
-          const h = i.closest("ul, ol");
-          if (h) {
-            const C = document.createElement("p");
-            C.innerHTML = "<br />", (s = h.parentElement) == null || s.insertBefore(C, h.nextSibling), h.removeChild(i);
-            const N = document.createRange();
-            N.setStart(C, 0), N.collapse(!0), l == null || l.removeAllRanges(), l == null || l.addRange(N);
+          const g = c.closest("ul, ol");
+          if (g) {
+            const y = document.createElement("p");
+            y.innerHTML = "<br />", (s = g.parentElement) == null || s.insertBefore(y, g.nextSibling), g.removeChild(c);
+            const x = document.createRange();
+            x.setStart(y, 0), x.collapse(!0), l == null || l.removeAllRanges(), l == null || l.addRange(x);
           }
         }
-        x();
+        S();
       }
     }
   }, Ke = (e) => {
@@ -1010,7 +1008,7 @@ const Wt = ({
       if (Xe(a))
         return;
       setTimeout(() => {
-        Ie(n.getRangeAt(0)), ce(""), S(r), B(!0);
+        Ie(n.getRangeAt(0)), ce(""), M(r), B(!0);
       }, 0);
       return;
     }
@@ -1027,7 +1025,7 @@ const Wt = ({
     }
     return !1;
   }, me = () => {
-    if (x(), !q) return;
+    if (S(), !q) return;
     const e = window.getSelection();
     if (!e || !e.anchorNode) return;
     const n = (e.anchorNode.textContent || "").match(/@([a-zA-Z0-9_]*)$/);
@@ -1038,64 +1036,70 @@ const Wt = ({
     const a = n[1].toLowerCase();
     ce(a);
     const s = r.filter((l) => l.name.toLowerCase().includes(a));
-    S(s);
+    M(s);
   }, Ye = (e) => {
     var a;
     const t = (a = e.target.files) == null ? void 0 : a[0];
     if (!t) return;
     const n = new FileReader();
     n.onload = (s) => {
-      var N;
-      const l = (N = s.target) == null ? void 0 : N.result;
-      W();
-      const i = window.getSelection();
-      let v = i && i.rangeCount ? i.getRangeAt(0) : null;
-      const g = document.createElement("img");
-      g.src = l, g.alt = t.name || "image", g.className = "rte-inserted-image", g.contentEditable = "true";
-      const p = D();
-      if (!v || !p) {
-        p == null || p.appendChild(g);
+      var x;
+      const l = (x = s.target) == null ? void 0 : x.result;
+      $();
+      const c = window.getSelection();
+      let v = c && c.rangeCount ? c.getRangeAt(0) : null;
+      const h = document.createElement("img");
+      h.src = l, h.alt = t.name || "image", h.className = "rte-inserted-image", h.contentEditable = "true";
+      const E = T();
+      if (!v || !E) {
+        E == null || E.appendChild(h);
         const Re = document.createTextNode(" ");
-        p == null || p.appendChild(Re);
+        E == null || E.appendChild(Re);
         const re = document.createRange();
-        re.setStartAfter(Re), re.collapse(!0), i == null || i.removeAllRanges(), i == null || i.addRange(re), p == null || p.focus(), x(), e.target.value = "";
+        re.setStartAfter(Re), re.collapse(!0), c == null || c.removeAllRanges(), c == null || c.addRange(re), E == null || E.focus(), S(), e.target.value = "";
         return;
       }
-      v.deleteContents(), v.insertNode(g);
-      const h = document.createTextNode(" ");
-      g.after(h);
-      const C = document.createRange();
-      C.setStartAfter(h), C.collapse(!0), i.removeAllRanges(), i.addRange(C), p.focus(), x(), e.target.value = "";
+      v.deleteContents(), v.insertNode(h);
+      const g = document.createTextNode(" ");
+      h.after(g);
+      const y = document.createRange();
+      y.setStartAfter(g), y.collapse(!0), c.removeAllRanges(), c.addRange(y), E.focus(), S(), e.target.value = "";
     }, n.readAsDataURL(t);
   }, Ze = (e) => {
     var s;
-    W();
+    $();
     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), (s = D()) == null || s.focus(), x();
+    n.insertNode(a), n.setStartAfter(a), n.collapse(!0), t.removeAllRanges(), t.addRange(n), (s = T()) == null || s.focus(), S();
   }, Qe = () => {
-    W();
+    var E;
+    $();
     const e = document.createElement("table");
-    e.style.borderCollapse = "collapse", e.style.width = "100%", e.style.border = "1px solid #ccc", e.style.margin = "8px 0", e.style.position = "relative", m.table && e.classList.add(m.table);
+    e.style.borderCollapse = "collapse", e.style.width = "100%", e.style.border = "1px solid #ccc", e.style.margin = "8px 0", e.style.position = "relative", f.table && e.classList.add(f.table);
     const t = document.createElement("thead");
-    m.thead && t.classList.add(m.thead);
+    f.thead && t.classList.add(f.thead);
     const n = document.createElement("tbody");
-    m.tbody && n.classList.add(m.tbody);
+    f.tbody && n.classList.add(f.tbody);
     const a = document.createElement("tr");
-    m.tr && a.classList.add(m.tr);
+    f.tr && a.classList.add(f.tr);
     const s = document.createElement("tr");
-    m.tr && s.classList.add(m.tr);
-    for (let v = 0; v < 2; v++) {
-      const g = document.createElement("th");
-      g.textContent = `Header ${v + 1}`, g.style.border = "1px solid #999", g.style.padding = "8px", g.style.position = "relative", g.style.backgroundColor = "lightgray", m.th && g.classList.add(m.th);
-      const p = document.createElement("td");
-      p.textContent = `Row 1 Col ${v + 1}`, p.style.border = "1px solid #999", p.style.padding = "8px", p.style.position = "relative", p.style.backgroundColor = "#fff", m.td && p.classList.add(m.td), Z(g), Z(p), a.appendChild(g), s.appendChild(p);
+    f.tr && s.classList.add(f.tr);
+    for (let g = 0; g < 2; g++) {
+      const y = document.createElement("th");
+      y.textContent = `Header ${g + 1}`, y.style.border = "1px solid #999", y.style.padding = "4px", y.style.position = "relative", y.style.backgroundColor = "lightgray", f.th && y.classList.add(f.th);
+      const x = document.createElement("td");
+      x.textContent = `Row 1 Col ${g + 1}`, x.style.border = "1px solid #999", x.style.padding = "4px", x.style.position = "relative", x.style.backgroundColor = "#fff", f.td && x.classList.add(f.td), Y(y), Y(x), a.appendChild(y), s.appendChild(x);
     }
     t.appendChild(a), n.appendChild(s), e.appendChild(t), e.appendChild(n), ge(e);
     const l = window.getSelection();
     if (!(l != null && l.rangeCount)) return;
-    l.getRangeAt(0).insertNode(e), x();
+    const c = l.getRangeAt(0);
+    c.collapse(!1), c.insertNode(e);
+    const v = document.createElement("p");
+    v.innerHTML = "<br/>", e.after(v);
+    const h = document.createRange();
+    h.setStart(v, 0), h.collapse(!0), l.removeAllRanges(), l.addRange(h), (E = T()) == null || E.focus(), S();
   }, ge = (e) => {
     const t = document.createElement("div");
     Object.assign(t.style, {
@@ -1108,21 +1112,21 @@ const Wt = ({
       cursor: "nwse-resize",
       zIndex: "20",
       borderRadius: "2px"
-    });
+    }), t.style.userSelect = "none", t.contentEditable = "false";
     let n = 0, a = 0, s = 0, l = 0;
-    t.addEventListener("mousedown", (i) => {
-      i.preventDefault(), n = i.clientX, a = i.clientY;
+    t.addEventListener("mousedown", (c) => {
+      c.preventDefault(), n = c.clientX, a = c.clientY;
       const v = e.getBoundingClientRect();
       s = v.width, l = v.height;
-      const g = (h) => {
-        const C = Math.max(100, s + (h.clientX - n)), N = Math.max(60, l + (h.clientY - a));
-        e.style.width = `${C}px`, e.style.height = `${N}px`, x();
-      }, p = () => {
-        document.removeEventListener("mousemove", g), document.removeEventListener("mouseup", p), x();
+      const h = (g) => {
+        const y = Math.max(100, s + (g.clientX - n)), x = Math.max(60, l + (g.clientY - a));
+        e.style.width = `${y}px`, e.style.height = `${x}px`, S();
+      }, E = () => {
+        document.removeEventListener("mousemove", h), document.removeEventListener("mouseup", E), S();
       };
-      document.addEventListener("mousemove", g), document.addEventListener("mouseup", p);
+      document.addEventListener("mousemove", h), document.addEventListener("mouseup", E);
     }), e.appendChild(t);
-  }, Z = (e) => {
+  }, Y = (e) => {
     const t = document.createElement("div"), n = document.createElement("div");
     Object.assign(t.style, {
       position: "absolute",
@@ -1132,8 +1136,13 @@ const Wt = ({
       height: "100%",
       cursor: "col-resize",
       background: "rgba(0,0,0,0.15)",
-      zIndex: "10"
-    }), Object.assign(n.style, {
+      zIndex: "10",
+      userSelect: "none",
+      WebkitUserSelect: "none",
+      MozUserSelect: "none",
+      msUserSelect: "none",
+      pointerEvents: "auto"
+    }), t.contentEditable = "false", Object.assign(n.style, {
       position: "absolute",
       bottom: "0",
       left: "0",
@@ -1141,27 +1150,32 @@ const Wt = ({
       height: "6px",
       cursor: "row-resize",
       background: "rgba(0,0,0,0.15)",
-      zIndex: "10"
-    }), Je(e, t, n), e.appendChild(t), e.appendChild(n);
+      zIndex: "10",
+      userSelect: "none",
+      WebkitUserSelect: "none",
+      MozUserSelect: "none",
+      msUserSelect: "none",
+      pointerEvents: "auto"
+    }), n.contentEditable = "false", Je(e, t, n), e.appendChild(t), e.appendChild(n);
   }, Je = (e, t, n) => {
-    let a = 0, s = 0, l = 0, i = 0;
-    t.addEventListener("mousedown", (h) => {
-      h.preventDefault(), a = h.clientX, l = e.offsetWidth, document.addEventListener("mousemove", v), document.addEventListener("mouseup", p);
-    }), n.addEventListener("mousedown", (h) => {
-      h.preventDefault(), s = h.clientY, i = e.offsetHeight, document.addEventListener("mousemove", g), document.addEventListener("mouseup", p);
+    let a = 0, s = 0, l = 0, c = 0;
+    t.addEventListener("mousedown", (g) => {
+      g.preventDefault(), a = g.clientX, l = e.offsetWidth, document.addEventListener("mousemove", v), document.addEventListener("mouseup", E);
+    }), n.addEventListener("mousedown", (g) => {
+      g.preventDefault(), s = g.clientY, c = e.offsetHeight, document.addEventListener("mousemove", h), document.addEventListener("mouseup", E);
     });
-    const v = (h) => {
-      const C = l + (h.clientX - a);
-      e.style.width = `${Math.max(30, C)}px`, x();
-    }, g = (h) => {
-      const C = i + (h.clientY - s);
-      e.style.height = `${Math.max(20, C)}px`, x();
-    }, p = () => {
-      document.removeEventListener("mousemove", v), document.removeEventListener("mousemove", g), document.removeEventListener("mouseup", p), x();
+    const v = (g) => {
+      const y = l + (g.clientX - a);
+      e.style.width = `${Math.max(30, y)}px`, S();
+    }, h = (g) => {
+      const y = c + (g.clientY - s);
+      e.style.height = `${Math.max(20, y)}px`, S();
+    }, E = () => {
+      document.removeEventListener("mousemove", v), document.removeEventListener("mousemove", h), document.removeEventListener("mouseup", E), S();
     };
   }, Ge = (e) => {
     const n = e.target.closest("td, th");
-    n && (e.preventDefault(), document.querySelectorAll(".rte-cell-highlight").forEach((a) => a.classList.remove("rte-cell-highlight")), n.classList.add("rte-cell-highlight"), f({
+    n && (e.preventDefault(), document.querySelectorAll(".rte-cell-highlight").forEach((a) => a.classList.remove("rte-cell-highlight")), n.classList.add("rte-cell-highlight"), m({
       visible: !0,
       x: e.clientX,
       y: e.clientY,
@@ -1170,37 +1184,37 @@ const Wt = ({
   }, fe = () => {
     document.querySelectorAll(".rte-cell-highlight").forEach((e) => e.classList.remove("rte-cell-highlight"));
   }, et = (e) => {
-    if (!T.cell) return;
-    const t = T.cell.closest("table"), n = T.cell.cellIndex, a = T.cell.parentElement.rowIndex, s = (l) => {
-      const i = l.tagName.toLowerCase(), v = document.createElement(i);
-      return v.textContent = l.textContent || "", v.style.cssText = l.style.cssText, Z(v), v;
+    if (!D.cell) return;
+    const t = D.cell.closest("table"), n = D.cell.cellIndex, a = D.cell.parentElement.rowIndex, s = (l) => {
+      const c = l.tagName.toLowerCase(), v = document.createElement(c);
+      return v.textContent = l.textContent || "", v.style.cssText = l.style.cssText, Y(v), v;
     };
     switch (e) {
       case "insertRowAbove": {
-        const l = t.rows[a], i = t.insertRow(a);
+        const l = t.rows[a], c = t.insertRow(a);
         Array.from(l.cells).forEach((v) => {
-          i.appendChild(s(v));
+          c.appendChild(s(v));
         });
         break;
       }
       case "insertRowBelow": {
-        const l = t.rows[a], i = t.insertRow(a + 1);
+        const l = t.rows[a], c = t.insertRow(a + 1);
         Array.from(l.cells).forEach((v) => {
-          i.appendChild(s(v));
+          c.appendChild(s(v));
         });
         break;
       }
       case "insertColLeft": {
         Array.from(t.rows).forEach((l) => {
-          const i = l.cells[n];
-          l.insertBefore(s(i), i);
+          const c = l.cells[n];
+          l.insertBefore(s(c), c);
         });
         break;
       }
       case "insertColRight": {
         Array.from(t.rows).forEach((l) => {
-          const i = l.cells[n];
-          l.insertBefore(s(i), i.nextSibling);
+          const c = l.cells[n];
+          l.insertBefore(s(c), c.nextSibling);
         });
         break;
       }
@@ -1213,11 +1227,11 @@ const Wt = ({
         });
         break;
     }
-    x(), f(oe(ae({}, T), {
+    S(), m(oe(ae({}, D), {
       visible: !1
     })), fe();
   }, tt = () => {
-    U(), X.current = k.current, le({
+    V(), X.current = N.current, le({
       url: "",
       text: "",
       title: "",
@@ -1235,8 +1249,8 @@ const Wt = ({
     s.deleteContents(), s.insertNode(a);
     const l = document.createTextNode(" ");
     a.after(l);
-    const i = document.createRange();
-    i.setStartAfter(l), i.collapse(!0), t.removeAllRanges(), t.addRange(i), H(!1), x();
+    const c = document.createRange();
+    c.setStartAfter(l), c.collapse(!0), t.removeAllRanges(), t.addRange(c), H(!1), S();
   }, rt = (e) => {
     const t = e.target;
     if (t.tagName === "A") {
@@ -1255,37 +1269,37 @@ const Wt = ({
       }), H(!0);
     }
   }, at = () => {
-    const e = D();
+    const e = T();
     if (!e) return;
     const t = window.getSelection();
-    if ((!t || t.rangeCount === 0) && k.current) {
-      const h = window.getSelection();
-      h == null || h.removeAllRanges(), h == null || h.addRange(k.current);
+    if ((!t || t.rangeCount === 0) && N.current) {
+      const g = window.getSelection();
+      g == null || g.removeAllRanges(), g == null || g.addRange(N.current);
     }
     const n = window.getSelection();
     if (!n || n.rangeCount === 0) return;
     const a = n.getRangeAt(0);
-    W(), document.execCommand("removeFormat", !1);
+    $(), document.execCommand("removeFormat", !1);
     const s = a.cloneContents(), l = document.createElement("div");
     l.appendChild(s);
-    const i = document.createTreeWalker(l, NodeFilter.SHOW_ELEMENT, null), v = [];
-    for (; i.nextNode(); ) {
-      const h = i.currentNode, C = h.tagName.toUpperCase(), N = h.getAttribute && h.getAttribute("data-mention") !== null;
-      C !== "A" && !N && v.push(h);
+    const c = document.createTreeWalker(l, NodeFilter.SHOW_ELEMENT, null), v = [];
+    for (; c.nextNode(); ) {
+      const g = c.currentNode, y = g.tagName.toUpperCase(), x = g.getAttribute && g.getAttribute("data-mention") !== null;
+      y !== "A" && !x && v.push(g);
     }
-    for (let h = v.length - 1; h >= 0; h--) {
-      const C = v[h], N = C.parentNode;
-      if (N) {
-        for (; C.firstChild; ) N.insertBefore(C.firstChild, C);
-        N.removeChild(C);
+    for (let g = v.length - 1; g >= 0; g--) {
+      const y = v[g], x = y.parentNode;
+      if (x) {
+        for (; y.firstChild; ) x.insertBefore(y.firstChild, y);
+        x.removeChild(y);
       }
     }
-    l.querySelectorAll("[style]").forEach((h) => h.removeAttribute("style")), a.deleteContents();
-    const g = document.createDocumentFragment();
-    for (; l.firstChild; ) g.appendChild(l.firstChild);
-    a.insertNode(g);
-    const p = document.createRange();
-    p.setStartAfter(a.endContainer.nodeType === Node.TEXT_NODE ? a.endContainer : a.startContainer), p.collapse(!0), n.removeAllRanges(), n.addRange(p), e.normalize(), x();
+    l.querySelectorAll("[style]").forEach((g) => g.removeAttribute("style")), a.deleteContents();
+    const h = document.createDocumentFragment();
+    for (; l.firstChild; ) h.appendChild(l.firstChild);
+    a.insertNode(h);
+    const E = document.createRange();
+    E.setStartAfter(a.endContainer.nodeType === Node.TEXT_NODE ? a.endContainer : a.startContainer), E.collapse(!0), n.removeAllRanges(), n.addRange(E), e.normalize(), S();
   }, ot = (e) => {
     var a;
     let t = e;
@@ -1309,8 +1323,8 @@ const Wt = ({
     if (!e || e.rangeCount === 0) return [];
     const t = e.getRangeAt(0), n = t.commonAncestorContainer, a = n.nodeType === Node.ELEMENT_NODE ? n : n.parentElement;
     return Array.from(a.querySelectorAll("td, th")).filter((l) => {
-      const i = document.createRange();
-      return i.selectNodeContents(l), t.compareBoundaryPoints(Range.END_TO_START, i) < 0 && t.compareBoundaryPoints(Range.START_TO_END, i) > 0;
+      const c = document.createRange();
+      return c.selectNodeContents(l), t.compareBoundaryPoints(Range.END_TO_START, c) < 0 && t.compareBoundaryPoints(Range.START_TO_END, c) > 0;
     });
   }
   function ct(e) {
@@ -1322,78 +1336,100 @@ const Wt = ({
     let n = "left";
     e === "justifyCenter" && (n = "center"), e === "justifyRight" && (n = "right"), t.forEach((a) => {
       a.style.textAlign = n;
-    }), x();
+    }), S();
   }
+  const it = (e) => {
+    const t = e.clipboardData.items;
+    for (let n = 0; n < t.length; n++) {
+      const a = t[n];
+      if (a.kind === "file" && a.type.startsWith("image/")) {
+        e.preventDefault();
+        return;
+      }
+      a.kind === "string" && a.getAsString((s) => {
+        /<img\s/i.test(s) && e.preventDefault();
+      });
+    }
+  }, st = (e) => {
+    $();
+    const t = window.getSelection();
+    if (!t || !t.rangeCount) return;
+    const n = t.getRangeAt(0), a = document.createElement("span");
+    a.style.fontSize = `${e}px`, a.appendChild(n.extractContents()), n.insertNode(a);
+    const s = document.createRange();
+    s.setStartAfter(a), s.collapse(!0), t.removeAllRanges(), t.addRange(s), S();
+  };
   return /* @__PURE__ */ o.createElement("div", {
-    className: `rte-wrapper ${(m == null ? void 0 : m.wrapper) || ""}`,
-    style: y.wrapper
+    className: `rte-wrapper ${(f == null ? void 0 : f.wrapper) || ""}`,
+    style: w.wrapper
   }, /* @__PURE__ */ o.createElement("div", {
     style: {
       flex: 1
     }
-  }, /* @__PURE__ */ o.createElement(Ft, {
-    exec: Y,
-    saveSelection: U,
+  }, /* @__PURE__ */ o.createElement(It, {
+    exec: ne,
+    saveSelection: V,
     handleFileChange: Ye,
-    handleFontSizeChange: (e) => Y("fontSize", e.target.value),
-    handleFontFamilyChange: (e) => Y("fontName", e.target.value),
+    handleFontSizeChange: (e) => st(e.target.value),
+    handleFontFamilyChange: (e) => ne("fontName", e.target.value),
     insertEmoji: Ze,
     handleLink: tt,
     removeFormatting: at,
     visibleActions: De,
-    className: m.toolbar,
-    style: y.toolbar
+    className: f.toolbar,
+    style: w.toolbar
   }), /* @__PURE__ */ o.createElement("div", {
-    ref: A,
+    ref: k,
     id: "rte-editor-body",
-    className: `rte-editor ${(m == null ? void 0 : m.editor) || ""}`,
-    style: y.editor,
+    className: `rte-editor ${(f == null ? void 0 : f.editor) || ""}`,
+    style: w.editor,
     contentEditable: !0,
     suppressContentEditableWarning: !0,
-    onKeyUp: U,
-    onMouseUp: U,
+    onPaste: it,
+    onKeyUp: V,
+    onMouseUp: V,
     onInput: () => {
-      me(), U();
+      me(), V();
     },
     onKeyDown: We,
     onBeforeInput: Ke,
     onContextMenu: Ge,
     onClick: (e) => {
-      rt(e), U();
+      rt(e), V();
     }
-  }), /* @__PURE__ */ o.createElement(Pt, {
+  }), /* @__PURE__ */ o.createElement(Bt, {
     show: q,
     position: F,
-    filtered: te,
+    filtered: ee,
     insertMention: qe,
     onClose: () => B(!1),
     query: Oe
-  }), c && /* @__PURE__ */ o.createElement("div", {
-    className: `rte-output ${(m == null ? void 0 : m.output) || ""}`,
-    style: y.output
-  }, /* @__PURE__ */ o.createElement("h4", null, "Output HTML:"), /* @__PURE__ */ o.createElement("p", null, K)), /* @__PURE__ */ o.createElement(It, {
-    visible: T.visible,
-    x: T.x,
-    y: T.y,
+  }), i && /* @__PURE__ */ o.createElement("div", {
+    className: `rte-output ${(f == null ? void 0 : f.output) || ""}`,
+    style: w.output
+  }, /* @__PURE__ */ o.createElement("h4", null, "Output HTML:"), /* @__PURE__ */ o.createElement("p", null, K)), /* @__PURE__ */ o.createElement(qt, {
+    visible: D.visible,
+    x: D.x,
+    y: D.y,
     onAction: et,
     onClose: () => {
-      f(oe(ae({}, T), {
+      m(oe(ae({}, D), {
         visible: !1
       })), fe();
     }
-  }), /* @__PURE__ */ o.createElement(qt, {
-    visible: w,
+  }), /* @__PURE__ */ o.createElement(Vt, {
+    visible: C,
     linkData: Te,
     onClose: () => H(!1),
     onInsert: nt
-  })), d ? /* @__PURE__ */ o.createElement(Bt, {
-    className: m.preview,
-    style: y.preview,
+  })), d ? /* @__PURE__ */ o.createElement(Ut, {
+    className: f.preview,
+    style: w.preview,
     html: K
   }) : null);
 };
 export {
-  Wt as RichTextEditor,
-  Bt as RtePreview,
-  Ft as RteToolbar
+  Xt as RichTextEditor,
+  Ut as RtePreview,
+  It as RteToolbar
 };