@connectedxm/entity-editor 0.0.3 → 0.0.5

package/dist/index.es.js

@@ -1,14 +1,5 @@
 import A, { useState as $e, useRef as me, useEffect as Ye } from "react";
 var X = { exports: {} }, x = {};
-/**
- * @license React
- * react-jsx-runtime.production.js
- *
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
 var Ae;
 function Fe() {
   if (Ae) return x;
@@ -32,22 +23,13 @@ function Fe() {
   return x.Fragment = t, x.jsx = n, x.jsxs = n, x;
 }
 var L = {};
-/**
- * @license React
- * react-jsx-runtime.development.js
- *
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
 var Oe;
 function We() {
   return Oe || (Oe = 1, process.env.NODE_ENV !== "production" && (function() {
     function e(r) {
       if (r == null) return null;
       if (typeof r == "function")
-        return r.$$typeof === z ? null : r.displayName || r.name || null;
+        return r.$$typeof === V ? null : r.displayName || r.name || null;
       if (typeof r == "string") return r;
       switch (r) {
         case O:
@@ -60,14 +42,14 @@ function We() {
           return "Suspense";
         case U:
           return "SuspenseList";
-        case V:
+        case z:
           return "Activity";
       }
       if (typeof r == "object")
         switch (typeof r.tag == "number" && console.error(
           "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
         ), r.$$typeof) {
-          case v:
+          case b:
             return "Portal";
           case K:
             return (r.displayName || "Context") + ".Provider";
@@ -76,9 +58,9 @@ function We() {
           case ue:
             var l = r.render;
             return r = r.displayName, r || (r = l.displayName || l.name || "", r = r !== "" ? "ForwardRef(" + r + ")" : "ForwardRef"), r;
-          case S:
+          case w:
             return l = r.displayName || null, l !== null ? l : e(r.type) || "Memo";
-          case y:
+          case I:
             l = r._payload, r = r._init;
             try {
               return e(r(l));
@@ -99,17 +81,17 @@ function We() {
       }
       if (l) {
         l = console;
-        var d = l.error, g = typeof Symbol == "function" && Symbol.toStringTag && r[Symbol.toStringTag] || r.constructor.name || "Object";
+        var d = l.error, R = typeof Symbol == "function" && Symbol.toStringTag && r[Symbol.toStringTag] || r.constructor.name || "Object";
         return d.call(
           l,
           "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
-          g
+          R
         ), t(r);
       }
     }
     function s(r) {
       if (r === O) return "<>";
-      if (typeof r == "object" && r !== null && r.$$typeof === y)
+      if (typeof r == "object" && r !== null && r.$$typeof === I)
         return "<...>";
       try {
         var l = e(r);
@@ -119,7 +101,7 @@ function We() {
       }
     }
     function o() {
-      var r = T.A;
+      var r = M.A;
       return r === null ? null : r.getOwner();
     }
     function i() {
@@ -150,13 +132,13 @@ function We() {
         "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
       )), r = this.props.ref, r !== void 0 ? r : null;
     }
-    function m(r, l, d, g, R, w, de, Ee) {
-      return d = w.ref, r = {
-        $$typeof: I,
+    function m(r, l, d, R, _, v, de, Ee) {
+      return d = v.ref, r = {
+        $$typeof: j,
         type: r,
         key: l,
-        props: w,
-        _owner: R
+        props: v,
+        _owner: _
       }, (d !== void 0 ? d : null) !== null ? Object.defineProperty(r, "ref", {
         enumerable: !1,
         get: f
@@ -182,13 +164,13 @@ function We() {
         value: Ee
       }), Object.freeze && (Object.freeze(r.props), Object.freeze(r)), r;
     }
-    function N(r, l, d, g, R, w, de, Ee) {
+    function N(r, l, d, R, _, v, de, Ee) {
       var k = l.children;
       if (k !== void 0)
-        if (g)
+        if (R)
           if (fe(k)) {
-            for (g = 0; g < k.length; g++)
-              p(k[g]);
+            for (R = 0; R < k.length; R++)
+              p(k[R]);
             Object.freeze && Object.freeze(k);
           } else
             console.error(
@@ -197,21 +179,21 @@ function We() {
         else p(k);
       if (G.call(l, "key")) {
         k = e(r);
-        var j = Object.keys(l).filter(function(Be) {
-          return Be !== "key";
+        var P = Object.keys(l).filter(function(De) {
+          return De !== "key";
         });
-        g = 0 < j.length ? "{key: someKey, " + j.join(": ..., ") + ": ...}" : "{key: someKey}", h[k + g] || (j = 0 < j.length ? "{" + j.join(": ..., ") + ": ...}" : "{}", console.error(
+        R = 0 < P.length ? "{key: someKey, " + P.join(": ..., ") + ": ...}" : "{key: someKey}", h[k + R] || (P = 0 < P.length ? "{" + P.join(": ..., ") + ": ...}" : "{}", console.error(
           `A props object containing a "key" prop is being spread into JSX:
   let props = %s;
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
   <%s key={someKey} {...props} />`,
-          g,
+          R,
           k,
-          j,
+          P,
           k
-        ), h[k + g] = !0);
+        ), h[k + R] = !0);
       }
       if (k = null, d !== void 0 && (n(d), k = "" + d), c(l) && (n(l.key), k = "" + l.key), "key" in l) {
         d = {};
@@ -224,8 +206,8 @@ React keys must be passed directly to JSX without using spread:
       ), m(
         r,
         k,
-        w,
-        R,
+        v,
+        _,
         o(),
         d,
         de,
@@ -233,43 +215,43 @@ React keys must be passed directly to JSX without using spread:
       );
     }
     function p(r) {
-      typeof r == "object" && r !== null && r.$$typeof === I && r._store && (r._store.validated = 1);
+      typeof r == "object" && r !== null && r.$$typeof === j && r._store && (r._store.validated = 1);
     }
-    var P = A, I = Symbol.for("react.transitional.element"), v = Symbol.for("react.portal"), O = Symbol.for("react.fragment"), le = Symbol.for("react.strict_mode"), F = Symbol.for("react.profiler"), W = Symbol.for("react.consumer"), K = Symbol.for("react.context"), ue = Symbol.for("react.forward_ref"), ae = Symbol.for("react.suspense"), U = Symbol.for("react.suspense_list"), S = Symbol.for("react.memo"), y = Symbol.for("react.lazy"), V = Symbol.for("react.activity"), z = Symbol.for("react.client.reference"), T = P.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, G = Object.prototype.hasOwnProperty, fe = Array.isArray, M = console.createTask ? console.createTask : function() {
+    var y = A, j = Symbol.for("react.transitional.element"), b = Symbol.for("react.portal"), O = Symbol.for("react.fragment"), le = Symbol.for("react.strict_mode"), F = Symbol.for("react.profiler"), W = Symbol.for("react.consumer"), K = Symbol.for("react.context"), ue = Symbol.for("react.forward_ref"), ae = Symbol.for("react.suspense"), U = Symbol.for("react.suspense_list"), w = Symbol.for("react.memo"), I = Symbol.for("react.lazy"), z = Symbol.for("react.activity"), V = Symbol.for("react.client.reference"), M = y.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, G = Object.prototype.hasOwnProperty, fe = Array.isArray, T = console.createTask ? console.createTask : function() {
       return null;
     };
-    P = {
+    y = {
       react_stack_bottom_frame: function(r) {
         return r();
       }
     };
-    var J, a = {}, _ = P.react_stack_bottom_frame.bind(
-      P,
+    var J, a = {}, g = y.react_stack_bottom_frame.bind(
+      y,
       i
-    )(), E = M(s(i)), h = {};
-    L.Fragment = O, L.jsx = function(r, l, d, g, R) {
-      var w = 1e4 > T.recentlyCreatedOwnerStacks++;
+    )(), E = T(s(i)), h = {};
+    L.Fragment = O, L.jsx = function(r, l, d, R, _) {
+      var v = 1e4 > M.recentlyCreatedOwnerStacks++;
       return N(
         r,
         l,
         d,
         !1,
-        g,
         R,
-        w ? Error("react-stack-top-frame") : _,
-        w ? M(s(r)) : E
+        _,
+        v ? Error("react-stack-top-frame") : g,
+        v ? T(s(r)) : E
       );
-    }, L.jsxs = function(r, l, d, g, R) {
-      var w = 1e4 > T.recentlyCreatedOwnerStacks++;
+    }, L.jsxs = function(r, l, d, R, _) {
+      var v = 1e4 > M.recentlyCreatedOwnerStacks++;
       return N(
         r,
         l,
         d,
         !0,
-        g,
         R,
-        w ? Error("react-stack-top-frame") : _,
-        w ? M(s(r)) : E
+        _,
+        v ? Error("react-stack-top-frame") : g,
+        v ? T(s(r)) : E
       );
     };
   })()), L;
@@ -279,14 +261,14 @@ function Ke() {
   return Ie || (Ie = 1, process.env.NODE_ENV === "production" ? X.exports = Fe() : X.exports = We()), X.exports;
 }
 var C = Ke();
-const ye = () => {
-  const e = window.getSelection(), t = document.getElementById("entity-editor");
-  if (!e || !t) return { start: 0, end: 0 };
-  if (e.anchorNode && t.contains(e.anchorNode)) {
-    const n = e.getRangeAt(0), s = n.cloneRange();
-    s.selectNodeContents(t), s.setEnd(n.startContainer, n.startOffset);
+const Ce = (e) => {
+  const t = window.getSelection();
+  if (!t || !e) return { start: 0, end: 0 };
+  if (t.anchorNode && e.contains(t.anchorNode)) {
+    const n = t.getRangeAt(0), s = n.cloneRange();
+    s.selectNodeContents(e), s.setEnd(n.startContainer, n.startOffset);
     const o = s.toString().length, i = n.cloneRange();
-    i.selectNodeContents(t), i.setEnd(n.endContainer, n.endOffset);
+    i.selectNodeContents(e), i.setEnd(n.endContainer, n.endOffset);
     const c = i.toString().length;
     return { start: o, end: c };
   } else
@@ -314,31 +296,34 @@ const ye = () => {
     const N = window.getSelection();
     N?.removeAllRanges(), N?.addRange(m);
   }
-}, Ve = (e, t, n) => {
+}, ze = (e, t, n) => {
   let s = "", o = "", i = "", c = "";
   t.includes("bold") && (o = "bold"), t.includes("italic") && (i = "italic"), (t.includes("underline") || e === "link") && (c += "underline"), t.includes("strike") && (c += " line-through"), e !== "segment" && (s = "#1da1f2", e === "mention" && n.mentionColor ? s = n.mentionColor : e === "interest" && n.interestColor ? s = n.interestColor : e === "link" && n.linkColor && (s = n.linkColor));
   let u = "";
   return s && (u += `color: ${s}; `), o && (u += `font-weight: ${o}; `), i && (u += `font-style: ${i}; `), c && (u += `text-decoration: ${c}; `), u;
-}, Ce = (e, t, n) => {
+}, ye = (e, t, n) => {
   if (t.length === 0)
     return e;
   let s = "", o = 0;
   return t.forEach((i) => {
     o < i.startIndex && (s += e.slice(o, i.startIndex));
-    const c = e.slice(i.startIndex, i.endIndex), u = Ve(i.type, i.marks, n);
+    const c = e.slice(i.startIndex, i.endIndex), u = ze(i.type, i.marks, n);
     s += `<span style="${u}">${c}</span>`, o = i.endIndex;
   }), s += e.slice(o), s;
-}, ze = (e, t) => {
+}, Ve = (e, t) => {
   let n = !1;
   e.key === "Enter" && !e.shiftKey ? (e.preventDefault(), document.execCommand("insertLineBreak"), n = !0) : (e.metaKey || e.ctrlKey) && (e.key === "b" ? (t("bold"), n = !0) : e.key === "i" ? (t("italic"), n = !0) : e.key === "u" ? (t("underline"), n = !0) : e.key === "s" && (t("strike"), n = !0)), n && e.preventDefault();
-}, ee = 128, Ge = /^(?<protocol>[a-z\-]+)?:?(?<host>\/\/.*\.[^\/]+)$/, Je = "()[]{}", Me = "", xe = (e, t) => {
+}, ee = 128, Ge = "()[]{}", Te = "", Je = new RegExp(
+  "^(?:(?:(?:https?|ftp):)?\\/\\/)(?:\\S+(?::\\S*)?@)?(?:(?!(?:10|127)(?:\\.\\d{1,3}){3})(?!(?:169\\.254|192\\.168)(?:\\.\\d{1,3}){2})(?!172\\.(?:1[6-9]|2\\d|3[0-1])(?:\\.\\d{1,3}){2})(?:[1-9]\\d?|1\\d\\d|2[01]\\d|22[0-3])(?:\\.(?:1?\\d{1,2}|2[0-4]\\d|25[0-5])){2}(?:\\.(?:[1-9]\\d?|1\\d\\d|2[0-4]\\d|25[0-4]))|(?:(?:[a-z0-9\\u00a1-\\uffff][a-z0-9\\u00a1-\\uffff_-]{0,62})?[a-z0-9\\u00a1-\\uffff]\\.)+(?:[a-z\\u00a1-\\uffff]{2,}\\.?))(?::\\d{2,5})?(?:[/?#]\\S*)?$",
+  "i"
+), xe = (e, t) => {
   const n = ve(
     e,
     t,
-    Je,
-    Me
+    Ge,
+    Te
   );
-  return n?.search.match(Ge) ? {
+  return n?.search.match(Je) ? {
     type: "link",
     ...n
   } : null;
@@ -353,7 +338,7 @@ const ye = () => {
     type: "mention",
     ...n
   } : null;
-}, oe = (e) => (e & re) !== 0, _e = (e, t) => t ? e | re : e & ~re, D = 2, q = (e) => (e & D) !== 0, ke = (e, t) => t ? e | D : e & ~D, B = 4, H = (e) => (e & B) !== 0, be = (e, t) => t ? e | B : e & ~B, $ = 16, Z = (e) => (e & $) !== 0, Se = (e, t) => t ? e | $ : e & ~$, Y = 8, Q = (e) => (e & Y) !== 0, we = (e, t) => t ? e | Y : e & ~Y, Pe = (e, t) => {
+}, oe = (e) => (e & re) !== 0, _e = (e, t) => t ? e | re : e & ~re, B = 2, q = (e) => (e & B) !== 0, ke = (e, t) => t ? e | B : e & ~B, D = 4, H = (e) => (e & D) !== 0, Se = (e, t) => t ? e | D : e & ~D, $ = 16, Z = (e) => (e & $) !== 0, be = (e, t) => t ? e | $ : e & ~$, Y = 8, Q = (e) => (e & Y) !== 0, we = (e, t) => t ? e | Y : e & ~Y, je = (e, t) => {
   if (e === t) return null;
   let n = 0;
   for (; n < e.length && n < t.length && e[n] === t[n]; )
@@ -369,7 +354,7 @@ const ye = () => {
 }, ge = (e, t, n, s) => {
   let o = t;
   for (; o < e.length; ) {
-    const c = b(e, o);
+    const c = S(e, o);
     if (n(c))
       e[o] = s(c, !1);
     else
@@ -378,7 +363,7 @@ const ye = () => {
   }
   let i = t - 1;
   for (; i >= 0; ) {
-    const c = b(e, i);
+    const c = S(e, i);
     if (n(c))
       e[i] = s(c, !1);
     else
@@ -386,14 +371,14 @@ const ye = () => {
     i--;
   }
   return e;
-}, je = (e, t, n) => {
+}, Pe = (e, t, n) => {
   if (!t) return e;
   const { position: s, deletedLength: o, insertedText: i } = t, c = i.length;
   let u = [...e];
-  const f = b(u, s);
+  const f = S(u, s);
   if (oe(f) ? u = ge(u, s, oe, _e) : ce(f) ? u = ge(u, s, ce, Ne) : te(f) && (u = ge(u, s, te, Re)), o > 0 && u.splice(s, o), c > 0) {
     let m = 0;
-    n.bold && (m = ke(m, !0)), n.italic && (m = be(m, !0)), n.underline && (m = we(m, !0)), n.strike && (m = Se(m, !0));
+    n.bold && (m = ke(m, !0)), n.italic && (m = Se(m, !0)), n.underline && (m = we(m, !0)), n.strike && (m = be(m, !0));
     const N = new Array(c).fill(m);
     u.splice(s, 0, ...N);
   }
@@ -426,7 +411,7 @@ const ye = () => {
     startIndex: i,
     endIndex: c
   };
-}, se = 64, Ze = `.,!?;()[]{}"'<>@`, Qe = /^#[\w-]+$/, ie = "#", De = (e, t) => {
+}, se = 64, Ze = `.,!?;()[]{}"'<>@`, Qe = /^#[\w-]+$/, ie = "#", Be = (e, t) => {
   const n = ve(
     e,
     t,
@@ -443,14 +428,14 @@ const ye = () => {
   const s = [];
   let o = 0;
   for (; o < t.length; ) {
-    const i = b(t, o);
+    const i = S(t, o);
     if (i === 0 || i === 1) {
       o++;
       continue;
     }
     const c = o;
     let u = o;
-    for (; u + 1 < t.length && b(t, u + 1) === i; )
+    for (; u + 1 < t.length && S(t, u + 1) === i; )
       u++;
     const f = rt(i, n), m = nt(i), N = {
       type: f,
@@ -458,7 +443,7 @@ const ye = () => {
       endIndex: u + 1,
       marks: m,
       username: f === "mention" ? Le(e, u)?.search.replace(ne, "") : void 0,
-      interest: f === "interest" ? De(e, u)?.search.replace(
+      interest: f === "interest" ? Be(e, u)?.search.replace(
         ie,
         ""
       ) : void 0,
@@ -467,14 +452,14 @@ const ye = () => {
     s.push(N), o = u + 1;
   }
   return s;
-}, rt = (e, t) => e & re && t.mentions ? "mention" : e & se && t.interests ? "interest" : e & ee && t.links ? "link" : (e & (D | B | Y | $), "segment"), nt = (e) => {
+}, rt = (e, t) => e & re && t.mentions ? "mention" : e & se && t.interests ? "interest" : e & ee && t.links ? "link" : (e & (B | D | Y | $), "segment"), nt = (e) => {
   const t = [];
-  return e & D && t.push("bold"), e & B && t.push("italic"), e & Y && t.push("underline"), e & $ && t.push("strike"), t;
-}, b = (e, t) => {
+  return e & B && t.push("bold"), e & D && t.push("italic"), e & Y && t.push("underline"), e & $ && t.push("strike"), t;
+}, S = (e, t) => {
   const n = e[t];
   return typeof n != "number" ? 0 : n;
 }, ot = (e, t, n) => {
-  const s = b(e, t);
+  const s = S(e, t);
   switch (n) {
     case "mention":
       return _e(s, !0);
@@ -485,26 +470,26 @@ const ye = () => {
   }
   return s;
 }, st = (e, t, n, s) => {
-  let o = b(e, t);
+  let o = S(e, t);
   switch (n) {
     case "bold":
       o = ke(o, s);
       break;
     case "italic":
-      o = be(o, s);
+      o = Se(o, s);
       break;
     case "underline":
       o = we(o, s);
       break;
     case "strike":
-      o = Se(o, s);
+      o = be(o, s);
       break;
     default:
       return e;
   }
   return e[t] = o, e;
 }, it = (e, t, n) => {
-  const s = b(e, t);
+  const s = S(e, t);
   switch (n) {
     case "bold":
       return q(s);
@@ -523,16 +508,16 @@ const ye = () => {
   return !0;
 }, pe = (e) => oe(e) || ce(e) || te(e), lt = (e, t, n, s) => {
   let o = [...e];
-  for (; pe(b(e, t - 1)) && t > 0; )
+  for (; pe(S(e, t - 1)) && t > 0; )
     t--;
-  for (; pe(b(e, n)) && n < e.length; )
+  for (; pe(S(e, n)) && n < e.length; )
     n++;
   let i = !0;
   ct(t, n, s, o) && (i = !1);
   for (let c = t; c < n; c++)
     o = st(o, c, s, i);
   return o;
-}, Te = (e, t) => {
+}, Me = (e, t) => {
   const n = new Array(e.length).fill(0);
   for (let s = 0; s < e.length; s++) {
     let o = 0;
@@ -540,7 +525,7 @@ const ye = () => {
     if (i) {
       i.type === "mention" ? o = _e(o, !0) : i.type === "interest" ? o = Ne(o, !0) : i.type === "link" && (o = Re(o, !0));
       for (const c of i.marks)
-        c === "bold" ? o = ke(o, !0) : c === "italic" ? o = be(o, !0) : c === "underline" ? o = we(o, !0) : c === "strike" && (o = Se(o, !0));
+        c === "bold" ? o = ke(o, !0) : c === "italic" ? o = Se(o, !0) : c === "underline" ? o = we(o, !0) : c === "strike" && (o = be(o, !0));
     }
     n[s] = o;
   }
@@ -565,54 +550,57 @@ const ye = () => {
   options: m = {},
   entityStyles: N = {},
   placeholder: p = "",
-  debug: P = !1,
-  ...I
+  debug: y = !1,
+  ...j
 }) => {
-  const v = A.useRef(null), [O, le] = A.useState({ start: 0, end: 0 }), [F, W] = A.useState(!1), [K, ue] = A.useState(!1), [ae, U] = A.useState(!1), [S, y] = A.useState(
-    Te(t, s)
+  const b = A.useRef(null), [O, le] = A.useState({ start: 0, end: 0 }), [F, W] = A.useState(!1), [K, ue] = A.useState(!1), [ae, U] = A.useState(!1), [w, I] = A.useState(
+    Me(t, s)
   );
   e.current = {
-    selectEntity: (a, _, E, h) => {
-      if (!v.current) return;
-      let r = [...S];
-      a === "mention" ? h = ne + h : a === "interest" ? h = ie + h : a === "link" && (h = Me + h);
-      const l = t.slice(0, _) + h + t.slice(E), d = Pe(t, l);
-      d ? r = je(S, d, i) : r = Te(l, s);
-      for (let g = _; g < _ + h.length; g++)
-        r[g] = ot(r, g, a);
-      n(l), y(r), f(null);
+    selectEntity: (a, g, E, h) => {
+      if (!b.current) return;
+      let r = [...w];
+      a === "mention" ? h = ne + h : a === "interest" ? h = ie + h : a === "link" && (h = Te + h);
+      const l = t.slice(0, g) + h + t.slice(E), d = je(t, l);
+      d ? r = Pe(w, d, i) : r = Me(l, s);
+      for (let R = g; R < g + h.length; R++)
+        r[R] = ot(r, R, a);
+      n(l), I(r), f(null);
     },
     toggleMark: (a) => {
-      z(a);
+      V(a);
+    },
+    clear: () => {
+      n(""), I([]), o([]);
     }
   }, A.useEffect(() => {
-    if (v.current) {
-      v.current.textContent = t;
-      const a = Ce(t, s, N);
-      v.current.innerHTML = a, K || ue(!0);
+    if (b.current) {
+      b.current.textContent = t;
+      const a = ye(t, s, N);
+      b.current.innerHTML = a, K || ue(!0);
     }
   }, []), A.useEffect(() => {
-    if (!v.current) return;
-    const a = tt(t, S, m), _ = ye() ?? O, E = Ce(t, a, N);
-    v.current.innerHTML = E, o(a), K && Ue(v.current, _);
-  }, [S]);
-  const V = ut(O, 500);
+    if (!b.current) return;
+    const a = tt(t, w, m), g = Ce(b.current) ?? O, E = ye(t, a, N);
+    b.current.innerHTML = E, o(a), K && Ue(b.current, g);
+  }, [w]);
+  const z = ut(O, 500);
   A.useEffect(() => {
-    let { start: a, end: _ } = V, E = null;
-    if (!E && !oe(b(S, a - 1)) && (E = Le(t, a), E && (E.search = E.search.replace(ne, ""))), !E && !ce(b(S, a - 1)) && (E = De(t, a), E && (E.search = E.search.replace(ie, ""))), !E && !te(b(S, a - 1)) && (E = xe(t, a)), E ? f(E) : u && f(null), F) return;
+    let { start: a, end: g } = z, E = null;
+    if (!E && !oe(S(w, a - 1)) && (E = Le(t, a), E && (E.search = E.search.replace(ne, ""))), !E && !ce(S(w, a - 1)) && (E = Be(t, a), E && (E.search = E.search.replace(ie, ""))), !E && !te(S(w, a - 1)) && (E = xe(t, a)), E ? f(E) : u && f(null), F) return;
     let h = !0, r = !0, l = !0, d = !0;
-    if (a === _)
+    if (a === g)
       if (a > 0) {
-        const R = b(S, a - 1);
-        h = q(R), r = H(R), l = Q(R), d = Z(R);
+        const _ = S(w, a - 1);
+        h = q(_), r = H(_), l = Q(_), d = Z(_);
       } else {
-        const R = b(S, a);
-        h = q(R), r = H(R), l = Q(R), d = Z(R);
+        const _ = S(w, a);
+        h = q(_), r = H(_), l = Q(_), d = Z(_);
       }
     else
-      for (let R = a; R < _; R++) {
-        const w = b(S, R);
-        h = q(w) ? h : !1, r = H(w) ? r : !1, l = Q(w) ? l : !1, d = Z(w) ? d : !1;
+      for (let _ = a; _ < g; _++) {
+        const v = S(w, _);
+        h = q(v) ? h : !1, r = H(v) ? r : !1, l = Q(v) ? l : !1, d = Z(v) ? d : !1;
       }
     c({
       bold: h,
@@ -620,44 +608,44 @@ const ye = () => {
       underline: l,
       strike: d
     });
-  }, [V]);
-  const z = (a) => {
-    if (W(!0), !v.current)
+  }, [z]);
+  const V = (a) => {
+    if (W(!0), !b.current)
       return;
-    const { start: _, end: E } = O;
-    if (_ !== E) {
-      const r = lt(S, _, E, a);
-      y(r);
+    const { start: g, end: E } = O;
+    if (g !== E) {
+      const r = lt(w, g, E, a);
+      I(r);
     }
     const h = { ...i };
     a === "bold" ? h.bold = !i.bold : a === "italic" ? h.italic = !i.italic : a === "underline" ? h.underline = !i.underline : a === "strike" && (h.strike = !i.strike), c(h);
-  }, T = (a) => {
-    if (!v.current) return;
+  }, M = (a) => {
+    if (!b.current) return;
     if (F && W(!1), a.target.textContent.length === 0) {
-      n(""), y([]), o([]);
+      n(""), I([]), o([]);
       return;
     }
-    const _ = a.target.innerText || "", E = Pe(t, _);
+    const g = a.target.innerText || "", E = je(t, g);
     if (E) {
-      const h = je(
-        S,
+      const h = Pe(
+        w,
         E,
         i
       );
-      y(h);
+      I(h);
     }
-    n(_);
+    n(g);
   }, G = (a) => {
-    v.current && ze(a, z);
+    b.current && Ve(a, V);
   }, fe = () => {
     U(!0);
-  }, M = () => {
+  }, T = () => {
     U(!1);
   };
   A.useEffect(() => {
     const a = () => {
-      const _ = ye() ?? { start: 0, end: 0 };
-      (_.start !== O.start || _.end !== O.end) && le(_);
+      const g = Ce(b.current);
+      g && (g.start !== O.start || g.end !== O.end) && le(g);
     };
     return document.addEventListener("selectionchange", a), () => {
       document.removeEventListener("selectionchange", a);
@@ -669,15 +657,14 @@ const ye = () => {
       /* @__PURE__ */ C.jsx(
         "div",
         {
-          id: "entity-editor",
-          ref: v,
-          style: { ...I.style, position: "relative", zIndex: 2 },
-          className: I.className,
+          ref: b,
+          style: { ...j.style, position: "relative", zIndex: 2 },
+          className: j.className,
           contentEditable: !0,
           onKeyDown: G,
-          onInput: T,
+          onInput: M,
           onFocus: fe,
-          onBlur: M,
+          onBlur: T,
           role: "textbox",
           "aria-multiline": "true"
         }
@@ -686,20 +673,20 @@ const ye = () => {
         "div",
         {
           style: {
+            ...j.style,
             position: "absolute",
             top: 0,
             left: 0,
-            paddingTop: I.style?.paddingTop,
-            paddingLeft: I.style?.paddingLeft,
-            padding: I.style?.padding,
+            right: 0,
+            bottom: 0,
             color: "#9ca3af"
           },
           "aria-hidden": "true",
-          children: p
+          children: /* @__PURE__ */ C.jsx("p", { children: p })
         }
       )
     ] }),
