@markput/react 0.1.0 → 0.3.0

package/index.js

@@ -1,49 +1,38 @@
 import "./index.css";
-import { jsx as m, Fragment as oe, jsxs as ie } from "react/jsx-runtime";
-import ae, { createContext as ce, useContext as N, useEffect as x, useState as A, useRef as I, memo as W, useCallback as R, useImperativeHandle as le, useMemo as ue, forwardRef as de } from "react";
-function he(t) {
-  return t ? Object.fromEntries(
-    Object.entries(t).map(([e, n]) => e.startsWith("data") && e.length > 4 && e[4] === e[4].toUpperCase() ? [`data-${e.slice(4).replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase()}`, n] : [e, n])
-  ) : {};
+import { jsx as f, Fragment as wt, jsxs as Z } from "react/jsx-runtime";
+import { createContext as at, useContext as ct, useRef as H, useMemo as S, useLayoutEffect as St, memo as O, useState as P, useCallback as k, useEffect as M, useImperativeHandle as Ct } from "react";
+function bt(s) {
+  if (s == null) throw new Error("Value must be a non nullable!");
 }
-const fe = {
-  container: "div",
-  span: "span"
-};
-function Z(t, e) {
-  return e.props.slots?.[t] ? e.props.slots[t] : fe[t];
-}
-function J(t, e) {
-  const n = e.props.slotProps?.[t];
-  return n ? he(n) : void 0;
-}
-function ge(...t) {
-  return t.filter(Boolean).join(" ") || void 0;
+function Et(s) {
+  return s ? Object.fromEntries(
+    Object.entries(s).map(([t, e]) => t.startsWith("data") && t.length > 4 && t[4] === t[4].toUpperCase() ? [`data-${t.slice(4).replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase()}`, e] : [t, e])
+  ) : {};
 }
-function pe(...t) {
-  const e = t.reduce((n, s) => (s && Object.assign(n, s), n), {});
-  return Object.keys(e).length > 0 ? e : void 0;
+function Tt(...s) {
+  return s.filter(Boolean).join(" ") || void 0;
 }
-function Q(t) {
-  if (t == null) throw new Error("Value must be a non nullable!");
+function Nt(...s) {
+  const t = Object.assign({}, ...s.filter(Boolean));
+  return Object.keys(t).length > 0 ? t : void 0;
 }
-var k = /* @__PURE__ */ ((t) => (t.UP = "ArrowUp", t.DOWN = "ArrowDown", t.LEFT = "ArrowLeft", t.RIGHT = "ArrowRight", t.END = "End", t.HOME = "Home", t.PAGE_DOWN = "PageDown", t.PAGE_UP = "PageUp", t.ENTER = "Enter", t.TAB = "Tab", t.SPACE = " ", t.BACKSPACE = "Backspace", t.DELETE = "Delete", t.COMMA = ",", t.ESC = "Escape", t))(k || {});
-const me = "@", ve = "@[__value__](__meta__)", y = {
+var x = /* @__PURE__ */ ((s) => (s.UP = "ArrowUp", s.DOWN = "ArrowDown", s.LEFT = "ArrowLeft", s.RIGHT = "ArrowRight", s.END = "End", s.HOME = "Home", s.PAGE_DOWN = "PageDown", s.PAGE_UP = "PageUp", s.ENTER = "Enter", s.TAB = "Tab", s.SPACE = " ", s.BACKSPACE = "Backspace", s.DELETE = "Delete", s.COMMA = ",", s.ESC = "Escape", s))(x || {});
+const It = "@", Pt = "@[__value__](__meta__)", y = {
   Value: "__value__",
   Meta: "__meta__",
   Nested: "__nested__"
-}, w = {
+}, N = {
   Value: "value",
   Meta: "meta",
   Nested: "nested"
 };
-function xe(t, e) {
-  const { segments: n, gapTypes: s, counts: r, valueGapIndices: o } = ye(t);
-  ke(r, t);
-  const i = r.value === 2, { segments: a, gapTypes: c } = i ? Se(n, s, o) : { segments: n, gapTypes: s };
+function Mt(s, t) {
+  const { segments: e, gapTypes: n, counts: r, valueGapIndices: o } = Lt(s);
+  At(r, s);
+  const i = r.value === 2, { segments: a, gapTypes: c } = i ? Ot(e, n, o) : { segments: e, gapTypes: n };
   return {
-    markup: t,
-    index: e,
+    markup: s,
+    index: t,
     segments: a,
     gapTypes: c,
     hasNested: r.nested === 1,
@@ -52,110 +41,110 @@ function xe(t, e) {
     // Will be populated by MarkupRegistry
   };
 }
-function ye(t) {
-  const e = [], n = [], s = [], r = {
+function Lt(s) {
+  const t = [], e = [], n = [], r = {
     value: 0,
     meta: 0,
     nested: 0
-  }, o = [], i = [w.Value, w.Meta, w.Nested];
+  }, o = [], i = [N.Value, N.Meta, N.Nested];
   for (const l of i) {
-    const h = j[l];
-    let u = t.indexOf(h);
-    for (; u !== -1; )
-      o.push({ type: l, position: u }), u = t.indexOf(h, u + h.length);
+    const d = nt[l];
+    let g = s.indexOf(d);
+    for (; g !== -1; )
+      o.push({ type: l, position: g }), g = s.indexOf(d, g + d.length);
   }
-  o.sort((l, h) => l.position - h.position);
+  o.sort((l, d) => l.position - d.position);
   let a = 0;
   for (const l of o) {
-    const h = t.substring(a, l.position);
-    h.length > 0 && e.push(h), n.push(l.type), r[l.type]++, l.type === w.Value && s.push(n.length - 1), a = l.position + j[l.type].length;
+    const d = s.substring(a, l.position);
+    d.length > 0 && t.push(d), e.push(l.type), r[l.type]++, l.type === N.Value && n.push(e.length - 1), a = l.position + nt[l.type].length;
   }
-  const c = t.substring(a);
-  return c.length > 0 && e.push(c), {
-    segments: e,
-    gapTypes: n,
+  const c = s.substring(a);
+  return c.length > 0 && t.push(c), {
+    segments: t,
+    gapTypes: e,
     counts: r,
-    valueGapIndices: s
+    valueGapIndices: n
   };
 }
-function ke(t, e) {
-  const n = [
-    { count: t.value, max: 2, name: y.Value },
-    { count: t.meta, max: 1, name: y.Meta },
-    { count: t.nested, max: 1, name: y.Nested }
+function At(s, t) {
+  const e = [
+    { count: s.value, max: 2, name: y.Value },
+    { count: s.meta, max: 1, name: y.Meta },
+    { count: s.nested, max: 1, name: y.Nested }
   ];
-  for (const { count: s, max: r, name: o } of n)
-    if (s > r)
-      throw new Error(`Invalid markup: "${e}". Max ${r} "${o}" placeholders, got ${s}`);
-  if (t.value === 0 && t.nested === 0)
+  for (const { count: n, max: r, name: o } of e)
+    if (n > r)
+      throw new Error(`Invalid markup: "${t}". Max ${r} "${o}" placeholders, got ${n}`);
+  if (s.value === 0 && s.nested === 0)
     throw new Error(
-      `Invalid markup: "${e}". Need at least one "${y.Value}" or "${y.Nested}"`
+      `Invalid markup: "${t}". Need at least one "${y.Value}" or "${y.Nested}"`
     );
 }
-const j = {
-  [w.Value]: y.Value,
-  [w.Meta]: y.Meta,
-  [w.Nested]: y.Nested
+const nt = {
+  [N.Value]: y.Value,
+  [N.Meta]: y.Meta,
+  [N.Nested]: y.Nested
 };
-function Se(t, e, n) {
-  if (n.length !== 2)
-    return { segments: t, gapTypes: e };
-  const [s, r] = n, o = [], i = t[s], a = t[s + 1];
-  i && a && o.push(u(i, a, t[s + 2]));
-  for (let d = s + 2; d < r; d++)
-    o.push(t[d]);
-  const c = t[r], l = t[r + 1];
-  c && l && o.push(u(c, l, t[r + 2]));
-  const h = e.filter((d) => d !== w.Value);
-  return { segments: o, gapTypes: h };
-  function u(d, g, E) {
-    if (!E) return [d, g, ""];
-    const L = E.charAt(0), re = L && !g.includes(L) && !E.startsWith(d) ? L : "";
-    return [d, g, re];
-  }
-}
-class Ce {
+function Ot(s, t, e) {
+  if (e.length !== 2)
+    return { segments: s, gapTypes: t };
+  const [n, r] = e, o = [], i = s[n], a = s[n + 1];
+  i && a && o.push(g(i, a, s[n + 2]));
+  for (let u = n + 2; u < r; u++)
+    o.push(s[u]);
+  const c = s[r], l = s[r + 1];
+  c && l && o.push(g(c, l, s[r + 2]));
+  const d = t.filter((u) => u !== N.Value);
+  return { segments: o, gapTypes: d };
+  function g(u, h, v) {
+    if (!v) return [u, h, ""];
+    const C = v.charAt(0), m = C && !h.includes(C) && !v.startsWith(u) ? C : "";
+    return [u, h, m];
+  }
+}
+class Dt {
   markups;
   descriptors;
   /** Deduplicated list of unique segment definitions (static strings or dynamic patterns) */
   segments = [];
   /** Map from first segment index to descriptors that start with this segment (for O(1) lookup) */
   firstSegmentIndexMap = /* @__PURE__ */ new Map();
-  constructor(e) {
-    this.markups = e;
-    const n = /* @__PURE__ */ new Map();
-    this.descriptors = e.map((s, r) => {
-      if (s === void 0)
+  constructor(t) {
+    this.markups = t;
+    const e = /* @__PURE__ */ new Map();
+    this.descriptors = t.map((n, r) => {
+      if (n === void 0)
         return null;
-      const o = xe(s, r);
+      const o = Mt(n, r);
       return o.segments.forEach((i, a) => {
-        this.processSegment(o, i, a, n);
+        this.processSegment(o, i, a, e);
       }), this.addToFirstSegmentIndexMap(o), o;
-    }).filter((s) => s !== null);
+    }).filter((n) => n !== null);
   }
   /**
    * Adds a descriptor to the firstSegmentIndexMap using its first segment's global index
    */
-  addToFirstSegmentIndexMap(e) {
-    const n = e.segmentGlobalIndices[0];
-    if (n === void 0) return;
-    const s = this.firstSegmentIndexMap.get(n);
-    s ? s.push(e) : this.firstSegmentIndexMap.set(n, [e]);
-  }
-  processSegment(e, n, s, r) {
-    const o = this.getSegmentKey(n);
+  addToFirstSegmentIndexMap(t) {
+    const e = t.segmentGlobalIndices[0];
+    if (e === void 0) return;
+    const n = this.firstSegmentIndexMap.get(e);
+    n ? n.push(t) : this.firstSegmentIndexMap.set(e, [t]);
+  }
+  processSegment(t, e, n, r) {
+    const o = this.getSegmentKey(e);
     if (!o) return;
-    this.registerSegment(n, o, r);
+    this.registerSegment(e, o, r);
     const i = r.get(o);
-    if (e.segmentGlobalIndices[s] = i, typeof n != "string") {
-      const [a, c] = n;
+    if (t.segmentGlobalIndices[n] = i, typeof e != "string") {
+      const [a, c] = e;
       a && this.registerSegment(a, a, r), c && this.registerSegment(c, c, r);
     }
   }
-  registerSegment(e, n, s) {
-    if (!s.has(n)) {
+  registerSegment(t, e, n) {
+    if (!n.has(e)) {
       const r = this.segments.length;
-      this.segments.push(e), s.set(n, r);
+      this.segments.push(t), n.set(e, r);
     }
   }
   /**
@@ -164,27 +153,27 @@ class Ce {
    * For dynamic segments (arrays), returns before|after|exclusions if before or after is non-empty
    * Returns empty string for segments that should be ignored
    */
-  getSegmentKey(e) {
-    if (typeof e == "string")
-      return e;
-    const [n, s, r] = e;
-    return n || s ? `${n}|${s}|${r}` : "";
+  getSegmentKey(t) {
+    if (typeof t == "string")
+      return t;
+    const [e, n, r] = t;
+    return e || n ? `${e}|${n}|${r}` : "";
   }
 }
-function K(t, e) {
-  if (!e)
-    return t;
-  let n = 5381;
-  for (let s = 0; s < e.length; s++)
-    n = n * 33 ^ e.charCodeAt(s);
-  return n = n >>> 0, t * 1e6 + (n & 1048575);
-}
-class we {
-  constructor(e, n) {
-    if (this.descriptor = e, this.expectedSegmentIndex = 1, this.start = n.start, this.end = n.end, e.segments.length === 1 && (this.expectedSegmentIndex = NaN, this.gaps.value = { start: this.start, end: this.end }), e.hasTwoValues && n.captured) {
-      this.captured = n.captured;
-      const s = n.start + n.value.indexOf(n.captured), r = s + n.captured.length;
-      this.gaps.value = { start: s, end: r };
+function lt(s, t) {
+  if (!t)
+    return s;
+  let e = 5381;
+  for (let n = 0; n < t.length; n++)
+    e = e * 33 ^ t.charCodeAt(n);
+  return e = e >>> 0, s * 1e6 + (e & 1048575);
+}
+class _t {
+  constructor(t, e) {
+    if (this.descriptor = t, this.expectedSegmentIndex = 1, this.start = e.start, this.end = e.end, t.segments.length === 1 && (this.expectedSegmentIndex = NaN, this.gaps.value = { start: this.start, end: this.end }), t.hasTwoValues && e.captured) {
+      this.captured = e.captured;
+      const n = e.start + e.value.indexOf(e.captured), r = n + e.captured.length;
+      this.gaps.value = { start: n, end: r };
     }
   }
   gaps = {};
@@ -223,44 +212,44 @@ class we {
   get nextSegment() {
     if (this.isCompleted || this.isInvalid)
       return;
-    const e = this.descriptor.segmentGlobalIndices[this.expectedSegmentIndex], n = this.descriptor.segments[this.expectedSegmentIndex];
-    if (typeof n == "object" && this.descriptor.hasTwoValues && this.captured && this.isAwaitingLastSegment) {
-      const [s, r] = n, o = s + this.captured + r;
-      return K(e, o);
+    const t = this.descriptor.segmentGlobalIndices[this.expectedSegmentIndex], e = this.descriptor.segments[this.expectedSegmentIndex];
+    if (typeof e == "object" && this.descriptor.hasTwoValues && this.captured && this.isAwaitingLastSegment) {
+      const [n, r] = e, o = n + this.captured + r;
+      return lt(t, o);
     }
-    return e;
+    return t;
   }
   /**
    * Update state with new segment by setting gap positions
    */
-  processNext(e) {
-    const n = this.end, s = e.start, r = this.descriptor.gapTypes[this.expectedSegmentIndex - 1];
-    if (s < n) {
+  processNext(t) {
+    const e = this.end, n = t.start, r = this.descriptor.gapTypes[this.expectedSegmentIndex - 1];
+    if (n < e) {
       this.expectedSegmentIndex = -1;
       return;
     }
-    this.gaps[r] = { start: n, end: s }, this.end = e.end, this.expectedSegmentIndex++, this.expectedSegmentIndex >= this.descriptor.segments.length && (this.expectedSegmentIndex = NaN);
+    this.gaps[r] = { start: e, end: n }, this.end = t.end, this.expectedSegmentIndex++, this.expectedSegmentIndex >= this.descriptor.segments.length && (this.expectedSegmentIndex = NaN);
   }
   /**
    * Checks if this match conflicts with another match (overlaps and cannot nest properly)
    */
-  conflictsWith(e) {
-    return !e || this.start >= e.end ? !1 : !e.descriptor.hasNested || e.gaps.nested === void 0 ? !0 : !(this.start >= e.gaps.nested.start && this.end <= e.gaps.nested.end);
+  conflictsWith(t) {
+    return !t || this.start >= t.end ? !1 : !t.descriptor.hasNested || t.gaps.nested === void 0 ? !0 : !(this.start >= t.gaps.nested.start && this.end <= t.gaps.nested.end);
   }
 }
-class Te {
-  constructor(e) {
-    this.registry = e;
+class Rt {
+  constructor(t) {
+    this.registry = t;
   }
   pendingStates = /* @__PURE__ */ new Map();
   completingStates = /* @__PURE__ */ new Map();
   completedStates = [];
   /** Main method that converts found segments into structured matches */
-  process(e) {
+  process(t) {
     this.pendingStates.clear(), this.completingStates.clear(), this.completedStates.length = 0;
-    for (const n of e)
-      this.processWaitingStates(n), this.tryStartNewStates(n);
-    return this.completedStates.map((n) => n.match);
+    for (const e of t)
+      this.processWaitingStates(e), this.tryStartNewStates(e);
+    return this.completedStates.map((e) => e.match);
   }
   /**
    * Process states waiting for this segment
@@ -268,19 +257,19 @@ class Te {
    * Process completing states first (higher priority), then pending states
    * Process only one state per call
    */
-  processWaitingStates(e) {
-    const n = this.dequeueWaitingMatch(e);
-    if (n && (n.processNext(e), !n.isInvalid)) {
-      if (n.isCompleted) return this.addToCompleted(n);
-      this.addToWaiting(n);
+  processWaitingStates(t) {
+    const e = this.dequeueWaitingMatch(t);
+    if (e && (e.processNext(t), !e.isInvalid)) {
+      if (e.isCompleted) return this.addToCompleted(e);
+      this.addToWaiting(e);
     }
   }
-  tryStartNewStates(e) {
-    this.registry.firstSegmentIndexMap.get(e.index)?.forEach((n) => {
-      const s = new we(n, e);
-      if (!s.isInvalid) {
-        if (s.isCompleted) return this.addToCompleted(s);
-        this.addToWaiting(s);
+  tryStartNewStates(t) {
+    this.registry.firstSegmentIndexMap.get(t.index)?.forEach((e) => {
+      const n = new _t(e, t);
+      if (!n.isInvalid) {
+        if (n.isCompleted) return this.addToCompleted(n);
+        this.addToWaiting(n);
       }
     });
   }
@@ -288,23 +277,23 @@ class Te {
    * Gets the next waiting match for the given segment
    * Uses value-specific index for dynamic segments, base index for static segments
    */
-  dequeueWaitingMatch(e) {
-    const n = e.captured ? K(e.index, e.value) : e.index, s = this.completingStates.get(n);
-    if (s?.length) return s.pop();
-    const r = this.pendingStates.get(n);
+  dequeueWaitingMatch(t) {
+    const e = t.captured ? lt(t.index, t.value) : t.index, n = this.completingStates.get(e);
+    if (n?.length) return n.pop();
+    const r = this.pendingStates.get(e);
     if (r?.length) return r.pop();
   }
   /**
    * Adds a state to the waiting list for the next expected segment
    */
-  addToWaiting(e) {
-    const n = e.nextSegment;
-    if (e.isAwaitingLastSegment) {
-      const s = this.completingStates.get(n) || [];
-      s.length === 0 && this.completingStates.set(n, s), s.push(e);
+  addToWaiting(t) {
+    const e = t.nextSegment;
+    if (t.isAwaitingLastSegment) {
+      const n = this.completingStates.get(e) || [];
+      n.length === 0 && this.completingStates.set(e, n), n.push(t);
     } else {
-      const s = this.pendingStates.get(n) || [];
-      s.length === 0 && this.pendingStates.set(n, s), s.push(e);
+      const n = this.pendingStates.get(e) || [];
+      n.length === 0 && this.pendingStates.set(e, n), n.push(t);
     }
   }
   /**
@@ -312,49 +301,49 @@ class Te {
    * Uses binary search to find insertion point and maintains sorted order
    * Relies on processing order to determine which match to keep
    */
-  addToCompleted(e) {
-    const n = e.start;
-    let s = 0, r = this.completedStates.length;
-    for (; s < r; ) {
-      const o = Math.floor((s + r) / 2);
-      this.completedStates[o].position < n ? s = o + 1 : r = o;
+  addToCompleted(t) {
+    const e = t.start;
+    let n = 0, r = this.completedStates.length;
+    for (; n < r; ) {
+      const o = Math.floor((n + r) / 2);
+      this.completedStates[o].position < e ? n = o + 1 : r = o;
     }
-    s < this.completedStates.length && this.completedStates[s].position === n ? this.completedStates[s].match = e : this.completedStates.splice(s, 0, { position: n, match: e });
+    n < this.completedStates.length && this.completedStates[n].position === e ? this.completedStates[n].match = t : this.completedStates.splice(n, 0, { position: e, match: t });
   }
 }
-const b = (t) => t.replace(/[.*+?^${}()|[\]\\\\]/g, "\\$&");
-function Ee(t, e, n) {
-  const s = b(t), r = b(e), o = b(e + n);
-  return `${s}([^${o}]+?)${r}`;
+const A = (s) => s.replace(/[.*+?^${}()|[\]\\\\]/g, "\\$&");
+function Vt(s, t, e) {
+  const n = A(s), r = A(t), o = A(t + e);
+  return `${n}([^${o}]+?)${r}`;
 }
-class be {
+class $t {
   staticRegex;
   staticToIndex;
   dynamicRegex;
   dynamicEntries;
   dynamicIndices;
-  constructor(e) {
-    this.initializeDual(e);
-  }
-  initializeDual(e) {
-    const n = [], s = [], r = /* @__PURE__ */ new Map();
-    if (e.forEach((o, i) => {
-      typeof o == "string" ? (n.push(o), r.set(o, i)) : s.push(o);
-    }), n.length > 0) {
-      const i = [...n].sort((a, c) => c.length - a.length).map(b);
+  constructor(t) {
+    this.initializeDual(t);
+  }
+  initializeDual(t) {
+    const e = [], n = [], r = /* @__PURE__ */ new Map();
+    if (t.forEach((o, i) => {
+      typeof o == "string" ? (e.push(o), r.set(o, i)) : n.push(o);
+    }), e.length > 0) {
+      const i = [...e].sort((a, c) => c.length - a.length).map(A);
       this.staticRegex = new RegExp(`(?:${i.join("|")})`, "gu"), this.staticToIndex = r;
     }
-    if (s.length > 0) {
+    if (n.length > 0) {
       const o = /* @__PURE__ */ new Set(), i = [];
-      s.forEach((a) => {
-        const c = e.indexOf(a);
+      n.forEach((a) => {
+        const c = t.indexOf(a);
         if (typeof a == "string")
-          i.push({ index: c, pattern: b(a), definition: a });
+          i.push({ index: c, pattern: A(a), definition: a });
         else {
-          const [l, h, u] = a;
+          const [l, d, g] = a;
           o.add(c);
-          const g = Ee(l, h, u).replace("(", `(?<content${c}>`);
-          i.push({ index: c, pattern: g, definition: a });
+          const h = Vt(l, d, g).replace("(", `(?<content${c}>`);
+          i.push({ index: c, pattern: h, definition: a });
         }
       }), i.sort((a, c) => {
         const l = typeof a.definition == "string" ? a.definition.length : a.pattern.length;
@@ -362,12 +351,12 @@ class be {
       }), this.dynamicEntries = i, this.dynamicIndices = o, this.dynamicRegex = new RegExp(i.map((a, c) => `(?<seg${c}>${a.pattern})`).join("|"), "gu");
     }
   }
-  search(e) {
-    const n = [], s = [];
+  search(t) {
+    const e = [], n = [];
     if (this.staticRegex && this.staticToIndex)
-      for (const o of e.matchAll(this.staticRegex)) {
+      for (const o of t.matchAll(this.staticRegex)) {
         const i = this.staticToIndex.get(o[0]);
-        i !== void 0 && n.push({
+        i !== void 0 && e.push({
           index: i,
           start: o.index,
           end: o.index + o[0].length,
@@ -375,17 +364,17 @@ class be {
         });
       }
     if (this.dynamicRegex && this.dynamicEntries && this.dynamicIndices)
-      for (const o of e.matchAll(this.dynamicRegex)) {
+      for (const o of t.matchAll(this.dynamicRegex)) {
         const i = o[0], a = o.index;
         let c, l;
         if (o.groups) {
-          for (let h = 0; h < this.dynamicEntries.length; h++)
-            if (o.groups[`seg${h}`] !== void 0) {
-              c = this.dynamicEntries[h].index, this.dynamicIndices.has(c) && (l = o.groups[`content${c}`]);
+          for (let d = 0; d < this.dynamicEntries.length; d++)
+            if (o.groups[`seg${d}`] !== void 0) {
+              c = this.dynamicEntries[d].index, this.dynamicIndices.has(c) && (l = o.groups[`content${c}`]);
               break;
             }
         }
-        c !== void 0 && s.push({
+        c !== void 0 && n.push({
           index: c,
           start: a,
           end: a + i.length,
@@ -393,20 +382,20 @@ class be {
           captured: l
         });
       }
-    const r = [...s];
-    for (const o of n)
-      s.some(
+    const r = [...n];
+    for (const o of e)
+      n.some(
         (a) => o.start < a.end && o.end > a.start
       ) || r.push(o);
     return r.sort((o, i) => o.start - i.start), r;
   }
 }
-const Y = (t, e = 0, n = t.length) => ({
+const dt = (s, t = 0, e = s.length) => ({
   type: "text",
-  content: t.substring(e, n),
-  position: { start: e, end: n }
+  content: s.substring(t, e),
+  position: { start: t, end: e }
 });
-class Ie {
+class Ht {
   // Instance fields - only what's needed for single pass
   input;
   // ===== PUBLIC API =====
@@ -426,8 +415,8 @@ class Ie {
    * Complexity: O(M) where M is number of matches
    * Memory: O(D) for active parents stack where D is nesting depth
    */
-  build(e, n) {
-    return this.input = n, e.length === 0 ? [this.createTextToken(0, n.length)] : this.buildSinglePass(e);
+  build(t, e) {
+    return this.input = e, t.length === 0 ? [this.createTextToken(0, e.length)] : this.buildSinglePass(t);
   }
   // ===== SINGLE-PASS ALGORITHM =====
   /**
@@ -436,66 +425,66 @@ class Ie {
    * This is the core algorithm that processes matches sequentially,
    * maintaining a stack of active parents and creating tokens directly.
    */
-  buildSinglePass(e) {
-    const n = [], s = [];
+  buildSinglePass(t) {
+    const e = [], n = [];
     let r = null, o = 0;
-    for (const i of e) {
+    for (const i of t) {
       if (r && i.conflictsWith(r))
         continue;
-      for (r = i; s.length > 0; ) {
-        const l = s[s.length - 1], h = this.getContentBounds(l.match);
-        if (h.end <= i.start)
-          this.finalizeParent(l, h.end), s.pop(), s.length > 0 ? s[s.length - 1].token.children.push(l.token) : n.push(l.token);
+      for (r = i; n.length > 0; ) {
+        const l = n[n.length - 1], d = this.getContentBounds(l.match);
+        if (d.end <= i.start)
+          this.finalizeParent(l, d.end), n.pop(), n.length > 0 ? n[n.length - 1].token.children.push(l.token) : e.push(l.token);
         else
           break;
       }
-      const a = s.length > 0 ? s[s.length - 1] : null;
+      const a = n.length > 0 ? n[n.length - 1] : null;
       if (a) {
         const l = this.createTextToken(a.textPos, i.start);
         a.token.children.push(l), a.textPos = i.end;
       } else {
         const l = this.createTextToken(o, i.start);
-        n.push(l), o = i.end;
+        e.push(l), o = i.end;
       }
       const c = this.createMarkToken(i);
       if (this.hasNestedContent(i)) {
         const l = this.getContentBounds(i);
-        s.push({
+        n.push({
           match: i,
           token: c,
           textPos: l.start
         });
       } else
-        a ? a.token.children.push(c) : n.push(c);
+        a ? a.token.children.push(c) : e.push(c);
     }
-    for (; s.length > 0; ) {
-      const i = s.pop(), a = this.getContentBounds(i.match);
-      this.finalizeParent(i, a.end), s.length > 0 ? s[s.length - 1].token.children.push(i.token) : n.push(i.token);
+    for (; n.length > 0; ) {
+      const i = n.pop(), a = this.getContentBounds(i.match);
+      this.finalizeParent(i, a.end), n.length > 0 ? n[n.length - 1].token.children.push(i.token) : e.push(i.token);
     }
-    return n.push(this.createTextToken(o, this.input.length)), n;
+    return e.push(this.createTextToken(o, this.input.length)), e;
   }
   /**
    * Finalizes a parent token by adding final text token if needed
    */
-  finalizeParent(e, n) {
-    const s = this.createTextToken(e.textPos, n);
-    e.token.children.push(s), e.token.children.some((o) => o.type === "mark") || (e.token.children = []);
+  finalizeParent(t, e) {
+    const n = this.createTextToken(t.textPos, e);
+    t.token.children.push(n), t.token.children.some((o) => o.type === "mark") || (t.token.children = []);
   }
   /**
    * Creates a mark token from a match (without children - those are added later)
    */
-  createMarkToken(e) {
-    const n = this.extractSubstring(e.gaps.value?.start, e.gaps.value?.end), s = this.extractSubstring(e.gaps.nested?.start, e.gaps.nested?.end), r = this.extractSubstring(e.gaps.meta?.start, e.gaps.meta?.end), o = s || void 0, i = e.gaps.meta !== void 0 ? r : void 0, a = n || o || "";
+  createMarkToken(t) {
+    const e = this.extractSubstring(t.gaps.value?.start, t.gaps.value?.end), n = this.extractSubstring(t.gaps.nested?.start, t.gaps.nested?.end), r = this.extractSubstring(t.gaps.meta?.start, t.gaps.meta?.end), o = n || void 0, i = t.gaps.meta !== void 0 ? r : void 0, a = e || o || "";
     return {
       type: "mark",
-      content: this.input.substring(e.start, e.end),
+      content: this.input.substring(t.start, t.end),
       children: [],
       // Will be populated if match has nested content
-      descriptor: e.descriptor,
+      descriptor: t.descriptor,
       value: a,
       meta: i,
-      position: { start: e.start, end: e.end },
-      nested: this.createNestedInfo(e, o)
+      position: { start: t.start, end: t.end },
+      nested: this.createNestedInfo(t, o)
     };
   }
   // ===== UTILITY METHODS =====
@@ -503,78 +492,78 @@ class Ie {
    * Gets the content boundaries for a match
    * Priority: nested content if present, otherwise value content
    */
-  getContentBounds(e) {
-    return e.gaps.nested ? e.gaps.nested : e.gaps.value ? e.gaps.value : {
-      start: e.start,
-      end: e.start
+  getContentBounds(t) {
+    return t.gaps.nested ? t.gaps.nested : t.gaps.value ? t.gaps.value : {
+      start: t.start,
+      end: t.start
     };
   }
   /**
    * Checks if a match has nested content capability
    */
-  hasNestedContent(e) {
-    return e.gaps.nested !== void 0;
+  hasNestedContent(t) {
+    return t.gaps.nested !== void 0;
   }
   /**
    * Extracts substring safely, returns empty string if positions are undefined
    */
-  extractSubstring(e, n) {
-    return e !== void 0 && n !== void 0 ? this.input.substring(e, n) : "";
+  extractSubstring(t, e) {
+    return t !== void 0 && e !== void 0 ? this.input.substring(t, e) : "";
   }
   /**
    * Creates a text token for a range in the input
    */
-  createTextToken(e, n) {
-    return Y(this.input, e, n);
+  createTextToken(t, e) {
+    return dt(this.input, t, e);
   }
   /**
    * Creates nested info object if nested content exists
    */
-  createNestedInfo(e, n) {
-    if (!(!n || e.gaps.nested === void 0))
+  createNestedInfo(t, e) {
+    if (!(!e || t.gaps.nested === void 0))
       return {
-        content: n,
-        start: e.gaps.nested.start,
-        end: e.gaps.nested.end
+        content: e,
+        start: t.gaps.nested.start,
+        end: t.gaps.nested.end
       };
   }
 }
-function $(t, e) {
-  let n = t;
-  return e.value !== void 0 && (n = n.replaceAll(y.Value, e.value)), e.meta !== void 0 && (n = n.replaceAll(y.Meta, e.meta)), e.nested !== void 0 && (n = n.replaceAll(y.Nested, e.nested)), n;
+function j(s, t) {
+  let e = s;
+  return t.value !== void 0 && (e = e.replaceAll(y.Value, t.value)), t.meta !== void 0 && (e = e.replaceAll(y.Meta, t.meta)), t.nested !== void 0 && (e = e.replaceAll(y.Nested, t.nested)), e;
 }
-function T(t) {
-  let e = "";
-  for (const n of t) {
-    if (n.type === "text") {
-      e += n.content;
+function I(s) {
+  let t = "";
+  for (const e of s) {
+    if (e.type === "text") {
+      t += e.content;
       continue;
     }
-    const s = n.descriptor.markup, r = s.includes(y.Nested) ? n.children.length > 0 ? T(n.children) : n.nested?.content : void 0;
-    e += $(s, {
-      value: n.value,
-      meta: n.meta,
+    const n = e.descriptor.markup, r = n.includes(y.Nested) ? e.children.length > 0 ? I(e.children) : e.nested?.content : void 0;
+    t += j(n, {
+      value: e.value,
+      meta: e.meta,
       nested: r
     });
   }
-  return e;
+  return t;
 }
-function G(t, e) {
-  let n = "";
-  for (const s of t)
-    if (s.type === "text")
-      n += s.content;
-    else if (s.children.length > 0) {
-      const r = G(s.children, e), o = {
-        ...s,
+function J(s, t) {
+  let e = "";
+  for (const n of s)
+    if (n.type === "text")
+      e += n.content;
+    else if (n.children.length > 0) {
+      const r = J(n.children, t), o = {
+        ...n,
         value: r
       };
-      n += e(o);
+      e += t(o);
     } else
-      n += e(s);
-  return n;
+      e += t(n);
+  return e;
 }
-class O {
+class B {
   registry;
   segmentMatcher;
   patternMatcher;
@@ -598,8 +587,8 @@ class O {
    * ])
    * ```
    */
-  constructor(e) {
-    this.registry = new Ce(e), this.segmentMatcher = new be(this.registry.segments), this.patternMatcher = new Te(this.registry), this.treeBuilder = new Ie();
+  constructor(t) {
+    this.registry = new Dt(t), this.segmentMatcher = new $t(this.registry.segments), this.patternMatcher = new Rt(this.registry), this.treeBuilder = new Ht();
   }
   /**
    * Parses text into tokens (static convenience method)
@@ -615,9 +604,9 @@ class O {
    * })
    * ```
    */
-  static parse(e, n) {
-    const s = n?.markup;
-    return !s || s.length === 0 ? [Y(e)] : new O(s).parse(e);
+  static parse(t, e) {
+    const n = e?.markup;
+    return !n || n.length === 0 ? [dt(t)] : new B(n).parse(t);
   }
   /**
    * Converts tokens back to text (static convenience method)
@@ -630,8 +619,8 @@ class O {
    * const text = Parser.stringify(tokens)
    * ```
    */
-  static stringify(e) {
-    return T(e);
+  static stringify(t) {
+    return I(t);
   }
   /**
    * Parses text into a nested token tree
@@ -656,9 +645,9 @@ class O {
    * // ]
    * ```
    */
-  parse(e) {
-    const n = this.segmentMatcher.search(e), s = this.patternMatcher.process(n);
-    return this.treeBuilder.build(s, e);
+  parse(t) {
+    const e = this.segmentMatcher.search(t), n = this.patternMatcher.process(e);
+    return this.treeBuilder.build(n, t);
   }
   /**
    * Converts tokens back to the original text
@@ -677,8 +666,8 @@ class O {
    * console.log(reconstructed === text) // true
    * ```
    */
-  stringify(e) {
-    return T(e);
+  stringify(t) {
+    return I(t);
   }
   /**
    * Transforms annotated text by processing all mark tokens with a callback
@@ -705,9 +694,9 @@ class O {
    * // Returns: 'Hello:world and tag'
    * ```
    */
-  transform(e, n) {
-    const s = this.parse(e);
-    return G(s, n);
+  transform(t, e) {
+    const n = this.parse(t);
+    return J(n, e);
   }
   /**
    * Escapes markup segments in the given text using backslash
@@ -726,8 +715,8 @@ class O {
    * // Returns: 'Hello \*\*world\*\* and \@[user]'
    * ```
    */
-  escape(e) {
-    return this.registry.segments.filter((n) => typeof n == "string").sort((n, s) => s.length - n.length).reduce((n, s) => n.replaceAll(s, s.replace(/(.)/g, "\\$1")), e);
+  escape(t) {
+    return this.registry.segments.filter((e) => typeof e == "string").sort((e, n) => n.length - e.length).reduce((e, n) => e.replaceAll(n, n.replace(/(.)/g, "\\$1")), t);
   }
   /**
    * Unescapes markup patterns in the given text
@@ -745,101 +734,184 @@ class O {
    * // Returns: 'Hello **world** and @[user]'
    * ```
    */
-  unescape(e) {
-    return e.replaceAll(/\\(.)/g, "$1");
+  unescape(t) {
+    return t.replaceAll(/\\(.)/g, "$1");
   }
 }
-function kt(t, e, n) {
-  if (!n.length) return t;
-  const s = new O(n).parse(t);
-  return G(s, e);
+function Be(s, t, e) {
+  if (!e.length) return s;
+  const n = new B(e).parse(s);
+  return J(n, t);
 }
-function Me(t = "", e = "") {
-  if (t === e) return {};
-  let n;
-  for (let r = 0; r < t.length; r++)
-    if (t[r] !== e[r]) {
-      n = r;
+function z(s, t, e = 0, n) {
+  for (const r of s) {
+    if (r === t) return { depth: e, parent: n };
+    if (r.type === "mark") {
+      const o = z(r.children, t, e + 1, r);
+      if (o) return o;
+    }
+  }
+}
+function Bt(s = "", t = "") {
+  if (s === t) return {};
+  let e;
+  for (let r = 0; r < s.length; r++)
+    if (s[r] !== t[r]) {
+      e = r;
       break;
     }
-  let s;
-  for (let r = 1; r <= t.length; r++)
-    if (t.at(-r) !== e.at(-r)) {
-      s = t.length - r + 1;
+  let n;
+  for (let r = 1; r <= s.length; r++)
+    if (s.at(-r) !== t.at(-r)) {
+      n = s.length - r + 1;
       break;
     }
-  return { left: n, right: s };
+  return { left: e, right: n };
 }
-function q(t, e) {
-  let n = -1, s = t.length;
-  for (; s - n > 1; ) {
-    const r = Math.round((n + s) / 2);
-    t[r] <= e ? n = r : s = r;
+function st(s, t) {
+  let e = -1, n = s.length;
+  for (; n - e > 1; ) {
+    const r = Math.round((e + n) / 2);
+    s[r] <= t ? e = r : n = r;
   }
-  return t[n] == e && (s = n), [n, s].filter((r) => t[r] !== void 0);
+  return s[e] == t && (n = e), [e, n].filter((r) => s[r] !== void 0);
 }
-function Pe(t, e) {
-  if (Object.is(t, e))
-    return !0;
-  if (typeof t != "object" || t === null || typeof e != "object" || e === null)
-    return !1;
-  const n = Object.keys(t);
-  if (n.length !== Object.keys(e).length)
-    return !1;
-  for (let s = 0; s < n.length; s++)
-    if (!Object.prototype.hasOwnProperty.call(e, n[s]) || !Object.is(t[n[s]], e[n[s]]))
-      return !1;
-  return !0;
+function Ft(s) {
+  const { focus: t } = s.nodes, e = s.state.parser.get(), n = s.state.tokens.get();
+  if (!e)
+    return n;
+  const r = e.parse(t.content);
+  return r.length === 1 ? n : n.toSpliced(t.index, 1, ...r);
 }
-function Ne(t, e, n, s) {
-  return t.slice(0, n) + e + t.slice(n + s.length);
+function Wt(s) {
+  const t = s.state.value.get(), e = Gt(s), n = Bt(s.state.previousValue.get(), t);
+  if (!n.left && !n.right)
+    return s.state.previousValue.set(t), s.state.tokens.get();
+  s.state.previousValue.set(t);
+  const r = s.state.tokens.get();
+  switch (!0) {
+    case (n.left !== void 0 && e.includes(n.left) && n.right !== void 0 && Math.abs(n.left - n.right) > 1): {
+      const o = e.indexOf(n.left), i = G(s, o - 1, o);
+      return r.toSpliced(o - 1, 2, ...i);
+    }
+    case n.left !== void 0: {
+      const [o] = st(e, n.left), i = G(s, o);
+      return i.length === 1 ? r : r.toSpliced(o, 1, ...i);
+    }
+    case n.right !== void 0: {
+      const [o] = st(e, n.right), i = G(s, o);
+      return i.length === 1 ? r : r.toSpliced(o, 1, ...i);
+    }
+    default:
+      return _(s, t ?? "");
+  }
 }
-function _(t, e) {
-  const s = {
-    prev: 2,
-    self: 1,
-    next: 0
-  }[t], { focus: r } = e.nodes, [o, , i] = e.tokens.splice(r.index - s, 3), a = (o.type === "text", o.content), c = (i.type === "text", i.content);
-  e.tokens = e.tokens.toSpliced(r.index - s, 0, {
-    type: "text",
-    content: a + c,
-    position: {
-      start: o.position.start,
-      end: i.position.end
+function G(s, ...t) {
+  let e = "";
+  const n = s.state.tokens.get();
+  for (const r of t) {
+    const o = n[r];
+    e += o.content;
+  }
+  return _(s, e);
+}
+function Gt(s) {
+  let t = 0;
+  return s.state.tokens.get().map((n) => {
+    const r = n.content.length;
+    return t += r, t - r;
+  }) ?? [];
+}
+function _(s, t) {
+  const e = s.state.parser.get();
+  return e ? e.parse(t) : [
+    {
+      type: "text",
+      content: t,
+      position: { start: 0, end: t.length }
+    }
+  ];
+}
+const Ut = (s, t) => s === t;
+class R {
+  #t;
+  #e = /* @__PURE__ */ new Set();
+  #n;
+  constructor(t, e) {
+    this.#t = t, this.#n = e?.equals ?? Ut;
+  }
+  static event() {
+    return new R(void 0, { equals: !1 });
+  }
+  get value() {
+    return this.#t;
+  }
+  set value(t) {
+    (this.#n === !1 || !this.#n(this.#t, t)) && (this.#t = t, this.#e.forEach((e) => e(t)));
+  }
+  on(t) {
+    return this.#e.add(t), () => this.#e.delete(t);
+  }
+  emit(t) {
+    arguments.length > 0 && (this.#t = t), this.#e.forEach((e) => e(this.#t));
+  }
+  get() {
+    return this.#t;
+  }
+  set(t) {
+    this.value = t;
+  }
+}
+function jt(s, t) {
+  const e = {};
+  return e.get = () => s.get(), e.set = (n) => s.set(n), e.on = (n) => s.on(n), e.use = t(e), e;
+}
+function zt(s, t) {
+  const e = /* @__PURE__ */ new Map();
+  for (const n in s)
+    e.set(n, new R(s[n]));
+  return new Proxy(s, {
+    get(n, r) {
+      if (r === "set")
+        return (i) => {
+          for (const a in i)
+            e.get(a)?.set(i[a]);
+        };
+      const o = e.get(r);
+      if (o)
+        return jt(o, t);
     }
   });
-  let l = r;
-  for (let u = 0; u < s; u++)
-    l = l.prev;
-  const h = l.length;
-  e.recovery = { anchor: l.prev, caret: h }, e.props.onChange?.(T(e.tokens));
-}
-class Ae {
-  #t = /* @__PURE__ */ new Map();
-  send(e, n) {
-    this.#e(e).forEach((s) => s(n));
-  }
-  on(e, n) {
-    return this.#e(e).add(n), () => this.#e(e).delete(n);
-  }
-  #e(e) {
-    return this.#t.has(e) || this.#t.set(e, /* @__PURE__ */ new Set()), this.#t.get(e);
-  }
-}
-const p = {
-  STORE_UPDATED: Symbol(),
-  ClearTrigger: Symbol(),
-  CheckTrigger: Symbol(),
-  Change: Symbol(),
-  Parse: Symbol(),
-  Delete: Symbol(),
-  Select: Symbol()
-};
-class S {
+}
+function qt(s) {
+  const t = function(e) {
+    s.emit(e);
+  };
+  return t.on = (e) => s.on(e), t;
+}
+function Xt(s) {
+  const t = [], e = /* @__PURE__ */ new Map();
+  for (const n of t)
+    e.set(n, R.event());
+  return new Proxy({}, {
+    get(n, r) {
+      let o = e.get(r);
+      return o || (o = R.event(), e.set(r, o)), qt(o);
+    }
+  });
+}
+class Zt {
+  #t = 1;
+  #e = /* @__PURE__ */ new WeakMap();
+  get(t) {
+    return this.#e.has(t) ? this.#e.get(t) : (this.#e.set(t, this.#t), this.#t++);
+  }
+}
+class w {
   static get isSelectedPosition() {
-    const e = window.getSelection();
-    if (e)
-      return e.isCollapsed;
+    const t = window.getSelection();
+    if (t)
+      return t.isCollapsed;
   }
   static getCurrentPosition() {
     return window.getSelection()?.anchorOffset ?? 0;
@@ -849,61 +921,61 @@ class S {
     return window.getSelection()?.anchorNode?.textContent ?? "";
   }
   static getSelectedNode() {
-    const e = window.getSelection()?.anchorNode;
-    if (e) return e;
+    const t = window.getSelection()?.anchorNode;
+    if (t) return t;
     throw new Error("Anchor node of selection is not exists!");
   }
   //TODO add the returned type: "{left: CSSProperties["left"], top: CSSProperties["top"]}"?
   static getAbsolutePosition() {
-    const e = window.getSelection()?.getRangeAt(0).getBoundingClientRect?.();
-    return e ? { left: e.left, top: e.top + e.height + 1 } : { left: 0, top: 0 };
+    const t = window.getSelection()?.getRangeAt(0).getBoundingClientRect?.();
+    return t ? { left: t.left, top: t.top + t.height + 1 } : { left: 0, top: 0 };
   }
-  static trySetIndex(e, n) {
+  static trySetIndex(t, e) {
     try {
-      this.setIndex(e, n);
-    } catch (s) {
-      console.error(s);
+      this.setIndex(t, e);
+    } catch (n) {
+      console.error(n);
     }
   }
-  static setIndex(e, n) {
-    const s = window.getSelection();
-    if (!s?.anchorNode || !s.rangeCount) return;
-    const r = s.getRangeAt(0);
-    r?.setStart(e.firstChild || e, n), r?.setEnd(e.firstChild || e, n);
+  static setIndex(t, e) {
+    const n = window.getSelection();
+    if (!n?.anchorNode || !n.rangeCount) return;
+    const r = n.getRangeAt(0);
+    r?.setStart(t.firstChild || t, e), r?.setEnd(t.firstChild || t, e);
   }
-  static getCaretIndex(e) {
-    let n = 0;
-    const s = window.getSelection();
-    if (!s?.rangeCount) return n;
-    const r = s.getRangeAt(0), o = r.cloneRange();
-    return o.selectNodeContents(e), o.setEnd(r.endContainer, r.endOffset), n = o.toString().length, n;
+  static getCaretIndex(t) {
+    let e = 0;
+    const n = window.getSelection();
+    if (!n?.rangeCount) return e;
+    const r = n.getRangeAt(0), o = r.cloneRange();
+    return o.selectNodeContents(t), o.setEnd(r.endContainer, r.endOffset), e = o.toString().length, e;
   }
-  static setCaretToEnd(e) {
-    if (!e) return;
-    window.getSelection()?.setPosition(e, 1);
+  static setCaretToEnd(t) {
+    if (!t) return;
+    window.getSelection()?.setPosition(t, 1);
   }
   static getIndex() {
     return window.getSelection()?.anchorOffset ?? NaN;
   }
-  static setIndex1(e) {
-    const n = window.getSelection();
-    if (!n?.anchorNode || !n.rangeCount) return;
-    const s = n.getRangeAt(0);
-    s?.setStart(s.startContainer.firstChild || s.startContainer, e), s?.setEnd(s.startContainer.firstChild || s.startContainer, e);
+  static setIndex1(t) {
+    const e = window.getSelection();
+    if (!e?.anchorNode || !e.rangeCount) return;
+    const n = e.getRangeAt(0);
+    n?.setStart(n.startContainer.firstChild || n.startContainer, t), n?.setEnd(n.startContainer.firstChild || n.startContainer, t);
   }
-  setCaretRightTo(e, n) {
+  setCaretRightTo(t, e) {
     const r = window.getSelection()?.getRangeAt(0);
-    r?.setStart(r.endContainer, n), r?.setEnd(r.endContainer, n);
+    r?.setStart(r.endContainer, e), r?.setEnd(r.endContainer, e);
   }
 }
-const Oe = new RegExp(/^\w*/);
-class U {
+const Jt = new RegExp(/^\w*/);
+class Q {
   span;
   node;
   dividedText;
   constructor() {
-    const e = S.getCurrentPosition();
-    this.node = S.getSelectedNode(), this.span = S.getFocusedSpan(), this.dividedText = this.getDividedTextBy(e);
+    const t = w.getCurrentPosition();
+    this.node = w.getSelectedNode(), this.span = w.getFocusedSpan(), this.dividedText = this.getDividedTextBy(t);
   }
   /**
    * Find overlay match in text using provided options and trigger extractor.
@@ -920,12 +992,12 @@ class U {
    * // Other framework usage
    * TriggerFinder.find(vueOptions, (opt) => opt.overlay?.trigger ?? '@')
    */
-  static find(e, n) {
-    if (e && S.isSelectedPosition)
-      return new U().find(e, n);
+  static find(t, e) {
+    if (t && w.isSelectedPosition)
+      return new Q().find(t, e);
   }
-  getDividedTextBy(e) {
-    return { left: this.span.slice(0, e), right: this.span.slice(e) };
+  getDividedTextBy(t) {
+    return { left: this.span.slice(0, t), right: this.span.slice(t) };
   }
   /**
    * Find overlay match in provided options.
@@ -933,9 +1005,9 @@ class U {
    * @param options - Array of options
    * @param getTrigger - Function to extract trigger from each option
    */
-  find(e, n) {
-    for (let s = 0; s < e.length; s++) {
-      const r = e[s], o = n(r, s);
+  find(t, e) {
+    for (let n = 0; n < t.length; n++) {
+      const r = t[n], o = e(r, n);
       if (!o) continue;
       const i = this.matchInTextVia(o);
       if (i)
@@ -949,45 +1021,45 @@ class U {
         };
     }
   }
-  matchInTextVia(e = "@") {
-    const n = this.matchRightPart(), s = this.matchLeftPart(e);
-    if (s)
+  matchInTextVia(t = "@") {
+    const e = this.matchRightPart(), n = this.matchLeftPart(t);
+    if (n)
       return {
-        word: s.word + n.word,
-        annotation: s.annotation + n.word,
-        index: s.index
+        word: n.word + e.word,
+        annotation: n.annotation + e.word,
+        index: n.index
       };
   }
   matchRightPart() {
-    const { right: e } = this.dividedText;
-    return { word: e.match(Oe)?.[0] };
+    const { right: t } = this.dividedText;
+    return { word: t.match(Jt)?.[0] };
   }
-  matchLeftPart(e) {
-    const n = this.makeTriggerRegex(e), { left: s } = this.dividedText, r = s.match(n);
+  matchLeftPart(t) {
+    const e = this.makeTriggerRegex(t), { left: n } = this.dividedText, r = n.match(e);
     if (!r) return;
     const [o, i] = r;
     return { word: i, annotation: o, index: r.index ?? 0 };
   }
   //TODO new overlayMatch option if (isSpaceBeforeRequired) append space check for not first words '\\s'
-  makeTriggerRegex(e) {
-    const n = b(e) + "(\\w*)$";
-    return new RegExp(n);
+  makeTriggerRegex(t) {
+    const e = A(t) + "(\\w*)$";
+    return new RegExp(e);
   }
 }
-class M {
+class V {
   #t;
   #e;
   get target() {
     return this.#t;
   }
-  set target(e) {
-    this.#t = e;
+  set target(t) {
+    this.#t = t;
   }
   get next() {
-    return new M(this.target?.nextSibling, this.#e);
+    return new V(this.target?.nextSibling, this.#e);
   }
   get prev() {
-    return new M(this.target?.previousSibling, this.#e);
+    return new V(this.target?.previousSibling, this.#e);
   }
   get isSpan() {
     return this.index % 2 === 0;
@@ -999,19 +1071,19 @@ class M {
     return this.target?.isContentEditable ?? !1;
   }
   get isCaretAtBeginning() {
-    return this.target ? S.getCaretIndex(this.target) === 0 : void 0;
+    return this.target ? w.getCaretIndex(this.target) === 0 : void 0;
   }
   get isCaretAtEnd() {
-    return this.target ? S.getCaretIndex(this.target) === this.target.textContent?.length : void 0;
+    return this.target ? w.getCaretIndex(this.target) === this.target.textContent?.length : void 0;
   }
   get index() {
     return this.target?.parentElement ? [...this.target.parentElement.children].indexOf(this.target) : -1;
   }
   get caret() {
-    return this.target ? S.getCaretIndex(this.target) : -1;
+    return this.target ? w.getCaretIndex(this.target) : -1;
   }
-  set caret(e) {
-    this.target && S.trySetIndex(this.target, e);
+  set caret(t) {
+    this.target && w.trySetIndex(this.target, t);
   }
   get length() {
     return this.target?.textContent?.length ?? -1;
@@ -1019,8 +1091,8 @@ class M {
   get content() {
     return this.target?.textContent ?? "";
   }
-  set content(e) {
-    this.target && (this.target.textContent = e ?? "");
+  set content(t) {
+    this.target && (this.target.textContent = t ?? "");
   }
   get head() {
     return this.#e.refs.container?.firstChild;
@@ -1031,11 +1103,11 @@ class M {
   get isFocused() {
     return this.target === document.activeElement;
   }
-  constructor(e, n) {
-    this.target = e, this.#e = n;
+  constructor(t, e) {
+    this.target = t, this.#e = e;
   }
   setCaretToEnd() {
-    S.setCaretToEnd(this.target);
+    w.setCaretToEnd(this.target);
   }
   focus() {
     this.target?.focus();
@@ -1044,712 +1116,1022 @@ class M {
     this.target = void 0;
   }
 }
-class Le {
-  #t = 1;
-  #e = /* @__PURE__ */ new WeakMap();
-  get(e) {
-    return this.#e.has(e) ? this.#e.get(e) : (this.#e.set(e, this.#t), this.#t++);
-  }
+function Qt(s, t, e, n) {
+  return s.slice(0, e) + t + s.slice(e + n.length);
 }
-class B {
-  // Utils domain
-  bus = new Ae();
-  key = new Le();
-  // Config domain
-  props;
-  // Document domain
-  tokens = [];
-  parser;
-  previousValue;
-  // Navigation domain
-  nodes = {
-    focus: new M(void 0, this),
-    input: new M(void 0, this)
-  };
-  recovery;
-  // UI domain
-  refs = {
-    container: null,
-    overlay: null,
-    setContainer: (e) => {
-      this.refs.container = e;
-    },
-    setOverlay: (e) => {
-      this.refs.overlay = e;
-    }
-  };
-  selecting;
-  // Overlay domain
-  overlayMatch;
-  constructor(e) {
-    this.props = e;
-  }
-  static create = (e) => new Proxy(new B(e), { set: De });
-}
-const _e = /* @__PURE__ */ new Set(["bus", "refs", "nodes", "key"]);
-function De(t, e, n, s) {
-  return _e.has(String(e)) ? !1 : (t[e] === n || (t[e] = n, t.bus.send(p.STORE_UPDATED, s)), !0);
-}
-const P = ce(void 0);
-P.displayName = "StoreContext";
-function v(t, e, n) {
-  typeof t == "string" ? $e(t, e, n) : Re(t, e, n);
-}
-function Re(t, e, n) {
-  const s = N(P);
-  Q(s), x(() => s.bus.on(t, e), n);
-}
-function $e(t, e, n) {
-  const s = N(P);
-  x(() => (s?.refs.container?.addEventListener(t, e), () => s?.refs.container?.removeEventListener(t, e)), n);
-}
-function f(t, e) {
-  const n = N(P);
-  Q(n);
-  const [s, r] = A(() => t?.(n));
-  return v(
-    p.STORE_UPDATED,
-    () => {
-      r((o) => {
-        const i = t?.(n);
-        return e && Pe(o, i) ? o : i;
-      });
-    },
-    []
-  ), t ? s : n;
-}
-const Ve = (t) => {
-  const e = ae.createContext(void 0);
-  e.displayName = t;
-  const n = o(e), s = e.Provider;
-  return [n, s, e];
-  function o(i) {
-    return () => {
-      const a = N(i);
-      if (a) return a;
-      throw new Error(`The context ${i.displayName} didn't found!`);
-    };
-  }
-}, [H, X] = Ve("NodeProvider");
-function ee(t, e, n, s) {
-  const r = f((c) => t === "mark" ? c.props.Mark : c.props.Overlay), o = t === "mark" ? e?.mark : e?.overlay;
-  let i;
-  o !== void 0 ? typeof o == "function" ? i = o(n) : i = o : i = n ?? {};
-  const a = i.slot || r || s;
-  if (!a)
-    throw new Error(
-      `No ${t} component found. Provide either option.${t}.slot, global ${t === "mark" ? "Mark" : "Overlay"}, or a defaultComponent.`
-    );
-  return [a, i];
-}
-function Fe() {
-  const t = H(), { options: e, key: n } = f((c) => ({ options: c.props.options, key: c.key }), !0), s = e?.[t.descriptor.index], r = t.children.map((c) => /* @__PURE__ */ m(z, { mark: c, isNested: !0 }, n.get(c))), o = {
-    value: t.value,
-    meta: t.meta,
-    nested: t.nested?.content,
-    children: t.children.length > 0 ? r : void 0
-  }, [i, a] = ee("mark", s, o);
-  return /* @__PURE__ */ m(i, { ...a });
-}
-const We = () => {
-  const t = H(), e = I(null), { readOnly: n, SpanComponent: s, spanProps: r } = f(
-    (o) => ({
-      readOnly: o.props.readOnly,
-      SpanComponent: Z("span", o),
-      spanProps: J("span", o)
-    }),
-    !0
-  );
-  if (t.type !== "text")
-    throw new Error("TextSpan component expects a TextToken");
-  return /* @__PURE__ */ m(
-    s,
-    {
-      ...r,
-      ref: e,
-      contentEditable: !n,
-      onPaste: Ge,
-      suppressContentEditableWarning: !0,
-      children: t.content
-    }
-  );
-};
-function Ge(t) {
-  t.preventDefault();
-  const e = t.clipboardData.getData("text");
-  document.execCommand("insertText", !1, e);
-}
-const z = W(({ mark: t, isNested: e = !1 }) => t.type === "mark" ? /* @__PURE__ */ m(X, { value: t, children: /* @__PURE__ */ m(Fe, {}) }) : e ? /* @__PURE__ */ m(oe, { children: t.content }) : /* @__PURE__ */ m(X, { value: t, children: /* @__PURE__ */ m(We, {}) }));
-z.displayName = "Token";
-const te = W(() => {
-  const { className: t, style: e, tokens: n, bus: s, key: r, ContainerComponent: o, containerProps: i, refs: a } = f(
-    (c) => ({
-      className: c.props.className,
-      style: c.props.style,
-      tokens: c.tokens,
-      bus: c.bus,
-      key: c.key,
-      refs: c.refs,
-      ContainerComponent: Z("container", c),
-      containerProps: J("container", c)
-    }),
-    !0
-  );
-  return v("input", () => s.send(p.Change), []), /* @__PURE__ */ m(o, { ref: a.setContainer, ...i, className: t, style: e, children: n.map((c) => /* @__PURE__ */ m(z, { mark: c }, r.get(c))) });
-});
-te.displayName = "Container";
-function Ue() {
-  const { match: t, bus: e } = f(
-    (n) => ({
-      match: n.overlayMatch,
-      bus: n.bus
-    }),
-    !0
-  );
-  x(() => {
-    if (!t) return;
-    const n = (s) => {
-      s.key === k.ESC && e.send(p.ClearTrigger);
-    };
-    return window.addEventListener("keydown", n), () => window.removeEventListener("keydown", n);
-  }, [t, e]);
-}
-function Be() {
-  const t = f(), e = f((n) => n.overlayMatch);
-  x(() => {
-    if (!e) return;
-    const n = (s) => {
-      const r = s.target;
-      t.refs.overlay?.contains(r) || t.refs.container?.contains(r) || t.bus.send(p.ClearTrigger);
-    };
-    return document.addEventListener("click", n), () => document.removeEventListener("click", n);
-  }, [e]);
-}
-function C(t, e, n = []) {
-  v(
-    "keydown",
-    (s) => {
-      s.key === t && e(s);
-    },
-    n
+function U(s, t) {
+  const n = {
+    prev: 2,
+    self: 1,
+    next: 0
+  }[s], { focus: r } = t.nodes, o = t.state.tokens.get(), [i, , a] = o.splice(r.index - n, 3), c = (i.type === "text", i.content), l = (a.type === "text", a.content);
+  t.state.tokens.set(
+    o.toSpliced(r.index - n, 0, {
+      type: "text",
+      content: c + l,
+      position: {
+        start: i.position.start,
+        end: a.position.end
+      }
+    })
   );
+  let d = r;
+  for (let u = 0; u < n; u++)
+    d = d.prev;
+  const g = d.length;
+  t.state.recovery.set({ anchor: d.prev, caret: g }), t.state.onChange.get()?.(I(t.state.tokens.get()));
 }
-function He() {
-  const t = f();
-  C(k.LEFT, e), C(k.RIGHT, n), C(k.DELETE, s), C(k.BACKSPACE, s), C(k.DELETE, o), C(k.BACKSPACE, r), v("keydown", i, []), v("paste", l, []), x(() => {
-    const u = t.refs.container;
-    if (!u) return;
-    const d = (g) => {
-      c(g);
-    };
-    return u.addEventListener("beforeinput", d, !0), () => u.removeEventListener("beforeinput", d, !0);
-  }, []);
-  function e(u) {
-    const { focus: d } = t.nodes;
-    if (d.isMark && !d.isEditable || d.isCaretAtBeginning) {
-      const g = d.prev;
-      g.focus(), g.isFocused || (g.prev.focus(), u.preventDefault()), d.setCaretToEnd();
-    }
+class Kt {
+  constructor(t) {
+    this.store = t;
   }
-  function n(u) {
-    const { focus: d } = t.nodes;
-    if (d.isMark && !d.isEditable || d.isCaretAtEnd) {
-      const g = d.next;
-      g.focus(), g.isFocused || (g.next.focus(), u.preventDefault());
-    }
-  }
-  function s() {
-    t.nodes.focus.isMark && _("self", t);
+  #t;
+  #e;
+  #n;
+  enable() {
+    this.#t || (this.#t = this.store.events.change.on(() => {
+      const t = this.store.state.onChange.get();
+      if (!this.store.nodes.focus.target) return;
+      const e = this.store.state.tokens.get(), n = e[this.store.nodes.focus.index];
+      n.type === "text" ? n.content = this.store.nodes.focus.content : n.type === "mark" && (n.value = this.store.nodes.focus.content), t?.(I(e)), this.store.events.parse();
+    }), this.#e = this.store.events.delete.on((t) => {
+      if (!t) return;
+      const { token: e } = t, n = this.store.state.onChange.get(), r = this.store.state.tokens.get(), o = r.indexOf(e);
+      this.store.state.tokens.set(r.toSpliced(o, 1)), n?.(I(this.store.state.tokens.get()));
+    }), this.#n = this.store.events.select.on((t) => {
+      if (!t) return;
+      const e = this.store.state.Mark.get(), n = this.store.state.onChange.get(), {
+        mark: r,
+        match: { option: o, span: i, index: a, source: c }
+      } = t, l = r.type === "mark" ? j(o.markup, {
+        value: r.value,
+        meta: r.meta
+      }) : j(o.markup, {
+        value: r.content
+      }), d = Qt(i, l, a, c);
+      if (this.store.state.recovery.set(
+        e ? {
+          caret: 0,
+          anchor: this.store.nodes.input.next,
+          isNext: !0,
+          childIndex: this.store.nodes.input.index
+        } : { caret: a + l.length, anchor: this.store.nodes.input }
+      ), this.store.nodes.input.target) {
+        this.store.nodes.input.content = d;
+        const g = this.store.state.tokens.get(), u = g[this.store.nodes.input.index];
+        u.type === "text" && (u.content = d), this.store.nodes.focus.target = this.store.nodes.input.target, this.store.nodes.input.clear(), n?.(I(g)), this.store.events.parse();
+      }
+    }));
   }
-  function r(u) {
-    t.nodes.focus.isSpan && t.nodes.focus.isCaretAtBeginning && t.nodes.focus.prev.target && (u.preventDefault(), _("prev", t));
+  disable() {
+    this.#t?.(), this.#e?.(), this.#n?.(), this.#t = void 0, this.#e = void 0, this.#n = void 0;
   }
-  function o(u) {
-    t.nodes.focus.isSpan && t.nodes.focus.isCaretAtEnd && t.nodes.focus.next.target && (u.preventDefault(), _("next", t));
+}
+class Yt {
+  constructor(t) {
+    this.store = t;
   }
-  function i(u) {
-    if ((u.ctrlKey || u.metaKey) && u.code === "KeyA") {
-      u.preventDefault();
-      const d = window.getSelection(), g = t.refs.container?.firstChild, E = t.refs.container?.lastChild;
-      if (!d || !g || !E) return;
-      d.setBaseAndExtent(g, 0, E, 1), t.selecting = "all";
-    }
+  #t;
+  #e;
+  #n;
+  #s;
+  #r;
+  #o;
+  #i;
+  #a;
+  enableTrigger(t, e) {
+    if (this.#t) return;
+    this.#t = this.store.events.clearOverlay.on(() => {
+      e(void 0);
+    }), this.#e = this.store.events.checkOverlay.on(() => {
+      const r = Q.find(this.store.state.options.get(), t);
+      e(r);
+    }), this.#n = this.store.events.change.on(() => {
+      const r = this.store.state.showOverlayOn.get(), o = "change";
+      (r === o || Array.isArray(r) && r.includes(o)) && this.store.events.checkOverlay();
+    }), this.#s = () => {
+      const r = this.store.state.showOverlayOn.get(), o = "selectionChange";
+      (r === o || Array.isArray(r) && r.includes(o)) && this.store.events.checkOverlay();
+    }, this.#r = () => {
+      document.addEventListener("selectionchange", this.#s);
+    }, this.#o = () => {
+      document.removeEventListener("selectionchange", this.#s);
+    };
+    const n = this.store.refs.container;
+    n && (n.addEventListener("focusin", this.#r), n.addEventListener("focusout", this.#o));
   }
-  function a() {
-    const u = window.getSelection(), d = t.refs.container;
-    if (!u?.rangeCount || !d?.firstChild || !d?.lastChild) return !1;
-    try {
-      const g = u.getRangeAt(0);
-      return d.contains(g.startContainer) && d.contains(g.endContainer) && g.toString().length > 0;
-    } catch {
-      return !1;
-    }
+  enableClose() {
+    this.#i || (this.#i = (t) => {
+      t.key === x.ESC && this.store.events.clearOverlay();
+    }, this.#a = (t) => {
+      const e = t.target;
+      this.store.refs.overlay?.contains(e) || this.store.refs.container?.contains(e) || this.store.events.clearOverlay();
+    }, window.addEventListener("keydown", this.#i), document.addEventListener("click", this.#a, !0));
   }
-  function c(u) {
-    if (t.selecting !== "all" || !a()) {
-      t.selecting === "all" && (t.selecting = void 0);
-      return;
-    }
-    if (u.inputType === "insertFromPaste") return;
-    u.preventDefault();
-    const d = u.inputType.startsWith("delete") ? "" : u.data ?? "";
-    h(d);
-  }
-  function l(u) {
-    if (t.selecting !== "all" || !a()) {
-      t.selecting === "all" && (t.selecting = void 0);
-      return;
-    }
-    u.preventDefault();
-    const d = u.clipboardData?.getData("text/plain") ?? "";
-    h(d);
+  disableClose() {
+    this.#i && (window.removeEventListener("keydown", this.#i), document.removeEventListener("click", this.#a, !0), this.#i = void 0, this.#a = void 0);
   }
-  function h(u) {
-    t.nodes.focus.target = null, t.selecting = void 0, t.props.onChange?.(u), t.props.value === void 0 && (t.tokens = t.parser?.parse(u) ?? [
-      {
-        type: "text",
-        content: u,
-        position: { start: 0, end: u.length }
-      }
-    ]), queueMicrotask(() => {
-      const d = t.refs.container?.firstChild;
-      d && (t.recovery = {
-        anchor: t.nodes.focus,
-        caret: u.length
-      }, d.focus());
-    });
+  disable() {
+    const t = this.store.refs.container;
+    t && this.#r && (t.removeEventListener("focusin", this.#r), t.removeEventListener("focusout", this.#o)), this.#s && document.removeEventListener("selectionchange", this.#s), this.disableClose(), this.#t?.(), this.#e?.(), this.#n?.(), this.#t = void 0, this.#e = void 0, this.#n = void 0, this.#s = void 0, this.#r = void 0, this.#o = void 0;
   }
 }
-function ze() {
-  const t = f();
-  v(
-    p.Change,
-    () => {
-      const { onChange: e } = t.props;
-      if (!t.nodes.focus.target) return;
-      const n = t.tokens[t.nodes.focus.index];
-      n.type === "text" ? n.content = t.nodes.focus.content : n.type === "mark" && (n.value = t.nodes.focus.content), e?.(T(t.tokens)), t.bus.send(p.Parse);
-    },
-    []
-  ), v(
-    p.Delete,
-    ({ token: e }) => {
-      const { onChange: n } = t.props;
-      t.tokens.splice(t.tokens.indexOf(e), 1), n?.(T(t.tokens));
-    },
-    []
-  ), v(
-    p.Select,
-    (e) => {
-      const { Mark: n, onChange: s } = t.props, {
-        mark: r,
-        match: { option: o, span: i, index: a, source: c }
-      } = e, l = r.type === "mark" ? $(o.markup, {
-        value: r.value,
-        meta: r.meta
-      }) : $(o.markup, {
-        value: r.content
-      }), h = Ne(i, l, a, c);
-      if (t.recovery = n ? { caret: 0, anchor: t.nodes.input.next, isNext: !0 } : { caret: a + l.length, anchor: t.nodes.input }, t.nodes.input.target) {
-        t.nodes.input.content = h;
-        const u = t.tokens[t.nodes.input.index];
-        u.type === "text" && (u.content = h), t.nodes.focus.target = t.nodes.input.target, t.nodes.input.clear(), s?.(T(t.tokens)), t.bus.send(p.Parse);
-      }
-    },
-    []
-  );
-}
-const je = () => {
-  const t = f();
-  v("focusin", (e) => t.nodes.focus.target = e.target, []), v("focusout", (e) => t.nodes.focus.target = void 0, []);
-}, qe = () => {
-  const t = f(), e = f((n) => n.tokens);
-  v(
-    "click",
-    () => {
-      e.length === 1 && e[0].type === "text" && e[0].content === "" && t.refs.container?.firstElementChild?.focus();
-    },
-    [e]
-  );
-}, Xe = () => {
-  const t = f(), e = f((s) => s.tokens), n = t.props.Mark ? [e] : void 0;
-  x(() => {
-    if (!t.recovery) return;
-    const { anchor: s, caret: r, isNext: o } = t.recovery;
+class te {
+  constructor(t) {
+    this.store = t;
+  }
+  #t;
+  #e;
+  #n;
+  enable() {
+    if (this.#t) return;
+    const t = this.store.refs.container;
+    t && (this.#t = (e) => {
+      this.store.nodes.focus.target = e.target;
+    }, this.#e = () => {
+      this.store.nodes.focus.target = void 0;
+    }, this.#n = () => {
+      const e = this.store.state.tokens.get();
+      e.length === 1 && e[0].type === "text" && e[0].content === "" && this.store.refs.container?.firstElementChild?.focus();
+    }, t.addEventListener("focusin", this.#t), t.addEventListener("focusout", this.#e), t.addEventListener("click", this.#n));
+  }
+  disable() {
+    const t = this.store.refs.container;
+    !t || !this.#t || (t.removeEventListener("focusin", this.#t), t.removeEventListener("focusout", this.#e), t.removeEventListener("click", this.#n), this.#t = void 0, this.#e = void 0, this.#n = void 0);
+  }
+  recover() {
+    const t = this.store.state.recovery.get();
+    if (!t) return;
+    const { anchor: e, caret: n, isNext: r } = t, o = !e.target || !e.target.isConnected;
     switch (!0) {
-      case (o && !s.target):
-        t.nodes.focus.tail.focus();
+      case (r && o): {
+        const i = this.store.refs.container, a = t.childIndex != null ? i?.children[t.childIndex + 2] : void 0;
+        a ? a.focus() : this.store.nodes.focus.tail.focus();
         break;
-      case o:
-        s.prev.focus();
+      }
+      case r:
+        e.prev.focus();
         break;
-      case !s.target:
-        t.nodes.focus.head.focus();
+      case o:
+        this.store.nodes.focus.head.focus();
         break;
       default:
-        s.next.focus();
+        e.next.focus();
     }
-    t.nodes.focus.caret = r, t.recovery = void 0;
-  }, n);
-};
-function Ze() {
-  const t = f(), e = I(!1), n = I(null);
-  x(() => {
-    const s = (r) => {
-      n.current = r.target, e.current = !0;
-    };
-    return document.addEventListener("mousedown", s), () => document.removeEventListener("mousedown", s);
-  }, []), x(() => {
-    const s = (r) => {
-      const o = e.current, i = !t.refs.container?.contains(n.current) || n.current !== r.target, a = window.getSelection()?.containsNode(t.refs.container, !0);
-      o && i && a && (t.selecting = "drag");
-    };
-    return document.addEventListener("mousemove", s), () => document.removeEventListener("mousemove", s);
-  }, []), x(() => {
-    const s = () => {
-      e.current = !1, n.current = null, t.selecting = void 0;
-    };
-    return document.addEventListener("mouseup", s), () => document.removeEventListener("mouseup", s);
-  }, []), Je();
-}
-function Je() {
-  const t = f(), e = f((n) => n.selecting);
-  x(() => {
-    if (e !== "drag") return;
-    const n = [...t.refs.container.children], s = n.map((r) => r.contentEditable);
-    return n.forEach((r) => r.contentEditable = "false"), () => n.forEach((r, o) => r.contentEditable = s[o]);
-  }, [e]);
-}
-function Qe() {
-  const t = f(), e = R(() => {
-    const n = t.props.showOverlayOn, s = "selectionChange";
-    (n === s || n.includes(s)) && t.bus.send(p.CheckTrigger);
-  }, []);
-  v(
-    "focusin",
-    () => {
-      document.addEventListener("selectionchange", e);
-    },
-    []
-  ), v(
-    "focusout",
-    () => {
-      document.removeEventListener("selectionchange", e);
-    },
-    []
-  ), v(
-    p.Change,
-    () => {
-      const n = t.props.showOverlayOn, s = "change";
-      (n === s || n.includes(s)) && t.bus.send(p.CheckTrigger);
-    },
-    []
-  );
+    this.store.nodes.focus.caret = n, this.store.state.recovery.set(void 0);
+  }
 }
-const Ke = () => {
-  const t = f();
-  v(p.ClearTrigger, (e) => t.overlayMatch = void 0, []), v(
-    p.CheckTrigger,
-    (e) => t.overlayMatch = U.find(t.props.options, (n) => n.overlay?.trigger),
-    []
-  );
-}, Ye = () => {
-  const t = f(), e = I(!1), { value: n, options: s } = f(
-    (r) => ({
-      value: r.props.value,
-      options: r.props.Mark ? r.props.options : void 0
-    }),
-    !0
-  );
-  x(() => {
-    const r = s?.map((i) => i.markup);
-    if (r && r.some(Boolean) ? t.parser = new O(r) : t.parser = void 0, e.current) {
-      t.bus.send(p.Parse);
-      return;
-    }
-    const o = n ?? t.props.defaultValue ?? "";
-    t.parser ? t.tokens = t.parser.parse(o) : t.tokens = [
-      {
-        type: "text",
-        content: o,
-        position: { start: 0, end: o.length }
+class ee {
+  constructor(t) {
+    this.store = t;
+  }
+  #t;
+  #e;
+  #n;
+  #s;
+  #r = null;
+  #o = !1;
+  enable() {
+    this.#t || (this.#t = (t) => {
+      this.#r = t.target, this.#o = !0;
+    }, this.#e = (t) => {
+      const e = this.#o, n = !this.store.refs.container?.contains(this.#r) || this.#r !== t.target, r = window.getSelection()?.containsNode(this.store.refs.container, !0);
+      e && n && r && this.store.state.selecting.set("drag");
+    }, this.#n = () => {
+      this.#o = !1, this.#r = null, this.store.state.selecting.set(void 0);
+    }, this.#s = () => {
+      if (this.store.state.selecting.get() !== "drag") return;
+      const t = [...this.store.refs.container.children], e = t.map((n) => n.contentEditable);
+      t.forEach((n) => n.contentEditable = "false"), t.forEach((n, r) => n.contentEditable = e[r]);
+    }, document.addEventListener("mousedown", this.#t), document.addEventListener("mousemove", this.#e), document.addEventListener("mouseup", this.#n), document.addEventListener("selectionchange", this.#s));
+  }
+  disable() {
+    this.#t && (document.removeEventListener("mousedown", this.#t), document.removeEventListener("mousemove", this.#e), document.removeEventListener("mouseup", this.#n), document.removeEventListener("selectionchange", this.#s), this.#t = void 0, this.#e = void 0, this.#n = void 0, this.#s = void 0), this.#r = null, this.#o = !1;
+  }
+}
+function ne(s, t) {
+  if ((t.ctrlKey || t.metaKey) && t.code === "KeyA") {
+    t.preventDefault();
+    const e = window.getSelection(), n = s.refs.container?.firstChild, r = s.refs.container?.lastChild;
+    if (!e || !n || !r) return;
+    e.setBaseAndExtent(n, 0, r, 1), s.state.selecting.set("all");
+  }
+}
+function se(s, t) {
+  const { focus: e } = s.nodes;
+  if (e.isMark && !e.isEditable || e.isCaretAtBeginning) {
+    const n = e.prev;
+    return n.focus(), n.isFocused || (n.prev.focus(), t.preventDefault()), e.setCaretToEnd(), !0;
+  }
+  return !1;
+}
+function re(s, t) {
+  const { focus: e } = s.nodes;
+  if (e.isMark && !e.isEditable || e.isCaretAtEnd) {
+    const n = e.next;
+    return n.focus(), n.isFocused || (n.next.focus(), t.preventDefault()), !0;
+  }
+  return !1;
+}
+class oe {
+  constructor(t) {
+    this.store = t;
+  }
+  #t;
+  #e;
+  #n;
+  enable() {
+    if (this.#t) return;
+    const t = this.store.refs.container;
+    t && (this.#t = (e) => {
+      e.key === x.LEFT ? se(this.store, e) : e.key === x.RIGHT && re(this.store, e), this.#s(e), ne(this.store, e);
+    }, this.#e = (e) => {
+      ae(this.store, e);
+    }, this.#n = (e) => {
+      ie(this.store, e);
+    }, t.addEventListener("keydown", this.#t), t.addEventListener("paste", this.#e), t.addEventListener("beforeinput", this.#n, !0));
+  }
+  disable() {
+    const t = this.store.refs.container;
+    !t || !this.#t || (t.removeEventListener("keydown", this.#t), t.removeEventListener("paste", this.#e), t.removeEventListener("beforeinput", this.#n, !0), this.#t = void 0, this.#e = void 0, this.#n = void 0);
+  }
+  #s(t) {
+    const { focus: e } = this.store.nodes;
+    if (t.key === x.DELETE || t.key === x.BACKSPACE) {
+      if (e.isMark) {
+        t.preventDefault(), U("self", this.store);
+        return;
       }
-    ], e.current = !0;
-  }, [n, s]), v(
-    p.Parse,
-    () => {
-      t.tokens = t.nodes.focus.target ? et(t) : tt(t);
-    },
-    []
-  );
-};
-function et(t) {
-  const { focus: e } = t.nodes;
-  if (!t.parser)
-    return t.tokens;
-  const n = t.parser.parse(e.content);
-  return n.length === 1 ? t.tokens : t.tokens.toSpliced(e.index, 1, ...n);
-}
-function tt(t) {
-  const {
-    props: { value: e }
-  } = t, n = nt(t), s = Me(t.previousValue, e);
-  switch (t.previousValue = e, !0) {
-    //Mark removing happen
-    case (s.left && n.includes(s.left) && s.right && Math.abs(s.left - s.right) > 1): {
-      const r = n.indexOf(s.left), o = D(t, r - 1, r);
-      return t.tokens.toSpliced(r - 1, 2, ...o);
-    }
-    //Changing in label
-    case s.left !== void 0: {
-      const [r] = q(n, s.left), o = D(t, r);
-      return o.length === 1 ? t.tokens : t.tokens.toSpliced(r, 1, ...o);
+      t.key === x.BACKSPACE && e.isSpan && e.isCaretAtBeginning && e.prev.target && (t.preventDefault(), U("prev", this.store)), t.key === x.DELETE && e.isSpan && e.isCaretAtEnd && e.next.target && (t.preventDefault(), U("next", this.store));
     }
-    case s.right !== void 0: {
-      const [r] = q(n, s.right), o = D(t, r);
-      return o.length === 1 ? t.tokens : t.tokens.toSpliced(r, 1, ...o);
-    }
-    default:
-      return ne(t, e ?? "");
   }
 }
-function D(t, ...e) {
-  let n = "";
-  for (const s of e) {
-    const r = t.tokens[s];
-    n += r.content;
+function ie(s, t) {
+  const e = s.state.selecting.get();
+  if (e !== "all" || !ut(s)) {
+    e === "all" && s.state.selecting.set(void 0);
+    return;
   }
-  return ne(t, n);
+  if (t.inputType === "insertFromPaste") return;
+  t.preventDefault();
+  const n = t.inputType.startsWith("delete") ? "" : t.data ?? "";
+  ht(s, n);
 }
-function nt(t) {
-  let e = 0;
-  return t.tokens.map((n) => {
-    const s = n.content.length;
-    return e += s, e - s;
-  }) ?? [];
+function ae(s, t) {
+  const e = s.state.selecting.get();
+  if (e !== "all" || !ut(s)) {
+    e === "all" && s.state.selecting.set(void 0);
+    return;
+  }
+  t.preventDefault();
+  const n = t.clipboardData?.getData("text/plain") ?? "";
+  ht(s, n);
 }
-function ne(t, e) {
-  return t.parser ? t.parser.parse(e) : [
-    {
-      type: "text",
-      content: e,
-      position: { start: 0, end: e.length }
-    }
-  ];
+function ut(s) {
+  const t = window.getSelection(), e = s.refs.container;
+  if (!t?.rangeCount || !e?.firstChild || !e?.lastChild) return !1;
+  try {
+    const n = t.getRangeAt(0);
+    return e.contains(n.startContainer) && e.contains(n.endContainer) && n.toString().length > 0;
+  } catch {
+    return !1;
+  }
 }
-const st = (t) => ({
-  get container() {
-    return t.refs.container;
-  },
-  get overlay() {
-    return t.refs.overlay;
-  },
-  focus() {
-    t.nodes.focus.head?.focus();
+function ht(s, t) {
+  s.nodes.focus.target = null, s.state.selecting.set(void 0), s.state.onChange.get()?.(t), s.state.value.get() === void 0 && s.state.tokens.set(
+    s.state.parser.get()?.parse(t) ?? [
+      {
+        type: "text",
+        content: t,
+        position: { start: 0, end: t.length }
+      }
+    ]
+  ), queueMicrotask(() => {
+    const e = s.refs.container?.firstChild;
+    e && (s.state.recovery.set({
+      anchor: s.nodes.focus,
+      caret: t.length
+    }), e.focus());
+  });
+}
+class ce {
+  #t = [];
+  #e = !1;
+  register(t) {
+    return this.#t.push(t), this;
   }
-});
-function rt(t) {
-  const e = f();
-  le(t, () => st(e), [e]);
-}
-const ot = ({ inRef: t }) => (rt(t), ze(), Ye(), je(), He(), qe(), Xe(), Ke(), Qe(), Ue(), Be(), Ze(), null), it = "_Container_1lmfr_1", at = "_Suggestions_1lmfr_10", ct = "_suggestionActive_1lmfr_38", V = {
-  Container: it,
-  Suggestions: at,
-  suggestionActive: ct
-}, lt = [
-  {
-    markup: ve,
-    overlay: {
-      trigger: me,
-      data: []
-    }
+  enableAll() {
+    this.#e || (this.#e = !0, this.#t.forEach((t) => t.enable()));
+  }
+  disableAll() {
+    this.#e && (this.#e = !1, this.#t.forEach((t) => t.disable()));
   }
-], ut = ({ props: t, children: e }) => {
-  const n = dt(t), [s] = A(() => B.create(n));
-  return x(() => {
-    s.props = n;
-  }), /* @__PURE__ */ m(P.Provider, { value: s, children: e });
+}
+const $ = (s, t) => ({
+  name: s,
+  enable: () => t.enable(),
+  disable: () => t.disable()
+}), le = (s) => {
+  const t = new ce();
+  return t.register($("keydown", s.controllers.keydown)).register($("system", s.controllers.system)).register($("focus", s.controllers.focus)).register($("textSelection", s.controllers.textSelection)), t;
 };
-function dt(t) {
-  const e = ge(V.Container, t.className, t.slotProps?.container?.className), n = pe(t.style, t.slotProps?.container?.style);
-  return {
-    value: t.value,
-    defaultValue: t.defaultValue,
-    onChange: t.onChange,
-    readOnly: t.readOnly,
-    options: t.options ?? lt,
-    showOverlayOn: t.showOverlayOn ?? "change",
-    className: e,
-    style: n,
-    Mark: t.Mark,
-    Overlay: t.Overlay,
-    slots: t.slots,
-    slotProps: t.slotProps
-  };
+class de {
+  constructor(t) {
+    this.store = t;
+  }
+  #t = [];
+  #e = !1;
+  enable(t) {
+    const { store: e } = this, n = le(e);
+    n.enableAll(), this.#t.push(() => n.disableAll()), this.#s(), this.#n(), t?.getTrigger && this.#r(t.getTrigger);
+  }
+  disable() {
+    for (const t of this.#t)
+      t();
+    this.#t = [], this.#e = !1;
+  }
+  /**
+   * Synchronizes the parser with current options and handles parsing.
+   * Must be called by the framework layer when value or options change,
+   * since these are props set synchronously during render.
+   */
+  syncParser(t, e) {
+    const { store: n } = this, r = e?.map((i) => i.markup);
+    if (r && r.some(Boolean) ? n.state.parser.set(new B(r)) : n.state.parser.set(void 0), this.#e) {
+      n.state.recovery.get() || n.events.parse();
+      return;
+    }
+    const o = t ?? n.state.defaultValue.get() ?? "";
+    n.state.tokens.set(_(n, o)), this.#e = !0;
+  }
+  /**
+   * Recovers focus after tokens change.
+   * Must be called by the framework layer after DOM updates,
+   * since focus recovery requires the new DOM to be committed.
+   */
+  recoverFocus() {
+    this.store.state.Mark.get() && this.store.controllers.focus.recover();
+  }
+  #n() {
+    const t = this.store.refs.container;
+    if (!t) return;
+    const e = () => this.store.events.change();
+    t.addEventListener("input", e), this.#t.push(() => t.removeEventListener("input", e));
+  }
+  #s() {
+    const { store: t } = this;
+    this.#t.push(
+      t.events.parse.on(() => {
+        if (t.state.recovery.get()) {
+          const e = I(t.state.tokens.get());
+          t.state.tokens.set(_(t, e)), t.state.previousValue.set(e);
+          return;
+        }
+        t.state.tokens.set(t.nodes.focus.target ? Ft(t) : Wt(t));
+      })
+    );
+  }
+  #r(t) {
+    const { store: e } = this;
+    e.controllers.overlay.enableTrigger(t, (n) => e.state.overlayMatch.set(n)), this.#t.push(() => e.controllers.overlay.disable()), this.#t.push(
+      e.state.overlayMatch.on((n) => {
+        n ? (e.nodes.input.target = e.nodes.focus.target, e.controllers.overlay.enableClose()) : e.controllers.overlay.disableClose();
+      })
+    );
+  }
 }
-function ht() {
-  const t = f(), e = f((o) => o.overlayMatch), n = S.getAbsolutePosition(), s = R(() => t.bus.send(p.ClearTrigger), []), r = R(
-    (o) => {
-      const i = {
-        type: "mark",
-        value: o.value,
-        meta: o.meta,
-        content: "",
-        position: { start: e.index, end: e.index + e.span.length },
-        descriptor: {
-          index: 0,
-          // TODO: get correct index
-          markup: e.option.markup
-        },
-        // TODO: fix typing
-        children: [],
-        nested: void 0
-      };
-      t.bus.send(p.Select, { mark: i, match: e }), t.bus.send(p.ClearTrigger);
-    },
-    [e]
-  );
-  return { match: e, style: n, select: r, close: s, ref: { current: t.refs.overlay } };
-}
-const ft = () => {
-  const { match: t, select: e, style: n, ref: s } = ht(), [r, o] = A(NaN), i = t.option.overlay?.data || [], a = ue(
-    () => i.filter((l) => l.toLowerCase().indexOf(t.value.toLowerCase()) > -1),
-    [t.value, i]
-  ), c = a.length;
-  return C(
-    k.UP,
-    (l) => {
-      l.preventDefault(), o((h) => isNaN(h) ? 0 : (c + (h - 1) % c) % c);
-    },
-    [c]
-  ), C(
-    k.DOWN,
-    (l) => {
-      l.preventDefault(), o((h) => isNaN(h) ? 0 : (h + 1) % c);
-    },
-    [c]
-  ), C(
-    k.ENTER,
-    (l) => {
-      l.preventDefault();
-      const h = a[r];
-      e({ value: h, meta: r.toString() });
-    },
-    [a, r]
-  ), a.length ? /* @__PURE__ */ m("ul", { ref: s, className: V.Suggestions, style: n, children: a.map((l, h) => {
-    const u = h === r ? V.suggestionActive : void 0;
-    return /* @__PURE__ */ m(
-      "li",
+class ue {
+  key = new Zt();
+  nodes = {
+    focus: new V(void 0, this),
+    input: new V(void 0, this)
+  };
+  state;
+  events = Xt();
+  refs = {
+    container: null,
+    overlay: null
+  };
+  controllers = {
+    overlay: new Yt(this),
+    focus: new te(this),
+    keydown: new oe(this),
+    system: new Kt(this),
+    textSelection: new ee(this)
+  };
+  lifecycle = new de(this);
+  constructor(t) {
+    this.state = zt(
       {
-        ref: (d) => u && d?.scrollIntoView(!1),
-        className: u,
-        onClick: (d) => e({ value: l, meta: h.toString() }),
-        children: l
+        tokens: [],
+        parser: void 0,
+        previousValue: void 0,
+        recovery: void 0,
+        selecting: void 0,
+        overlayMatch: void 0,
+        value: void 0,
+        defaultValue: void 0,
+        onChange: void 0,
+        readOnly: !1,
+        options: void 0,
+        showOverlayOn: void 0,
+        Mark: void 0,
+        Overlay: void 0,
+        className: void 0,
+        style: void 0,
+        slots: void 0,
+        slotProps: void 0
       },
-      l
+      t.createUseHook
     );
-  }) }) : null;
-}, se = W(() => {
-  const t = f(), e = f((o) => o.overlayMatch), n = f((o) => o.overlayMatch ? o.key.get(o.overlayMatch.option) : void 0), [s, r] = ee("overlay", e?.option, void 0, ft);
-  if (x(() => {
-    t.nodes.input.target = t.nodes.focus.target;
-  }, [n]), n) return /* @__PURE__ */ m(s, { ...r ?? {} }, n);
-});
-se.displayName = "Whisper";
-const gt = (t, e) => /* @__PURE__ */ ie(ut, { props: t, children: [
-  /* @__PURE__ */ m(te, {}),
-  /* @__PURE__ */ m(se, {}),
-  /* @__PURE__ */ m(ot, { inRef: e })
-] }), St = de(gt);
-function F(t, e, n = 0, s) {
-  for (const r of t) {
-    if (r === e) return { depth: n, parent: s };
-    if (r.type === "mark") {
-      const o = F(r.children, e, n + 1, r);
-      if (o) return o;
-    }
+  }
+  createHandler() {
+    const t = this;
+    return {
+      get container() {
+        return t.refs.container;
+      },
+      get overlay() {
+        return t.refs.overlay;
+      },
+      focus() {
+        t.nodes.focus.head?.focus();
+      }
+    };
   }
 }
-class pt {
+class he {
   ref;
   #t;
   #e;
-  readOnly;
-  constructor(e) {
-    this.ref = e.ref, this.#t = e.store, this.#e = e.token;
+  #n;
+  constructor(t) {
+    this.ref = t.ref, this.#t = t.store, this.#e = t.token;
+  }
+  get readOnly() {
+    return this.#n;
+  }
+  set readOnly(t) {
+    this.#n = t;
   }
-  // ─── Data Properties ─────────────────────────────────────────────────────────
-  /** Displayed text of the mark */
   get content() {
     return this.#e.content;
   }
-  set content(e) {
-    this.#e.content = e, this.#n();
+  set content(t) {
+    this.#e.content = t, this.#s();
   }
-  /** Data value associated with the mark */
   get value() {
     return this.#e.value;
   }
-  set value(e) {
-    this.#e.value = e ?? "", this.#n();
+  set value(t) {
+    this.#e.value = t ?? "", this.#s();
   }
-  /** Optional metadata for the mark */
   get meta() {
     return this.#e.meta;
   }
-  set meta(e) {
-    this.#e.meta = e, this.#n();
+  set meta(t) {
+    this.#e.meta = t, this.#s();
   }
-  // ─── Navigation Properties ───────────────────────────────────────────────────
-  /** Nesting depth (0 for root-level marks) */
   get depth() {
-    return F(this.#t.tokens, this.#e).depth;
+    return z(this.#t.state.tokens.get(), this.#e).depth;
   }
-  /** Whether this mark has nested children */
   get hasChildren() {
     return this.#e.children.length > 0;
   }
-  /** Parent mark token (undefined for root-level marks) */
   get parent() {
-    return F(this.#t.tokens, this.#e)?.parent;
+    return z(this.#t.state.tokens.get(), this.#e)?.parent;
   }
-  /** Child tokens of this mark */
   get tokens() {
     return this.#e.children;
   }
-  // ─── Mutation Methods ────────────────────────────────────────────────────────
-  /** Update multiple properties in a single operation */
-  change = (e) => {
-    this.#e.content = e.content, this.#e.value = e.value ?? "", e.meta !== void 0 && (this.#e.meta = e.meta), this.#n();
+  change = (t) => {
+    this.#e.content = t.content, this.#e.value = t.value ?? "", t.meta !== void 0 && (this.#e.meta = t.meta), this.#s();
   };
-  /** Delete this mark from the editor */
-  remove = () => this.#t.bus.send(p.Delete, { token: this.#e });
-  // ─── Private ─────────────────────────────────────────────────────────────────
-  #n() {
-    this.#t.bus.send(p.Change, { node: this.#e });
+  remove = () => this.#t.events.delete({ token: this.#e });
+  #s() {
+    this.#t.events.change();
+  }
+}
+let ft = 0;
+function rt(s) {
+  return `block-${ft++}-${s}`;
+}
+function fe() {
+  ft = 0;
+}
+function ge(s) {
+  if (s.length === 0) return [];
+  fe();
+  const t = [];
+  let e = [], n = -1;
+  const r = (o) => {
+    e.length !== 0 && (t.push({
+      id: rt(n),
+      tokens: [...e],
+      startPos: n,
+      endPos: o
+    }), e = [], n = -1);
+  };
+  for (const o of s) {
+    if (o.type === "mark") {
+      o.content.endsWith(`
+`) ? (r(o.position.start), t.push({
+        id: rt(o.position.start),
+        tokens: [o],
+        startPos: o.position.start,
+        endPos: o.position.end
+      })) : (n === -1 && (n = o.position.start), e.push(o));
+      continue;
+    }
+    if (o.type !== "text") continue;
+    const a = pe(o);
+    for (let c = 0; c < a.length; c++) {
+      const l = a[c];
+      if (l.isNewline) {
+        r(l.position.start);
+        continue;
+      }
+      l.content.length !== 0 && (n === -1 && (n = l.position.start), e.push({
+        type: "text",
+        content: l.content,
+        position: l.position
+      }));
+    }
+  }
+  if (e.length > 0) {
+    const o = e[e.length - 1];
+    r(o.position.end);
+  }
+  return t;
+}
+function pe(s) {
+  const t = [], { content: e, position: n } = s;
+  let r = n.start;
+  const o = [], i = () => {
+    if (o.length > 0) {
+      const a = o.join("");
+      t.push({
+        content: a,
+        position: { start: r, end: r + a.length },
+        isNewline: !1
+      }), r += a.length, o.length = 0;
+    }
+  };
+  for (let a = 0; a < e.length; a++) {
+    const c = e[a];
+    c === `
+` ? (i(), t.push({
+      content: `
+`,
+      position: { start: r, end: r + 1 },
+      isNewline: !0
+    }), r += 1) : c === "\r" ? a + 1 < e.length && e[a + 1] === `
+` ? (i(), t.push({
+      content: `
+`,
+      position: { start: r, end: r + 2 },
+      isNewline: !0
+    }), r += 2, a++) : (i(), t.push({
+      content: `
+`,
+      position: { start: r, end: r + 1 },
+      isNewline: !0
+    }), r += 1) : o.push(c);
+  }
+  return i(), t;
+}
+function ve(s, t, e, n) {
+  if (e === n || e === n - 1 || t.length < 2 || e < 0 || e >= t.length || n < 0 || n > t.length) return s;
+  const r = me(s, t), o = xe(r, e, n);
+  return ye(o);
+}
+function me(s, t) {
+  return t.map((e, n) => {
+    const r = s.substring(e.startPos, e.endPos);
+    let o = "";
+    if (n < t.length - 1) {
+      const i = t[n + 1];
+      o = s.substring(e.endPos, i.startPos);
+    }
+    return {
+      index: n,
+      text: r,
+      separatorAfter: o
+    };
+  });
+}
+function ye(s) {
+  const t = [];
+  for (let e = 0; e < s.length; e++) {
+    const n = s[e], r = e === s.length - 1;
+    let o = n.text;
+    o.endsWith(`
+`) && (o = o.slice(0, -1)), t.push(o), r || t.push(n.separatorAfter || `
+`);
+  }
+  return t.join("");
+}
+function xe(s, t, e) {
+  const n = [...s], [r] = n.splice(t, 1), o = e > t ? e - 1 : e;
+  return n.splice(o, 0, r), ke(n, s), n;
+}
+function ke(s, t) {
+  for (let e = 0; e < s.length - 1; e++) {
+    const n = s[e].index, r = s[e + 1].index;
+    if (Math.abs(n - r) === 1) {
+      const o = Math.min(n, r), i = t[o].separatorAfter;
+      s[e].separatorAfter = i.length > 0 ? i : `
+`;
+    } else
+      s[e].separatorAfter = `
+`;
+  }
+}
+const we = {
+  container: "div",
+  span: "span"
+};
+function K(s, t) {
+  return t?.[s] ? t[s] : we[s];
+}
+function Y(s, t) {
+  const e = t?.[s];
+  return e ? Et(e) : void 0;
+}
+const tt = at(void 0);
+tt.displayName = "StoreContext";
+function E() {
+  const s = ct(tt);
+  return bt(s), s;
+}
+const Se = (s) => {
+  const t = at(void 0);
+  return t.displayName = s, [() => {
+    const n = ct(t);
+    if (n === void 0)
+      throw new Error(`Context "${s}" not found. Make sure to wrap component in its Provider.`);
+    return n;
+  }, t.Provider, t];
+}, [et, ot] = Se("NodeProvider");
+function gt(s, t, e, n) {
+  const r = E(), o = r.state.Mark.use(), i = r.state.Overlay.use(), a = s === "mark" ? o : i, c = s === "mark" ? t?.mark : t?.overlay;
+  let l;
+  c !== void 0 ? typeof c == "function" ? l = c(e) : l = c : l = e ?? {};
+  const d = l.slot || a || n;
+  if (!d)
+    throw new Error(
+      `No ${s} component found. Provide either option.${s}.slot, global ${s === "mark" ? "Mark" : "Overlay"}, or a defaultComponent.`
+    );
+  return [d, l];
+}
+function Ce() {
+  const s = et(), t = E(), e = t.state.options.use(), n = t.key, r = e?.[s.descriptor.index], o = s.children.map((l) => /* @__PURE__ */ f(F, { mark: l, isNested: !0 }, n.get(l))), i = {
+    value: s.value,
+    meta: s.meta,
+    nested: s.nested?.content,
+    children: s.children.length > 0 ? o : void 0
+  }, [a, c] = gt("mark", r, i);
+  return /* @__PURE__ */ f(a, { ...c });
+}
+const be = () => {
+  const s = et(), t = E(), e = H(null), n = t.state.readOnly.use(), r = t.state.slots.use(), o = t.state.slotProps.use(), i = S(() => K("span", r), [r]), a = S(() => Y("span", o), [o]);
+  if (s.type !== "text")
+    throw new Error("TextSpan component expects a TextToken");
+  return St(() => {
+    e.current && e.current.textContent !== s.content && (e.current.textContent = s.content);
+  }, [s.content]), /* @__PURE__ */ f(
+    i,
+    {
+      ...a,
+      ref: e,
+      contentEditable: !n,
+      onPaste: Ee,
+      suppressContentEditableWarning: !0
+    }
+  );
+};
+function Ee(s) {
+  s.preventDefault();
+  const t = s.clipboardData.getData("text");
+  document.execCommand("insertText", !1, t);
+}
+const F = O(({ mark: s, isNested: t = !1 }) => s.type === "mark" ? /* @__PURE__ */ f(ot, { value: s, children: /* @__PURE__ */ f(Ce, {}) }) : t ? /* @__PURE__ */ f(wt, { children: s.content }) : /* @__PURE__ */ f(ot, { value: s, children: /* @__PURE__ */ f(be, {}) }));
+F.displayName = "Token";
+const pt = O(() => {
+  const s = E(), t = s.state.tokens.use(), e = s.state.slots.use(), n = s.state.slotProps.use(), r = s.state.className.use(), o = s.state.style.use(), i = s.key, a = s.refs, c = S(() => K("container", e), [e]), l = S(() => Y("container", n), [n]);
+  return /* @__PURE__ */ f(
+    c,
+    {
+      ref: (d) => a.container = d,
+      ...l,
+      className: r,
+      style: o,
+      children: t.map((d) => /* @__PURE__ */ f(F, { mark: d }, i.get(d)))
+    }
+  );
+});
+pt.displayName = "Container";
+const q = {
+  position: "absolute",
+  left: -28,
+  top: 2,
+  width: 20,
+  height: 20,
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  cursor: "grab",
+  borderRadius: 4,
+  opacity: 0,
+  transition: "opacity 0.15s ease",
+  userSelect: "none",
+  color: "#9ca3af",
+  flexShrink: 0,
+  background: "none",
+  border: "none",
+  padding: 0,
+  margin: 0,
+  font: "inherit",
+  lineHeight: 1
+}, vt = {
+  ...q,
+  opacity: 1
+}, Te = {
+  ...vt,
+  cursor: "grabbing"
+}, Ne = {
+  position: "relative",
+  paddingLeft: 4,
+  transition: "opacity 0.2s ease"
+}, it = {
+  position: "absolute",
+  left: 0,
+  right: 0,
+  height: 2,
+  backgroundColor: "#3b82f6",
+  borderRadius: 1,
+  pointerEvents: "none",
+  zIndex: 10
+}, mt = O(() => /* @__PURE__ */ Z("svg", { width: "14", height: "14", viewBox: "0 0 16 16", fill: "currentColor", children: [
+  /* @__PURE__ */ f("circle", { cx: "5", cy: "3", r: "1.5" }),
+  /* @__PURE__ */ f("circle", { cx: "11", cy: "3", r: "1.5" }),
+  /* @__PURE__ */ f("circle", { cx: "5", cy: "8", r: "1.5" }),
+  /* @__PURE__ */ f("circle", { cx: "11", cy: "8", r: "1.5" }),
+  /* @__PURE__ */ f("circle", { cx: "5", cy: "13", r: "1.5" }),
+  /* @__PURE__ */ f("circle", { cx: "11", cy: "13", r: "1.5" })
+] }));
+mt.displayName = "GripIcon";
+const yt = O(({ blockIndex: s, children: t, readOnly: e, onReorder: n }) => {
+  const [r, o] = P(!1), [i, a] = P(!1), [c, l] = P(null), d = H(null), g = k(() => o(!0), []), u = k(() => o(!1), []), h = k(
+    (p) => {
+      p.dataTransfer.effectAllowed = "move", p.dataTransfer.setData("text/plain", String(s)), a(!0), d.current && p.dataTransfer.setDragImage(d.current, 0, 0);
+    },
+    [s]
+  ), v = k(() => {
+    a(!1), l(null);
+  }, []), C = k((p) => {
+    if (p.preventDefault(), p.dataTransfer.dropEffect = "move", !d.current) return;
+    const D = d.current.getBoundingClientRect(), W = D.top + D.height / 2;
+    l(p.clientY < W ? "before" : "after");
+  }, []), m = k((p) => {
+    p.currentTarget.contains(p.relatedTarget) || l(null);
+  }, []), b = k(
+    (p) => {
+      p.preventDefault();
+      const D = parseInt(p.dataTransfer.getData("text/plain"), 10);
+      if (isNaN(D)) return;
+      const W = c === "before" ? s : s + 1;
+      l(null), n(D, W);
+    },
+    [s, c, n]
+  ), T = {
+    ...Ne,
+    opacity: i ? 0.4 : 1
+  }, L = e ? { ...q, display: "none" } : i ? Te : r ? vt : q;
+  return /* @__PURE__ */ Z(
+    "div",
+    {
+      ref: d,
+      style: T,
+      onMouseEnter: g,
+      onMouseLeave: u,
+      onDragOver: C,
+      onDragLeave: m,
+      onDrop: b,
+      children: [
+        c === "before" && /* @__PURE__ */ f("div", { style: { ...it, top: -1 } }),
+        /* @__PURE__ */ f(
+          "button",
+          {
+            type: "button",
+            draggable: !e,
+            onDragStart: h,
+            onDragEnd: v,
+            style: L,
+            "aria-label": "Drag to reorder",
+            children: /* @__PURE__ */ f(mt, {})
+          }
+        ),
+        t,
+        c === "after" && /* @__PURE__ */ f("div", { style: { ...it, bottom: -1 } })
+      ]
+    }
+  );
+});
+yt.displayName = "DraggableBlock";
+const xt = O(() => {
+  const s = E(), t = s.state.tokens.use(), e = s.state.slots.use(), n = s.state.slotProps.use(), r = s.state.className.use(), o = s.state.style.use(), i = s.state.readOnly.use(), a = s.state.value.use(), c = s.state.onChange.use(), l = s.key, d = s.refs, g = S(() => K("container", e), [e]), u = S(() => Y("container", n), [n]), h = S(() => ge(t), [t]), v = H(h);
+  v.current = h;
+  const C = k(
+    (m, b) => {
+      if (!a || !c) return;
+      const T = v.current, L = ve(a, T, m, b);
+      if (L !== a) {
+        const p = _(s, L);
+        s.state.tokens.set(p), s.state.previousValue.set(L), c(L);
+      }
+    },
+    [s, a, c]
+  );
+  return /* @__PURE__ */ f(
+    g,
+    {
+      ref: (m) => d.container = m,
+      ...u,
+      className: r,
+      style: o,
+      children: h.map((m, b) => /* @__PURE__ */ f(yt, { blockIndex: b, readOnly: i, onReorder: C, children: m.tokens.map((T) => /* @__PURE__ */ f(F, { mark: T }, l.get(T))) }, m.id))
+    }
+  );
+});
+xt.displayName = "BlockContainer";
+function Ie() {
+  const s = E(), t = s.state.overlayMatch.use(), e = w.getAbsolutePosition(), n = k(() => s.events.clearOverlay(), []), r = k(
+    (i) => {
+      const a = {
+        type: "mark",
+        value: i.value,
+        meta: i.meta,
+        content: "",
+        position: { start: t.index, end: t.index + t.span.length },
+        descriptor: {
+          index: 0,
+          markup: t.option.markup
+        },
+        children: [],
+        nested: void 0
+      };
+      s.events.select({ mark: a, match: t }), s.events.clearOverlay();
+    },
+    [t]
+  ), o = S(
+    () => ({
+      get current() {
+        return s.refs.overlay;
+      },
+      set current(i) {
+        s.refs.overlay = i;
+      }
+    }),
+    []
+  );
+  return { match: t, style: e, select: r, close: n, ref: o };
+}
+const Pe = "_Container_1lmfr_1", Me = "_Suggestions_1lmfr_10", Le = "_suggestionActive_1lmfr_38", X = {
+  Container: Pe,
+  Suggestions: Me,
+  suggestionActive: Le
+}, Ae = () => {
+  const s = E(), { match: t, select: e, style: n, ref: r } = Ie(), [o, i] = P(NaN), a = t.option.overlay?.data || [], c = S(
+    () => a.filter((d) => d.toLowerCase().indexOf(t.value.toLowerCase()) > -1),
+    [t.value, a]
+  ), l = c.length;
+  return M(() => {
+    const d = s.refs.container;
+    if (!d) return;
+    const g = (u) => {
+      switch (u.key) {
+        case x.UP:
+          u.preventDefault(), i((h) => isNaN(h) ? 0 : (l + (h - 1) % l) % l);
+          break;
+        case x.DOWN:
+          u.preventDefault(), i((h) => isNaN(h) ? 0 : (h + 1) % l);
+          break;
+        case x.ENTER:
+          u.preventDefault(), i((h) => {
+            if (isNaN(h)) return h;
+            const v = c[h];
+            return e({ value: v, meta: h.toString() }), h;
+          });
+          break;
+      }
+    };
+    return d.addEventListener("keydown", g), () => d.removeEventListener("keydown", g);
+  }, [l, c]), c.length ? /* @__PURE__ */ f("ul", { ref: r, className: X.Suggestions, style: n, children: c.map((d, g) => {
+    const u = g === o ? X.suggestionActive : void 0;
+    return /* @__PURE__ */ f(
+      "li",
+      {
+        ref: (h) => {
+          u && h && h.scrollIntoView(!1);
+        },
+        className: u,
+        onClick: (h) => e({ value: d, meta: g.toString() }),
+        children: d
+      },
+      d
+    );
+  }) }) : null;
+}, kt = O(() => {
+  const s = E(), t = s.state.overlayMatch.use(), e = S(() => t ? s.key.get(t.option) : void 0, [t]), [n, r] = gt("overlay", t?.option, void 0, Ae);
+  if (e) return /* @__PURE__ */ f(n, { ...r ?? {} }, e);
+});
+kt.displayName = "OverlayRenderer";
+function Oe(s, t) {
+  Ct(t, () => s.createHandler(), [s]), M(() => (s.lifecycle.enable({
+    getTrigger: (a) => a.overlay?.trigger
+  }), () => s.lifecycle.disable()), []);
+  const e = s.state.value.use(), n = s.state.Mark.use(), r = s.state.options.use(), o = n ? r : void 0;
+  M(() => {
+    s.lifecycle.syncParser(e, o);
+  }, [e, o]);
+  const i = s.state.tokens.use();
+  M(() => {
+    s.lifecycle.recoverFocus();
+  }, [i]);
+}
+const De = (s) => () => {
+  const [t, e] = P(() => s.get());
+  return M(() => s.on(e), [s]), t;
+}, _e = [
+  {
+    markup: Pt,
+    overlay: {
+      trigger: It,
+      data: []
+    }
   }
+];
+function Fe(s) {
+  const {
+    ref: t,
+    value: e,
+    defaultValue: n,
+    onChange: r,
+    readOnly: o = !1,
+    block: i = !1,
+    Mark: a,
+    Overlay: c,
+    slots: l,
+    slotProps: d,
+    options: g = _e,
+    showOverlayOn: u = "change",
+    className: h,
+    style: v
+  } = s, C = Tt(X.Container, h, d?.container?.className), m = Nt(v, d?.container?.style), [b] = P(() => new ue({ createUseHook: De }));
+  b.state.set({
+    value: e,
+    defaultValue: n,
+    onChange: r,
+    readOnly: o,
+    options: g,
+    showOverlayOn: u,
+    Mark: a,
+    Overlay: c,
+    className: C,
+    style: m,
+    slots: l,
+    slotProps: d
+  }), Oe(b, t);
+  const T = i ? xt : pt;
+  return /* @__PURE__ */ Z(tt.Provider, { value: b, children: [
+    /* @__PURE__ */ f(T, {}),
+    /* @__PURE__ */ f(kt, {})
+  ] });
 }
-const Ct = (t = {}) => {
-  const e = f(), n = H(), s = I();
-  if (n.type !== "mark")
+const We = (s = {}) => {
+  const t = E(), e = et(), n = H(null);
+  if (e.type !== "mark")
     throw new Error("useMark can only be used with mark tokens");
-  const [r] = A(() => new pt({ ref: s, store: e, token: n }));
-  mt(s, t, n);
-  const o = f((i) => i.props.readOnly);
-  return x(() => {
+  const [r] = P(() => new he({ ref: n, store: t, token: e }));
+  Re(n, s, e);
+  const o = t.state.readOnly.use();
+  return M(() => {
     r.readOnly = o;
   }, [o]), r;
 };
-function mt(t, e, n) {
-  x(() => {
-    t.current && !e.controlled && (t.current.textContent = n.content);
+function Re(s, t, e) {
+  M(() => {
+    s.current && !t.controlled && (s.current.textContent = e.content);
   }, []);
 }
 export {
-  St as MarkedInput,
-  $ as annotate,
-  kt as denote,
-  v as useListener,
-  Ct as useMark,
-  ht as useOverlay
+  he as MarkHandler,
+  Fe as MarkedInput,
+  j as annotate,
+  Be as denote,
+  ve as reorderBlocks,
+  ge as splitTokensIntoBlocks,
+  We as useMark,
+  Ie as useOverlay
 };