@editora/react 1.0.1

package/dist/index.esm.js

@@ -0,0 +1,1044 @@
+import { jsx as l, jsxs as N, Fragment as F } from "react/jsx-runtime";
+import ee, { useRef as E, useState as R, useEffect as T, useMemo as j } from "react";
+import { KeyboardShortcutManager as _, PluginManager as te, Editor as ne } from "@editora/core";
+const oe = ({
+  isOpen: e,
+  options: t,
+  onSelect: d,
+  onClose: c,
+  anchorRef: i,
+  className: r = ""
+}) => {
+  const m = E(null), [f, g] = R({ top: 0, left: 0 });
+  return T(() => {
+    if (e && i.current) {
+      const o = i.current.getBoundingClientRect(), s = 120, h = t.length * 36;
+      let b = o.bottom + 4, u = o.left;
+      const v = window.innerWidth, p = window.innerHeight;
+      u + s > v && (u = v - s - 8), b + h > p && (b = o.top - h - 4), g({ top: b, left: u });
+    }
+  }, [e, i, t.length]), T(() => {
+    if (e && i.current && m.current) {
+      const o = i.current.getBoundingClientRect(), s = m.current.getBoundingClientRect();
+      let h = o.bottom + 4, b = o.left;
+      const u = window.innerWidth, v = window.innerHeight;
+      b + s.width > u && (b = u - s.width - 8), h + s.height > v && (h = o.top - s.height - 4), g({ top: h, left: b });
+    }
+  }, [e]), T(() => {
+    const o = (h) => {
+      m.current && !m.current.contains(h.target) && i.current && !i.current.contains(h.target) && c();
+    }, s = (h) => {
+      h.key === "Escape" && c();
+    };
+    return e && (document.addEventListener("mousedown", o), document.addEventListener("keydown", s)), () => {
+      document.removeEventListener("mousedown", o), document.removeEventListener("keydown", s);
+    };
+  }, [e, c, i]), e ? /* @__PURE__ */ l(
+    "div",
+    {
+      ref: m,
+      className: `rte-inline-menu ${r}`,
+      style: {
+        position: "fixed",
+        top: f.top,
+        left: f.left,
+        zIndex: 1e3,
+        background: "white",
+        border: "1px solid #ccc",
+        borderRadius: "4px",
+        boxShadow: "0 2px 8px rgba(0, 0, 0, 0.15)",
+        minWidth: "120px",
+        maxWidth: "200px",
+        pointerEvents: "auto"
+      },
+      children: t.map((o) => /* @__PURE__ */ l(
+        "div",
+        {
+          className: "rte-inline-menu-item",
+          onClick: () => {
+            d(o.value), c();
+          },
+          style: {
+            padding: "8px 12px",
+            cursor: "pointer",
+            borderBottom: "1px solid #f0f0f0",
+            fontSize: "14px",
+            whiteSpace: "nowrap",
+            overflow: "hidden",
+            textOverflow: "ellipsis"
+          },
+          onMouseEnter: (s) => {
+            s.currentTarget.style.backgroundColor = "#f5f5f5";
+          },
+          onMouseLeave: (s) => {
+            s.currentTarget.style.backgroundColor = "transparent";
+          },
+          children: o.label
+        },
+        o.value
+      ))
+    }
+  ) : null;
+}, V = ({
+  editor: e,
+  position: t = "top",
+  sticky: d = !1,
+  floating: c = !1
+}) => {
+  const [i, r] = R(null), [m, f] = R(null), [g, o] = R(null), [s, h] = R(null), [b, u] = R(!1), v = E({}), p = E(null), y = E(null), C = E(null), w = e.pluginManager.getToolbarItems();
+  T(() => {
+    const n = () => {
+      if (!p.current || !y.current) return;
+      const W = p.current.clientWidth, H = 16, Y = 40, U = 4, Z = W - H - Y - U;
+      let q = 0, P = 0;
+      const $ = y.current.children;
+      for (let z = 0; z < $.length; z++) {
+        const K = $[z].offsetWidth + U;
+        if (q + K <= Z)
+          q += K, P++;
+        else
+          break;
+      }
+      h(Math.max(1, P));
+    }, a = requestAnimationFrame(() => {
+      n();
+    }), x = new ResizeObserver(() => {
+      n();
+    });
+    p.current && x.observe(p.current);
+    const S = new MutationObserver(() => {
+      n();
+    });
+    return y.current && S.observe(y.current, {
+      childList: !0,
+      subtree: !0
+    }), () => {
+      cancelAnimationFrame(a), x.disconnect(), S.disconnect();
+    };
+  }, [w.length]);
+  const L = (n) => (v.current[n] || (v.current[n] = ee.createRef()), v.current[n]), k = (n, a) => {
+    const x = p.current?.closest("[data-editora-editor]"), S = x?.querySelector(".rte-content");
+    if (S && S.focus(), g && (n === "setTextAlignment" || n === "setFontFamily" || n === "setBlockType")) {
+      const H = window.getSelection();
+      H && (H.removeAllRanges(), H.addRange(g)), o(null);
+    }
+    typeof window < "u" && window.executeEditorCommand && window.executeEditorCommand(n, a), r(null);
+    const W = x?.querySelector(".rte-content");
+    W && W.focus();
+  }, A = (n) => {
+    const a = window.getSelection();
+    a && a.rangeCount > 0 && o(a.getRangeAt(0).cloneRange()), r(i === n ? null : n);
+  }, M = (n) => {
+    const a = window.getSelection();
+    a && a.rangeCount > 0 && o(a.getRangeAt(0).cloneRange()), f(m === n ? null : n), r(null);
+  }, I = (n, a) => {
+    if (g) {
+      const x = window.getSelection();
+      x && (x.removeAllRanges(), x.addRange(g)), o(null);
+    }
+    k(n, a), f(null);
+  }, D = (n, a) => n && n.startsWith("<svg") && n.endsWith("</svg>") ? /* @__PURE__ */ l("span", { dangerouslySetInnerHTML: { __html: n } }) : n && n.length === 1 && /^[BIUSH]$/.test(n) ? /* @__PURE__ */ l("span", { style: { fontWeight: "bold", fontSize: "14px", lineHeight: "1" }, children: n }) : n || "⚪";
+  if (c)
+    return null;
+  const Q = {
+    ...d && {
+      position: "sticky",
+      top: 0,
+      zIndex: 100,
+      backgroundColor: "#fff",
+      boxShadow: "0 2px 4px rgba(0,0,0,0.1)"
+    },
+    ...t === "bottom" && {
+      order: 2
+      // Move to bottom in flex container
+    }
+  }, O = (n) => n.map((a, x) => /* @__PURE__ */ l(
+    "div",
+    {
+      className: "rte-toolbar-item",
+      style: {
+        display: s !== null && x >= s ? "none" : "flex"
+      },
+      children: a.type === "dropdown" ? /* @__PURE__ */ N("div", { className: "rte-toolbar-dropdown", children: [
+        /* @__PURE__ */ N(
+          "button",
+          {
+            className: "rte-toolbar-button",
+            "data-command": a.command,
+            "data-active": "false",
+            onClick: () => A(a.command),
+            children: [
+              a.label,
+              " ▼"
+            ]
+          }
+        ),
+        i === a.command && /* @__PURE__ */ l("div", { className: "rte-toolbar-dropdown-menu", children: a.options?.map((S) => /* @__PURE__ */ l(
+          "div",
+          {
+            className: "rte-toolbar-dropdown-item",
+            onClick: () => k(a.command, S.value),
+            children: S.label
+          },
+          S.value
+        )) })
+      ] }) : a.type === "inline-menu" ? /* @__PURE__ */ l(
+        "button",
+        {
+          ref: L(a.command),
+          className: "rte-toolbar-button",
+          "data-command": a.command,
+          "data-active": "false",
+          onClick: () => M(a.command),
+          title: a.label,
+          children: D(a.icon, a.command)
+        }
+      ) : a.type === "input" ? /* @__PURE__ */ l(
+        "input",
+        {
+          type: "text",
+          className: `rte-toolbar-input ${a.label.toLowerCase().replace(/\s+/g, "-")}`,
+          placeholder: a.placeholder,
+          onChange: (S) => k(a.command, S.target.value),
+          onKeyDown: (S) => {
+            S.key === "Enter" && k(
+              a.command,
+              S.target.value
+            );
+          },
+          title: a.label
+        }
+      ) : a.type === "group" ? /* @__PURE__ */ l(
+        "div",
+        {
+          className: `rte-toolbar-group-button ${a.label.toLowerCase().replace(/\s+/g, "-")}`,
+          title: `${a.label}`,
+          children: /* @__PURE__ */ l(
+            "div",
+            {
+              className: `rte-toolbar-group-items ${a.label.toLowerCase().replace(/\s+/g, "-")}`,
+              children: O(a.items || [])
+            }
+          )
+        }
+      ) : /* @__PURE__ */ l(
+        "button",
+        {
+          className: "rte-toolbar-button",
+          "data-command": a.command,
+          "data-active": "false",
+          onClick: () => k(a.command),
+          title: a.label,
+          children: D(a.icon, a.command)
+        }
+      )
+    },
+    x
+  ));
+  return /* @__PURE__ */ N(F, { children: [
+    /* @__PURE__ */ N("div", { className: "rte-toolbar-wrapper", style: Q, children: [
+      /* @__PURE__ */ N("div", { className: "rte-toolbar", ref: p, children: [
+        /* @__PURE__ */ l("div", { className: "rte-toolbar-items-container", ref: y, children: O(w) }),
+        s !== null && s < w.length && /* @__PURE__ */ l(
+          "button",
+          {
+            ref: C,
+            className: `rte-toolbar-more-button ${b ? "active" : ""}`,
+            onClick: () => u(!b),
+            title: "Show more options",
+            "aria-label": "More toolbar options",
+            children: "☰"
+          }
+        )
+      ] }),
+      s !== null && s < w.length && /* @__PURE__ */ l(
+        "div",
+        {
+          className: `rte-toolbar-expanded-row ${b ? "show" : ""}`,
+          children: w.map(
+            (n, a) => a >= (s || 0) && /* @__PURE__ */ l("div", { className: "rte-toolbar-item", children: n.type === "dropdown" ? /* @__PURE__ */ N("div", { className: "rte-toolbar-dropdown", children: [
+              /* @__PURE__ */ N(
+                "button",
+                {
+                  className: "rte-toolbar-button",
+                  "data-command": n.command,
+                  "data-active": "false",
+                  onClick: () => A(n.command),
+                  children: [
+                    n.label,
+                    " ▼"
+                  ]
+                }
+              ),
+              i === n.command && /* @__PURE__ */ l("div", { className: "rte-toolbar-dropdown-menu", children: n.options?.map((x) => /* @__PURE__ */ l(
+                "div",
+                {
+                  className: "rte-toolbar-dropdown-item",
+                  onClick: () => k(n.command, x.value),
+                  children: x.label
+                },
+                x.value
+              )) })
+            ] }) : n.type === "inline-menu" ? /* @__PURE__ */ l(
+              "button",
+              {
+                ref: L(n.command),
+                className: "rte-toolbar-button",
+                "data-command": n.command,
+                "data-active": "false",
+                onClick: () => M(n.command),
+                title: n.label,
+                children: D(n.icon, n.command)
+              }
+            ) : n.type === "input" ? /* @__PURE__ */ l(
+              "input",
+              {
+                type: "text",
+                className: "rte-toolbar-input",
+                placeholder: n.placeholder,
+                onChange: (x) => k(n.command, x.target.value),
+                onKeyDown: (x) => {
+                  x.key === "Enter" && k(
+                    n.command,
+                    x.target.value
+                  );
+                },
+                title: n.label
+              }
+            ) : /* @__PURE__ */ l(
+              "button",
+              {
+                className: "rte-toolbar-button",
+                "data-command": n.command,
+                "data-active": "false",
+                onClick: () => k(n.command),
+                title: n.label,
+                children: D(n.icon, n.command)
+              }
+            ) }, a)
+          )
+        }
+      )
+    ] }),
+    w.map((n) => n.type === "inline-menu" ? /* @__PURE__ */ l(
+      oe,
+      {
+        isOpen: m === n.command,
+        options: n.options || [],
+        onSelect: (a) => I(n.command, a),
+        onClose: () => f(null),
+        anchorRef: L(n.command)
+      },
+      `menu-${n.command}`
+    ) : null)
+  ] });
+};
+function re(e, t) {
+  const d = E(), c = E("");
+  return T(() => {
+    if (!t?.enabled) return;
+    const r = t.intervalMs || 3e4, m = t.storageKey || "rte-autosave", f = t.provider || "localStorage", g = async () => {
+      const o = e();
+      if (o !== c.current) {
+        if (c.current = o, f === "localStorage")
+          try {
+            localStorage.setItem(m, o), localStorage.setItem(`${m}-timestamp`, Date.now().toString()), console.log("[Autosave] Content saved to localStorage");
+          } catch (s) {
+            console.error("[Autosave] Failed to save to localStorage:", s);
+          }
+        else if (f === "api" && t.apiUrl)
+          try {
+            await fetch(t.apiUrl, {
+              method: "POST",
+              headers: {
+                "Content-Type": "application/json"
+              },
+              body: JSON.stringify({ content: o, timestamp: Date.now() })
+            }), console.log("[Autosave] Content saved to API");
+          } catch (s) {
+            console.error("[Autosave] Failed to save to API:", s);
+          }
+      }
+    };
+    return d.current = setInterval(g, r), () => {
+      d.current && clearInterval(d.current);
+    };
+  }, [t?.enabled, t?.intervalMs, t?.storageKey, t?.provider, t?.apiUrl, e]), { restore: () => {
+    if (!t?.enabled) return null;
+    const r = t.storageKey || "rte-autosave";
+    if ((t.provider || "localStorage") === "localStorage")
+      try {
+        const f = localStorage.getItem(r), g = localStorage.getItem(`${r}-timestamp`);
+        if (f && g)
+          return console.log("[Autosave] Restored from localStorage, saved at:", new Date(parseInt(g))), f;
+      } catch (f) {
+        console.error("[Autosave] Failed to restore from localStorage:", f);
+      }
+    return null;
+  } };
+}
+const ae = [
+  "p",
+  "br",
+  "strong",
+  "em",
+  "u",
+  "s",
+  "b",
+  "i",
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  "ul",
+  "ol",
+  "li",
+  "a",
+  "img",
+  "video",
+  "audio",
+  "table",
+  "thead",
+  "tbody",
+  "tr",
+  "th",
+  "td",
+  "blockquote",
+  "pre",
+  "code",
+  "span",
+  "div",
+  "sup",
+  "sub",
+  "hr"
+], le = {
+  "*": ["class", "style", "id", "data-*"],
+  a: ["href", "target", "rel", "title"],
+  img: ["src", "alt", "width", "height", "loading"],
+  video: ["src", "controls", "width", "height", "autoplay", "loop", "muted"],
+  audio: ["src", "controls", "autoplay", "loop", "muted"],
+  table: ["border", "cellpadding", "cellspacing"],
+  td: ["colspan", "rowspan", "align", "valign"],
+  th: ["colspan", "rowspan", "align", "valign"]
+};
+function G(e, t, d) {
+  if (t?.sanitize === !1)
+    return e;
+  const c = t?.allowedTags && t.allowedTags.length > 0 ? t.allowedTags : ae, i = t?.allowedAttributes || le, r = document.createElement("div");
+  return r.innerHTML = e, X(r, c, i), r.innerHTML;
+}
+function X(e, t, d) {
+  const c = Array.from(e.childNodes);
+  for (const i of c)
+    if (i.nodeType === Node.ELEMENT_NODE) {
+      const r = i, m = r.tagName.toLowerCase();
+      if (!t.includes(m)) {
+        for (; r.firstChild; )
+          e.insertBefore(r.firstChild, r);
+        e.removeChild(r);
+        continue;
+      }
+      ie(r, d), X(r, t, d);
+    } else {
+      if (i.nodeType === Node.TEXT_NODE)
+        continue;
+      e.removeChild(i);
+    }
+}
+function ie(e, t) {
+  const d = e.tagName.toLowerCase(), c = Array.from(e.attributes), i = t[d] || [], r = t["*"] || [], m = [...i, ...r];
+  for (const f of c) {
+    const g = f.name.toLowerCase();
+    let o = !1;
+    m.includes(g) && (o = !0);
+    for (const s of m)
+      if (s.endsWith("*")) {
+        const h = s.slice(0, -1);
+        if (g.startsWith(h)) {
+          o = !0;
+          break;
+        }
+      }
+    (g.startsWith("on") || // Event handlers
+    g === "javascript:" || g === "href" && f.value.trim().toLowerCase().startsWith("javascript:") || g === "src" && f.value.trim().toLowerCase().startsWith("javascript:")) && (o = !1), o || e.removeAttribute(f.name);
+  }
+  e.hasAttribute("href") && (e.getAttribute("href") || "").trim().toLowerCase().startsWith("javascript:") && e.removeAttribute("href"), e.hasAttribute("src") && (e.getAttribute("src") || "").trim().toLowerCase().startsWith("javascript:") && e.removeAttribute("src");
+}
+function ce(e, t, d) {
+  return d?.sanitizeOnPaste === !1 ? e : G(e, t);
+}
+function se(e, t, d) {
+  return d?.sanitizeOnInput === !1 ? e : G(e, t);
+}
+const de = ({
+  editor: e,
+  defaultValue: t,
+  value: d,
+  onChange: c,
+  pasteConfig: i,
+  contentConfig: r,
+  securityConfig: m,
+  performanceConfig: f,
+  autosaveConfig: g
+}) => {
+  const o = E(null), s = d !== void 0, h = E(), { restore: b } = re(
+    () => o.current?.innerHTML || "",
+    g
+  );
+  return T(() => {
+    if (!o.current) return;
+    const u = b(), v = u || d || t;
+    v && o.current.innerHTML !== v && (o.current.innerHTML = v, u && c && c(u));
+  }, []), T(() => {
+    !o.current || !s || d !== o.current.innerHTML && (o.current.innerHTML = d);
+  }, [d, s]), T(() => {
+    if (!o.current) return;
+    const u = () => {
+      if (!o.current || !c) return;
+      let C = o.current.innerHTML;
+      if (m?.sanitizeOnInput !== !1 && r?.sanitize !== !1 && (C = se(C, r, m), C !== o.current.innerHTML)) {
+        const w = window.getSelection(), L = w && w.rangeCount > 0 ? w.getRangeAt(0) : null;
+        if (o.current.innerHTML = C, L && w)
+          try {
+            w.removeAllRanges(), w.addRange(L);
+          } catch {
+          }
+      }
+      f?.debounceInputMs ? (h.current && clearTimeout(h.current), h.current = setTimeout(() => {
+        c(C);
+      }, f.debounceInputMs)) : c(C);
+    }, v = (C) => {
+      C.preventDefault();
+      let w = C.clipboardData?.getData("text/html");
+      const L = C.clipboardData?.getData("text/plain");
+      if (i?.clean || !i?.keepFormatting) {
+        L && document.execCommand("insertText", !1, L);
+        return;
+      }
+      if (w) {
+        m?.sanitizeOnPaste !== !1 && r?.sanitize !== !1 && (w = ce(w, r, m));
+        const k = window.getSelection();
+        if (k && k.rangeCount > 0) {
+          const A = k.getRangeAt(0);
+          A.deleteContents();
+          const M = document.createElement("div");
+          M.innerHTML = w;
+          const I = document.createDocumentFragment();
+          for (; M.firstChild; )
+            I.appendChild(M.firstChild);
+          A.insertNode(I), A.collapse(!1), k.removeAllRanges(), k.addRange(A);
+        }
+      } else L && document.execCommand("insertText", !1, L);
+    }, p = (C) => {
+      const w = C.target;
+      (w.tagName === "IMG" || w.tagName === "VIDEO") && (w.style.resize = "both", w.style.overflow = "auto", w.style.display = "inline-block");
+    }, y = o.current;
+    return y.addEventListener("input", u), y.addEventListener("paste", v), y.addEventListener("click", p), y.focus(), () => {
+      h.current && clearTimeout(h.current), y.removeEventListener("input", u), y.removeEventListener("paste", v), y.removeEventListener("click", p);
+    };
+  }, [e, c, i, r, m, f]), T(() => {
+    if (!o.current || typeof window > "u") return;
+    const u = new _(), v = o.current, p = (y) => {
+      u.handleKeyDown(y, (C, w) => {
+        typeof window < "u" && window.executeEditorCommand && window.executeEditorCommand(C, w);
+      });
+    };
+    return v.addEventListener("keydown", p), () => {
+      v.removeEventListener("keydown", p);
+    };
+  }, []), /* @__PURE__ */ l(
+    "div",
+    {
+      ref: o,
+      contentEditable: !0,
+      suppressContentEditableWarning: !0,
+      className: "rte-content",
+      style: {
+        minHeight: "200px",
+        maxHeight: "100%",
+        padding: "16px",
+        outline: "none",
+        border: "1px solid #ddd",
+        borderRadius: "4px",
+        fontSize: "14px",
+        lineHeight: "1.5",
+        overflow: "auto",
+        flex: 1,
+        boxSizing: "border-box",
+        wordWrap: "break-word",
+        overflowWrap: "break-word"
+      },
+      children: /* @__PURE__ */ l("p", { children: /* @__PURE__ */ l("br", {}) })
+    }
+  );
+}, ue = ({
+  editor: e,
+  isEnabled: t
+}) => {
+  const [d, c] = R(!1), [i, r] = R({ top: 0, left: 0 }), m = E(null), f = E(null), g = E(null), o = E(null);
+  T(() => {
+    if (!t) {
+      c(!1);
+      return;
+    }
+    o.current = m.current?.closest("[data-editora-editor]");
+    const h = () => {
+      g.current && clearTimeout(g.current);
+      const u = window.getSelection();
+      if (!u || u.rangeCount === 0) {
+        c(!1), f.current = null;
+        return;
+      }
+      const v = u.getRangeAt(0), p = u.toString().trim(), y = o.current?.querySelector(".rte-content");
+      if (!y || !y.contains(v.commonAncestorContainer)) {
+        c(!1), f.current = null;
+        return;
+      }
+      if (p.length > 0) {
+        const C = v.getBoundingClientRect(), w = y.getBoundingClientRect(), L = 300;
+        if (C && w) {
+          const k = C.top - 50;
+          let A = C.left + C.width / 2;
+          const M = L / 2, I = w.left, D = w.right;
+          A - M < I && (A = I + M + 10), A + M > D && (A = D - M - 10), r({ top: k, left: A }), g.current = setTimeout(() => {
+            c(!0), f.current = v.cloneRange();
+          }, 300);
+        }
+      } else
+        c(!1), f.current = null;
+    }, b = (u) => {
+      m.current && !m.current.contains(u.target) && (window.getSelection(), o.current?.querySelector(".rte-content")?.contains(u.target) || (c(!1), f.current = null));
+    };
+    return document.addEventListener("selectionchange", h), document.addEventListener("mousedown", b), document.addEventListener("keydown", (u) => {
+      u.key === "Escape" && (c(!1), f.current = null);
+    }), () => {
+      document.removeEventListener("selectionchange", h), document.removeEventListener("mousedown", b), g.current && clearTimeout(g.current);
+    };
+  }, [t]);
+  const s = (h, b) => {
+    if (!f.current) return;
+    const u = o.current?.querySelector(".rte-content");
+    u && u.focus(), {
+      toggleBold: () => document.execCommand("bold", !1),
+      toggleItalic: () => document.execCommand("italic", !1),
+      toggleUnderline: () => document.execCommand("underline", !1),
+      toggleStrikethrough: () => document.execCommand("strikeThrough", !1),
+      createLink: () => {
+        typeof window < "u" && window.executeEditorCommand && window.executeEditorCommand("openLinkDialog");
+      },
+      clearFormatting: () => {
+        document.execCommand("removeFormat", !1), document.execCommand("unlink", !1);
+      },
+      toggleCode: () => {
+        const p = window.getSelection();
+        if (p && p.rangeCount > 0) {
+          const y = p.getRangeAt(0), C = document.createElement("code");
+          y.surroundContents(C);
+        }
+      },
+      setBlockType: () => {
+        if (b === "blockquote") {
+          const p = window.getSelection();
+          if (p && p.rangeCount > 0) {
+            const y = p.getRangeAt(0);
+            (y.commonAncestorContainer.nodeType === Node.TEXT_NODE ? y.commonAncestorContainer.parentElement : y.commonAncestorContainer)?.closest?.("blockquote") ? document.execCommand("formatBlock", !1, "p") : document.execCommand("formatBlock", !1, "blockquote");
+          }
+        } else b && document.execCommand("formatBlock", !1, b);
+      }
+    }[h]?.(), c(!1), f.current = null, u && u.focus();
+  };
+  return !t || !d ? null : /* @__PURE__ */ N(
+    "div",
+    {
+      ref: m,
+      className: "floating-toolbar",
+      style: {
+        position: "fixed",
+        top: `${i.top}px`,
+        left: `${i.left}px`,
+        transform: "translateX(-50%)",
+        zIndex: 1e3,
+        background: "white",
+        border: "1px solid #e1e5e9",
+        borderRadius: "6px",
+        boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
+        padding: "6px",
+        display: "flex",
+        gap: "4px",
+        alignItems: "center"
+      },
+      children: [
+        /* @__PURE__ */ l(
+          "button",
+          {
+            className: "floating-toolbar-btn",
+            onClick: () => s("toggleBold"),
+            title: "Bold (Ctrl+B)",
+            children: /* @__PURE__ */ l("strong", { children: "B" })
+          }
+        ),
+        /* @__PURE__ */ l(
+          "button",
+          {
+            className: "floating-toolbar-btn",
+            onClick: () => s("toggleItalic"),
+            title: "Italic (Ctrl+I)",
+            children: /* @__PURE__ */ l("em", { children: "I" })
+          }
+        ),
+        /* @__PURE__ */ l(
+          "button",
+          {
+            className: "floating-toolbar-btn",
+            onClick: () => s("toggleUnderline"),
+            title: "Underline (Ctrl+U)",
+            children: /* @__PURE__ */ l("u", { children: "U" })
+          }
+        ),
+        /* @__PURE__ */ l(
+          "button",
+          {
+            className: "floating-toolbar-btn",
+            onClick: () => s("toggleStrikethrough"),
+            title: "Strikethrough",
+            children: /* @__PURE__ */ l("s", { children: "S" })
+          }
+        ),
+        /* @__PURE__ */ l("div", { className: "floating-toolbar-separator" }),
+        /* @__PURE__ */ l(
+          "button",
+          {
+            className: "floating-toolbar-btn",
+            onClick: () => s("clearFormatting"),
+            title: "Clear Formatting",
+            children: "⌫"
+          }
+        ),
+        /* @__PURE__ */ l(
+          "button",
+          {
+            className: "floating-toolbar-btn",
+            onClick: () => s("createLink"),
+            title: "Insert Link",
+            children: "🔗"
+          }
+        ),
+        /* @__PURE__ */ l(
+          "button",
+          {
+            className: "floating-toolbar-btn",
+            onClick: () => s("toggleCode"),
+            title: "Code",
+            children: "Code"
+          }
+        ),
+        /* @__PURE__ */ l("div", { className: "floating-toolbar-separator" }),
+        /* @__PURE__ */ l(
+          "button",
+          {
+            className: "floating-toolbar-btn",
+            onClick: () => s("setBlockType", "blockquote"),
+            title: "Quote",
+            children: "❝"
+          }
+        )
+      ]
+    }
+  );
+}, fe = ({
+  plugins: e,
+  children: t
+}) => {
+  const d = e.filter((i) => i.context?.provider);
+  return d.length === 0 ? /* @__PURE__ */ l(F, { children: t }) : d.reduce(
+    (i, r) => {
+      const m = r.context.provider;
+      return /* @__PURE__ */ l(m, { children: i }, r.name);
+    },
+    /* @__PURE__ */ l(F, { children: t })
+  );
+}, me = {
+  toolbar: {
+    items: [],
+    floating: !1,
+    sticky: !1
+  },
+  menubar: {
+    enabled: !1,
+    items: []
+  },
+  contextMenu: {
+    enabled: !0
+  },
+  media: {
+    uploadUrl: "",
+    libraryUrl: "",
+    maxFileSize: 10 * 1024 * 1024,
+    // 10MB
+    allowedTypes: ["image/jpeg", "image/png", "image/gif", "image/webp"],
+    headers: {},
+    withCredentials: !1
+  },
+  paste: {
+    clean: !0,
+    keepFormatting: !1,
+    convertWord: !0
+  },
+  history: {
+    maxSteps: 100,
+    debounceMs: 300
+  },
+  language: {
+    locale: "en",
+    direction: "ltr"
+  },
+  spellcheck: {
+    enabled: !1,
+    provider: "browser",
+    apiUrl: "",
+    apiHeaders: {}
+  },
+  autosave: {
+    enabled: !1,
+    intervalMs: 3e4,
+    // 30 seconds
+    storageKey: "rte-autosave",
+    provider: "localStorage",
+    apiUrl: ""
+  },
+  accessibility: {
+    enableARIA: !0,
+    keyboardNavigation: !0,
+    checker: !1
+  },
+  performance: {
+    debounceInputMs: 100,
+    viewportOnlyScan: !0
+  },
+  content: {
+    allowedTags: [],
+    allowedAttributes: {},
+    sanitize: !0
+  },
+  security: {
+    sanitizeOnPaste: !0,
+    sanitizeOnInput: !0
+  }
+};
+function J(e, t) {
+  const d = { ...e };
+  for (const c in t) {
+    const i = t[c], r = d[c];
+    i !== void 0 && (typeof i == "object" && i !== null && !Array.isArray(i) && typeof r == "object" && r !== null && !Array.isArray(r) ? d[c] = J(r, i) : d[c] = i);
+  }
+  return d;
+}
+function ge(e) {
+  const t = J(me, {
+    toolbar: e.toolbar,
+    menubar: e.menubar,
+    contextMenu: e.contextMenu,
+    media: e.media,
+    paste: e.paste,
+    history: e.history,
+    language: e.language,
+    spellcheck: e.spellcheck,
+    autosave: e.autosave,
+    accessibility: e.accessibility,
+    performance: e.performance,
+    content: e.content,
+    security: e.security
+  });
+  return e.floatingToolbar !== void 0 && (t.toolbar = {
+    ...t.toolbar,
+    floating: e.floatingToolbar.enabled ?? t.toolbar.floating
+  }), e.mediaConfig && (t.media = {
+    ...t.media,
+    uploadUrl: e.mediaConfig.uploadUrl || t.media.uploadUrl,
+    libraryUrl: e.mediaConfig.libraryUrl || t.media.libraryUrl,
+    maxFileSize: e.mediaConfig.maxFileSize || t.media.maxFileSize,
+    allowedTypes: e.mediaConfig.allowedTypes || t.media.allowedTypes
+  }), {
+    ...t,
+    id: e.id,
+    className: e.className,
+    value: e.value,
+    defaultValue: e.defaultValue,
+    onChange: e.onChange,
+    onInit: e.onInit,
+    onDestroy: e.onDestroy,
+    plugins: Array.isArray(e.plugins) ? e.plugins.filter((c) => typeof c != "string") : [],
+    pluginConfig: e.pluginConfig || {}
+  };
+}
+const B = /* @__PURE__ */ new Map();
+typeof window < "u" && (window.registerEditorCommand = (e, t) => {
+  B.set(e, t);
+}, window.executeEditorCommand = (e, t) => {
+  const d = B.get(e);
+  return d ? d(t) : (console.warn(`No handler registered for command: ${e}`), !1);
+});
+const be = (e) => {
+  const t = j(() => ge(e), [
+    e.id,
+    e.className,
+    e.value,
+    e.defaultValue,
+    e.plugins,
+    e.toolbar,
+    e.menubar,
+    e.contextMenu,
+    e.media,
+    e.paste,
+    e.history,
+    e.language,
+    e.spellcheck,
+    e.autosave,
+    e.accessibility,
+    e.performance,
+    e.content,
+    e.security,
+    e.floatingToolbar,
+    e.mediaConfig
+  ]), d = E(null), c = E(null), i = E(e.onInit), r = E(e.onDestroy), m = E(null);
+  T(() => {
+    i.current = e.onInit, r.current = e.onDestroy;
+  });
+  const f = j(() => {
+    const h = new te();
+    t.plugins.forEach((u) => {
+      h.register(u), u.commands && typeof window < "u" && Object.entries(u.commands).forEach(([v, p]) => {
+        B.set(v, p);
+      });
+    });
+    const b = new ne(h);
+    return d.current = b, b;
+  }, [t.plugins]);
+  T(() => {
+    const h = {
+      getHTML: () => m.current?.querySelector(".rte-content")?.innerHTML || "",
+      setHTML: (b) => {
+        const u = m.current?.querySelector(".rte-content");
+        u && (u.innerHTML = b);
+      },
+      execCommand: (b, u) => {
+        typeof window < "u" && window.executeEditorCommand && window.executeEditorCommand(b, u);
+      },
+      registerCommand: (b, u) => {
+        typeof window < "u" && window.registerEditorCommand && window.registerEditorCommand(b, u);
+      },
+      focus: () => {
+        m.current?.querySelector(".rte-content")?.focus();
+      },
+      blur: () => {
+        m.current?.querySelector(".rte-content")?.blur();
+      },
+      destroy: () => {
+        r.current && r.current();
+      },
+      onChange: (b) => () => {
+      },
+      getState: () => ({
+        plugins: t.plugins,
+        config: t
+      }),
+      toolbar: {
+        items: f.toolbar?.items || []
+      }
+    };
+    return c.current = h, i.current && i.current(h), () => {
+      r.current && r.current();
+    };
+  }, []);
+  const g = t.toolbar.floating ?? !1, o = t.toolbar.position || "top", s = t.toolbar.sticky ?? !1;
+  return /* @__PURE__ */ l(fe, { plugins: t.plugins, children: /* @__PURE__ */ N(
+    "div",
+    {
+      ref: m,
+      id: t.id,
+      "data-editora-editor": !0,
+      className: `rte-editor ${t.className || ""}`,
+      dir: t.language.direction,
+      style: {
+        display: "flex",
+        flexDirection: "column",
+        height: "100%"
+      },
+      children: [
+        o !== "bottom" && /* @__PURE__ */ l(
+          V,
+          {
+            editor: f,
+            position: o,
+            sticky: s,
+            floating: g
+          }
+        ),
+        /* @__PURE__ */ l(
+          de,
+          {
+            editor: f,
+            defaultValue: t.defaultValue,
+            value: t.value,
+            onChange: t.onChange,
+            pasteConfig: t.paste,
+            contentConfig: t.content,
+            securityConfig: t.security,
+            performanceConfig: t.performance,
+            autosaveConfig: t.autosave
+          }
+        ),
+        o === "bottom" && /* @__PURE__ */ l(
+          V,
+          {
+            editor: f,
+            position: o,
+            sticky: s,
+            floating: g
+          }
+        ),
+        /* @__PURE__ */ l(
+          ue,
+          {
+            editor: f,
+            isEnabled: g
+          }
+        )
+      ]
+    }
+  ) });
+}, ye = (e) => /* @__PURE__ */ l(be, { ...e });
+function Ce(e = {}) {
+  const t = E(null), d = E(e.onCommand);
+  return T(() => {
+    d.current = e.onCommand;
+  }), T(() => {
+    if (typeof window > "u" || e.enabled === !1) return;
+    const c = new _(e);
+    t.current = c;
+    const i = (m) => c.handleKeyDown(m, (g, o) => {
+      d.current && d.current(g, o), typeof window < "u" && window.executeEditorCommand && window.executeEditorCommand(g, o);
+    }), r = e.editorElement || document;
+    return r && r.addEventListener("keydown", i), () => {
+      r && r.removeEventListener("keydown", i);
+    };
+  }, [e.editorElement, e.enabled, e.shortcuts, e.customShortcuts]), {
+    getShortcuts: () => t.current?.getAllShortcuts() || [],
+    getShortcutForCommand: (c) => t.current?.getShortcutForCommand(c),
+    getShortcutsHelp: () => t.current?.getShortcutsHelp() || "",
+    enable: () => t.current?.enable(),
+    disable: () => t.current?.disable(),
+    isEnabled: () => t.current?.isEnabled() || !1
+  };
+}
+export {
+  de as EditorContent,
+  ye as EditoraEditor,
+  oe as InlineMenu,
+  ye as RichTextEditor,
+  V as Toolbar,
+  ge as mergeConfig,
+  Ce as useKeyboardShortcuts
+};