-    P && /* @__PURE__ */ C.jsx("div", { style: {}, children: /* @__PURE__ */ C.jsx("pre", { children: JSON.stringify(S) }) })
+    y && /* @__PURE__ */ C.jsx("div", { style: {}, children: /* @__PURE__ */ C.jsx("pre", { children: JSON.stringify(w) }) })
   ] });
 };
 export {

package/dist/src/Editor.d.ts

@@ -3,6 +3,7 @@ import { Entity, EntityOptions, StyleOptions, EntityType, MarkState, MarkType, S
 export interface EditorRef {
     selectEntity: (entityType: EntityType, startIndex: number, endIndex: number, newText: string) => void;
     toggleMark: (markType: MarkType) => void;
+    clear: () => void;
 }
 export interface EditorProps {
     ref: React.RefObject<EditorRef | null>;

package/dist/src/helpers/dom.d.ts

@@ -1,4 +1,4 @@
 import { Entity, SelectionRange, StyleOptions } from '../interfaces';
-export declare const getSelection: () => SelectionRange | null;
+export declare const getSelection: (editableDiv: HTMLElement | null) => SelectionRange | null;
 export declare const setSelection: (div: HTMLDivElement, selectionRange: SelectionRange) => void;
 export declare const buildHtml: (plainText: string, entities: Entity[], styles: StyleOptions) => string;

package/dist/src/helpers/entities/Link.d.ts

@@ -1,8 +1,8 @@
 import { SearchEntity } from '../../interfaces';
 export declare const LINK_MASK = 128;
-export declare const LINK_REGEX: RegExp;
 export declare const LINK_BOUNDARIES = "()[]{}";
 export declare const LINK_KEY = "";
+export declare const LINK_REGEX: RegExp;
 export declare const getLinkWord: (plainText: string, position: number) => SearchEntity | null;
 export declare const isLink: (value: number) => boolean;
 export declare const setLink: (value: number, link: boolean) => number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@connectedxm/entity-editor",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "private": false,
   "type": "module",
   "main": "dist/index.umd.js",