reactjs-tiptap-editor 0.3.30 → 0.4.0

package/lib/SearchAndReplace.js

@@ -1,138 +1,157 @@
-import { E as _, P as M, a as $, b as N, D as P } from "./index-DI9T3iLd.js";
-import q from "scroll-into-view-if-needed";
-import { jsxs as f, jsx as o } from "react/jsx-runtime";
-import { useState as g, useEffect as E } from "react";
-import { l as k, E as d, P as B, m as j, A as F, k as A, n as O, L as I, o as y, B as T, S as W, p as K, q as R } from "./RichTextEditor-BQN2eLD_.js";
-import { u as U } from "./index-CsK90iVd.js";
+import { a as j, E as O, P as q, D as N, j as V } from "./index-kbO3iWqL.js";
+import { jsxs as g, jsx as o } from "react/jsx-runtime";
+import { useState as T, useEffect as b } from "react";
+import { P as F, o as K, A as M, f as P, p as W, L as y, q as L, B as C, S as H } from "./RichTextEditor-DGcKEUGr.js";
+import { u as U } from "./index-LmrOdnen.js";
 function z({ editor: e, ...t }) {
-  const { t: s } = U(), [c, r] = g(-1), [n, i] = g([]), [a, u] = g(""), [l, h] = g(""), [x, v] = g(!1), [b, V] = g(!1);
-  return E(() => {
-    x || (u(""), h(""), r(-1), i([]), e.commands.setSearchTerm(""), e.commands.setReplaceTerm(""));
-  }, [e, x]), E(() => {
-    x && e && e.commands && e.commands.setSearchTerm && e.commands.setSearchTerm(a);
-  }, [x, a, e]), E(() => {
-    x && e && e.commands && e.commands.setReplaceTerm && e.commands.setReplaceTerm(l);
-  }, [x, l, e]), E(() => {
-    if (!e)
-      return;
-    const m = e.extensionManager.extensions.find((S) => S.name === Y.name);
-    if (!m)
-      return;
-    const w = () => {
-      if (!x)
-        return;
-      const S = m ? m.storage.currentIndex : -1, L = m ? m.storage.results : [];
-      r((C) => C !== S ? S : C), i((C) => K(C, L) ? C : L);
-    };
-    return k(d.SEARCH_REPLCE, w), () => {
-      m && k(d.SEARCH_REPLCE, w);
-    };
-  }, [x, e]), /* @__PURE__ */ f(
-    B,
+  const { t: s } = U(), [a, l] = T(!1), [c, n] = T(""), [i, h] = T(""), [r, f] = T(!1), [x, m] = T(""), d = () => {
+    var u, I, v, S;
+    m(`${((I = (u = e == null ? void 0 : e.storage) == null ? void 0 : u.searchAndReplace) == null ? void 0 : I.resultIndex) + 1}/${(S = (v = e == null ? void 0 : e.storage) == null ? void 0 : v.searchAndReplace) == null ? void 0 : S.results.length}`);
+  };
+  b(() => {
+    e && d();
+  }, [e]);
+  const R = (u = !1) => {
+    e && (u && e.commands.resetIndex(), e.commands.setSearchTerm(c), e.commands.setReplaceTerm(i), e.commands.setCaseSensitive(r), d());
+  }, A = () => {
+    if (!e) return;
+    const { results: u, resultIndex: I } = e.storage.searchAndReplace, v = u[I];
+    if (!v) return;
+    e.commands.setTextSelection(v);
+    const { node: S } = e.view.domAtPos(
+      e.state.selection.anchor
+    );
+    S instanceof HTMLElement && S.scrollIntoView({ behavior: "smooth", block: "center" }), d();
+  };
+  b(() => {
+    c.trim() || k(), c.trim() && R(!0);
+  }, [c]), b(() => {
+    i.trim() && R();
+  }, [i]), b(() => {
+    R(!0);
+  }, [r]);
+  const w = () => {
+    e == null || e.commands.replace(), A();
+  }, B = () => {
+    e == null || e.commands.nextSearchResult(), A();
+  }, D = () => {
+    e == null || e.commands.previousSearchResult(), A();
+  }, k = () => {
+    n(""), h(""), e.commands.resetIndex(), d();
+  }, E = () => {
+    e == null || e.commands.replaceAll(), m("0/0");
+  };
+  return /* @__PURE__ */ g(
+    F,
     {
-      onOpenChange: v,
-      open: x,
+      onOpenChange: l,
+      open: a,
       children: [
         /* @__PURE__ */ o(
-          j,
+          K,
           {
             asChild: !0,
             disabled: t == null ? void 0 : t.disabled,
             children: /* @__PURE__ */ o(
-              F,
+              M,
               {
                 disabled: t == null ? void 0 : t.disabled,
                 isActive: t == null ? void 0 : t.isActive,
                 tooltip: t == null ? void 0 : t.tooltip,
-                children: /* @__PURE__ */ o(A, { name: t == null ? void 0 : t.icon })
+                tooltipOptions: t == null ? void 0 : t.tooltipOptions,
+                children: /* @__PURE__ */ o(P, { name: t == null ? void 0 : t.icon })
               }
             )
           }
         ),
-        /* @__PURE__ */ f(
-          O,
+        /* @__PURE__ */ g(
+          W,
           {
             align: "start",
             className: "richtext-w-full",
             hideWhenDetached: !0,
             side: "bottom",
             children: [
-              /* @__PURE__ */ f("div", { className: "richtext-mb-[6px] richtext-flex richtext-items-center richtext-justify-between", children: [
-                /* @__PURE__ */ o(I, { children: s("editor.search.dialog.text") }),
-                /* @__PURE__ */ o("span", { className: "richtext-font-semibold", children: n.length > 0 ? `${c + 1}/${n.length}` : "0/0" })
+              /* @__PURE__ */ g("div", { className: "richtext-mb-[6px] richtext-flex richtext-items-center richtext-justify-between", children: [
+                /* @__PURE__ */ o(y, { children: s("editor.search.dialog.text") }),
+                /* @__PURE__ */ o("span", { className: "richtext-font-semibold", children: x })
               ] }),
-              /* @__PURE__ */ f("div", { className: "richtext-mb-[10px] richtext-flex richtext-w-full richtext-max-w-sm richtext-items-center richtext-gap-1.5", children: [
+              /* @__PURE__ */ g("div", { className: "richtext-mb-[10px] richtext-flex richtext-w-full richtext-max-w-sm richtext-items-center richtext-gap-1.5", children: [
                 /* @__PURE__ */ o(
-                  y,
+                  L,
                   {
                     autoFocus: !0,
                     className: "richtext-w-full",
-                    onChange: (m) => u(m.target.value),
+                    onChange: (u) => n(u.target.value),
                     placeholder: "Text",
                     required: !0,
                     type: "text",
-                    value: a
+                    value: c
+                  }
+                ),
+                /* @__PURE__ */ o(
+                  C,
+                  {
+                    className: "richtext-flex-1",
+                    onClick: D,
+                    children: /* @__PURE__ */ o(P, { name: "ChevronUp" })
                   }
                 ),
                 /* @__PURE__ */ o(
-                  T,
+                  C,
                   {
                     className: "richtext-flex-1",
-                    disabled: n.length === 0,
-                    onClick: e.commands.goToPrevSearchResult,
-                    children: /* @__PURE__ */ o(A, { name: "ChevronUp" })
+                    onClick: B,
+                    children: /* @__PURE__ */ o(P, { name: "ChevronDown" })
                   }
                 ),
                 /* @__PURE__ */ o(
-                  T,
+                  C,
                   {
                     className: "richtext-flex-1",
-                    disabled: n.length === 0,
-                    onClick: e.commands.goToNextSearchResult,
-                    children: /* @__PURE__ */ o(A, { name: "ChevronDown" })
+                    onClick: k,
+                    children: "Clear"
                   }
                 )
               ] }),
-              /* @__PURE__ */ o(I, { className: "richtext-mb-[6px]", children: s("editor.replace.dialog.text") }),
+              /* @__PURE__ */ o(y, { className: "richtext-mb-[6px]", children: s("editor.replace.dialog.text") }),
               /* @__PURE__ */ o("div", { className: "richtext-mb-[5px] richtext-flex richtext-w-full richtext-max-w-sm richtext-items-center richtext-gap-1.5", children: /* @__PURE__ */ o("div", { className: "richtext-relative richtext-w-full richtext-max-w-sm richtext-items-center", children: /* @__PURE__ */ o(
-                y,
+                L,
                 {
                   className: "richtext-w-80",
-                  onChange: (m) => h(m.target.value),
+                  onChange: (u) => h(u.target.value),
                   placeholder: "Text",
                   required: !0,
                   type: "text",
-                  value: l
+                  value: i
                 }
               ) }) }),
-              /* @__PURE__ */ f("div", { className: "richtext-mb-[10px] richtext-flex richtext-items-center richtext-space-x-2", children: [
+              /* @__PURE__ */ g("div", { className: "richtext-mb-[10px] richtext-flex richtext-items-center richtext-space-x-2", children: [
                 /* @__PURE__ */ o(
-                  W,
+                  H,
                   {
-                    checked: b,
-                    onCheckedChange: (m) => {
-                      V(m), e.commands.setCaseSensitive(m);
+                    checked: r,
+                    onCheckedChange: (u) => {
+                      f(u), e.commands.setCaseSensitive(u);
                     }
                   }
                 ),
-                /* @__PURE__ */ o(I, { children: s("editor.replace.caseSensitive") })
+                /* @__PURE__ */ o(y, { children: s("editor.replace.caseSensitive") })
               ] }),
-              /* @__PURE__ */ f("div", { className: "richtext-flex richtext-items-center richtext-gap-[10px]", children: [
+              /* @__PURE__ */ g("div", { className: "richtext-flex richtext-items-center richtext-gap-[10px]", children: [
                 /* @__PURE__ */ o(
-                  T,
+                  C,
                   {
                     className: "richtext-flex-1",
-                    disabled: n.length === 0,
-                    onClick: e.commands.replace,
+                    onClick: w,
                     children: s("editor.replace.dialog.text")
                   }
                 ),
                 /* @__PURE__ */ o(
-                  T,
+                  C,
                   {
                     className: "richtext-flex-1",
-                    disabled: n.length === 0,
-                    onClick: e.commands.replaceAll,
+                    onClick: E,
                     children: s("editor.replaceAll.dialog.text")
                   }
                 )
@@ -146,87 +165,86 @@ function z({ editor: e, ...t }) {
 }
 const p = (e, t) => t(e.tr);
 function G(e, t, s) {
-  return RegExp(t ? e.replace(/[$()*+./?[\\\]^{|}-]/g, String.raw`\$&`) : e, s ? "gu" : "gui");
+  return RegExp(
+    t ? e.replace(/[$()*+.?[\\\]^{|}]/g, String.raw`\$&`) : e,
+    s ? "gu" : "gui"
+  );
 }
-function J(e, t, s) {
-  const c = [];
-  let r = [];
-  const n = [];
-  let i = 0;
+function J(e, t, s, a) {
+  const l = [], c = [];
+  let n = [], i = 0;
   if (!t)
-    return { decorationsToReturn: [], results: [] };
-  e == null || e.descendants((a, u) => {
-    a.isText ? r[i] ? r[i] = {
-      text: r[i].text + a.text,
-      pos: r[i].pos
-    } : r[i] = {
-      text: `${a.text}`,
-      pos: u
+    return {
+      decorationsToReturn: N.empty,
+      results: []
+    };
+  e == null || e.descendants((h, r) => {
+    h.isText ? n[i] ? n[i] = {
+      text: n[i].text + h.text,
+      pos: n[i].pos
+    } : n[i] = {
+      text: `${h.text}`,
+      pos: r
     } : i += 1;
-  }), r = r.filter(Boolean);
-  for (const { text: a, pos: u } of r) {
-    const l = [...a.matchAll(t)];
-    for (const h of l) {
-      if (h[0] === "")
-        break;
-      h.index !== void 0 && n.push({
-        from: u + h.index,
-        to: u + h.index + h[0].length
+  }), n = n.filter(Boolean);
+  for (const h of n) {
+    const { text: r, pos: f } = h, x = Array.from(r.matchAll(t)).filter(
+      ([m]) => m.trim()
+    );
+    for (const m of x) {
+      if (m[0] === "") break;
+      m.index !== void 0 && c.push({
+        from: f + m.index,
+        to: f + m.index + m[0].length
       });
     }
   }
-  for (const a of n)
-    c.push(N.inline(a.from, a.to, { class: s }));
+  for (const [h, r] of c.entries()) {
+    const f = h === a ? `${s} ${s}-current` : s, x = V.inline(r.from, r.to, {
+      class: f
+    });
+    l.push(x);
+  }
   return {
-    decorationsToReturn: c,
-    results: n
+    decorationsToReturn: N.create(e, l),
+    results: c
   };
 }
-function D(e, t, { state: s, dispatch: c }) {
-  if (!t[0])
-    return;
-  const { from: n, to: i } = t[0];
-  c && c(s.tr.insertText(e, n, i));
+function $(e, t, { state: s, dispatch: a }) {
+  if (!t[0]) return;
+  const { from: c, to: n } = t[0];
+  a && a(s.tr.insertText(e, c, n));
 }
-function Q(e, t, s, c) {
-  const r = t + 1;
-  if (!c[r])
-    return null;
-  const { from: n, to: i } = c[t], a = i - n - e.length + s, { from: u, to: l } = c[r];
-  return c[r] = {
-    to: l - a,
-    from: u - a
-  }, [a, c];
+function Q(e, t, s, a) {
+  const l = t + 1;
+  if (!a[l]) return null;
+  const { from: c, to: n } = a[t], i = n - c - e.length + s, { from: h, to: r } = a[l];
+  return a[l] = {
+    to: r - i,
+    from: h - i
+  }, [i, a];
 }
-function X(e, t, { tr: s, dispatch: c }) {
-  let r = 0, n = t.slice();
-  if (n.length === 0)
-    return !1;
-  for (let i = 0; i < n.length; i += 1) {
-    const { from: a, to: u } = n[i];
-    s.insertText(e, a, u);
-    const l = Q(e, i, r, n);
-    l && (r = l[0], n = l[1]);
-  }
-  return c(s), !0;
-}
-function H({ view: e, tr: t, searchResults: s, searchResultCurrentClass: c, gotoIndex: r }) {
-  const n = s[r];
-  if (n) {
-    const i = t.setMeta("directDecoration", {
-      fromPos: n.from,
-      toPos: n.to,
-      attrs: { class: c }
-    });
-    return e == null || e.dispatch(i), setTimeout(() => {
-      const a = window.document.querySelector(`.${c}`);
-      a && q(a, { behavior: "smooth", scrollMode: "if-needed" });
-    }, 0), !0;
+function X(e, t, { tr: s, dispatch: a }) {
+  let l = 0, c = t.slice();
+  if (c.length !== 0) {
+    for (let n = 0; n < c.length; n += 1) {
+      const { from: i, to: h } = c[n];
+      s.insertText(e, i, h);
+      const r = Q(
+        e,
+        n,
+        l,
+        c
+      );
+      r && (l = r[0], c = r[1]);
+    }
+    a(s);
   }
-  return !1;
 }
-const Y = /* @__PURE__ */ _.create({
-  name: "search",
+const Y = new j(
+  "searchAndReplacePlugin"
+), ae = O.create({
+  name: "searchAndReplace",
   addOptions() {
     var e;
     return {
@@ -234,11 +252,10 @@ const Y = /* @__PURE__ */ _.create({
       searchTerm: "",
       replaceTerm: "",
       results: [],
-      currentIndex: 0,
       searchResultClass: "search-result",
       searchResultCurrentClass: "search-result-current",
       caseSensitive: !1,
-      disableRegex: !1,
+      disableRegex: !0,
       onChange: () => {
       },
       button: ({ editor: t, t: s }) => ({
@@ -257,77 +274,72 @@ const Y = /* @__PURE__ */ _.create({
   },
   addStorage() {
     return {
+      searchTerm: "",
+      replaceTerm: "",
       results: [],
-      currentIndex: -1
+      lastSearchTerm: "",
+      caseSensitive: !1,
+      lastCaseSensitive: !1,
+      resultIndex: 0,
+      lastResultIndex: 0
     };
   },
   addCommands() {
     return {
-      setSearchTerm: (e) => ({ state: t, dispatch: s }) => (this.options.searchTerm = e, this.storage.results = [], this.storage.currentIndex = 0, R(d.SEARCH_REPLCE), p(t, s), !1),
-      setReplaceTerm: (e) => ({ state: t, dispatch: s }) => (this.options.replaceTerm = e, p(t, s), !1),
-      setCaseSensitive: (e) => ({ state: t, dispatch: s }) => (this.options.caseSensitive = e, p(t, s), !1),
-      replace: () => ({ state: e, dispatch: t }) => {
-        const { replaceTerm: s } = this.options, { currentIndex: c, results: r } = this.storage, n = r[c];
-        return n ? (D(s, [n], { state: e, dispatch: t }), this.storage.results.splice(c, 1)) : (D(s, r, { state: e, dispatch: t }), this.storage.results.shift()), R(d.SEARCH_REPLCE), p(e, t), !1;
+      setSearchTerm: (e) => ({ editor: t, state: s, dispatch: a }) => (t.storage.searchAndReplace.searchTerm = e, p(s, a), !1),
+      setReplaceTerm: (e) => ({ editor: t, state: s, dispatch: a }) => (t.storage.searchAndReplace.replaceTerm = e, p(s, a), !1),
+      setCaseSensitive: (e) => ({ editor: t, state: s, dispatch: a }) => (t.storage.searchAndReplace.caseSensitive = e, p(s, a), !1),
+      resetIndex: () => ({ editor: e, state: t, dispatch: s }) => (e.storage.searchAndReplace.resultIndex = 0, p(t, s), !1),
+      nextSearchResult: () => ({ editor: e }) => {
+        const { results: t, resultIndex: s } = e.storage.searchAndReplace, a = s + 1;
+        return t[a] ? e.storage.searchAndReplace.resultIndex = a : e.storage.searchAndReplace.resultIndex = 0, !1;
       },
-      replaceAll: () => ({ state: e, tr: t, dispatch: s }) => {
-        const { replaceTerm: c } = this.options, { results: r } = this.storage;
-        return X(c, r, { tr: t, dispatch: s }), this.storage.currentIndex = -1, this.storage.results = [], R(d.SEARCH_REPLCE), p(e, s), !1;
+      previousSearchResult: () => ({ editor: e }) => {
+        const { results: t, resultIndex: s } = e.storage.searchAndReplace, a = s - 1;
+        return t[a] ? e.storage.searchAndReplace.resultIndex = a : e.storage.searchAndReplace.resultIndex = t.length - 1, !1;
       },
-      goToPrevSearchResult: () => ({ view: e, tr: t }) => {
-        const { searchResultCurrentClass: s } = this.options, { currentIndex: c, results: r } = this.storage, n = (c + r.length - 1) % r.length;
-        return this.storage.currentIndex = n, R(d.SEARCH_REPLCE), H({
-          view: e,
-          tr: t,
-          searchResults: r,
-          searchResultCurrentClass: s,
-          gotoIndex: n
-        });
+      replace: () => ({ editor: e, state: t, dispatch: s }) => {
+        const { replaceTerm: a, results: l, resultIndex: c } = e.storage.searchAndReplace, n = l[c];
+        return n ? ($(a, [n], { state: t, dispatch: s }), e.storage.searchAndReplace.results.splice(c, 1)) : ($(a, l, { state: t, dispatch: s }), e.storage.searchAndReplace.results.shift()), p(t, s), !1;
       },
-      goToNextSearchResult: () => ({ view: e, tr: t }) => {
-        const { searchResultCurrentClass: s } = this.options, { currentIndex: c, results: r } = this.storage, n = (c + 1) % r.length;
-        return this.storage.currentIndex = n, this.options.onChange && this.options.onChange(), R(d.SEARCH_REPLCE), H({
-          view: e,
-          tr: t,
-          searchResults: r,
-          searchResultCurrentClass: s,
-          gotoIndex: n
-        });
+      replaceAll: () => ({ editor: e, tr: t, state: s, dispatch: a }) => {
+        const { replaceTerm: l, results: c } = e.storage.searchAndReplace;
+        return X(l, c, { tr: t, dispatch: a }), e.storage.searchAndReplace.resultIndex = 0, e.storage.searchAndReplace.results = [], p(s, a), !1;
       }
     };
   },
   addProseMirrorPlugins() {
-    const e = this;
+    const e = this.editor, { searchResultClass: t, disableRegex: s } = this.options, a = (n) => e.storage.searchAndReplace.lastSearchTerm = n, l = (n) => e.storage.searchAndReplace.lastCaseSensitive = n, c = (n) => e.storage.searchAndReplace.lastResultIndex = n;
     return [
-      new M({
-        key: new $("search"),
+      new q({
+        key: Y,
         state: {
-          init() {
-            return P.empty;
-          },
-          apply(t) {
-            const { doc: s, docChanged: c } = t, { searchTerm: r, searchResultClass: n, searchResultCurrentClass: i, disableRegex: a, caseSensitive: u } = e.options;
-            if (c || r) {
-              const { decorationsToReturn: l, results: h } = J(
-                s,
-                G(r, a, u),
-                n
-              );
-              if (e.storage.results = h, e.storage.currentIndex > h.length - 1 && (e.storage.currentIndex = 0), R(d.SEARCH_REPLCE), t.getMeta("directDecoration")) {
-                const { fromPos: x, toPos: v, attrs: b } = t.getMeta("directDecoration");
-                l.push(N.inline(x, v, b));
-              } else
-                h.length > 0 && (l[0] = N.inline(h[0].from, h[0].to, {
-                  class: i
-                }));
-              return P.create(s, l);
-            }
-            return P.empty;
+          init: () => N.empty,
+          apply({ doc: n, docChanged: i }, h) {
+            const {
+              searchTerm: r,
+              lastSearchTerm: f,
+              caseSensitive: x,
+              lastCaseSensitive: m,
+              resultIndex: d,
+              lastResultIndex: R
+            } = e.storage.searchAndReplace;
+            if (!i && f === r && m === x && R === d)
+              return h;
+            if (a(r), l(x), c(d), !r)
+              return e.storage.searchAndReplace.results = [], N.empty;
+            const { decorationsToReturn: A, results: w } = J(
+              n,
+              G(r, s, x),
+              t,
+              d
+            );
+            return e.storage.searchAndReplace.results = w, A;
           }
         },
         props: {
-          decorations(t) {
-            return this.getState(t);
+          decorations(n) {
+            return this.getState(n);
           }
         }
       })
@@ -335,5 +347,6 @@ const Y = /* @__PURE__ */ _.create({
   }
 });
 export {
-  Y as SearchAndReplace
+  ae as SearchAndReplace,
+  Y as searchAndReplacePluginKey
 };

package/lib/Selection.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./index-ByRfqzMr.cjs"),o=e.Extension.create({name:"selection",addProseMirrorPlugins(){const{editor:i}=this;return[new e.Plugin({key:new e.PluginKey("selection"),props:{decorations(n){return n.selection.empty||i.isFocused===!0?null:e.DecorationSet.create(n.doc,[e.Decoration.inline(n.selection.from,n.selection.to,{class:"selection"})])}}})]}});exports.Selection=o;exports.default=o;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./index-DF2Lp4HZ.cjs"),o=e.Extension.create({name:"selection",addProseMirrorPlugins(){const{editor:i}=this;return[new e.Plugin({key:new e.PluginKey("selection"),props:{decorations(n){return n.selection.empty||i.isFocused===!0?null:e.DecorationSet.create(n.doc,[e.Decoration.inline(n.selection.from,n.selection.to,{class:"selection"})])}}})]}});exports.Selection=o;exports.default=o;