Search tweaks

packages/super-editor/src/components/toolbar/defaultItems.js

@@ -281,7 +281,7 @@ export const makeDefaultItems = (superToolbar, isDev = false, windowWidth, role,
   const renderSearchDropdown = () => {
 
     const handleSubmit = ({ value }) => {
-      superToolbar.activeEditor.doSearch(value);
+      superToolbar.activeEditor.commands.search(value);
     };
 
     return h('div', {}, [

packages/super-editor/src/core/Editor.js

@@ -1,7 +1,6 @@
 import { EditorState } from 'prosemirror-state';
 import { EditorView } from 'prosemirror-view';
 import { DOMParser, DOMSerializer } from 'prosemirror-model';
-import { search, SearchQuery, setSearchState, getMatchHighlights } from 'prosemirror-search';
 import { yXmlFragmentToProseMirrorRootNode } from 'y-prosemirror';
 import { helpers } from '@core/index.js';
 import { EventEmitter } from './EventEmitter.js';
@@ -232,30 +231,6 @@ export class Editor extends EventEmitter {
     this.options.onFocus({ editor, event });
   }
 
-  goToFirstMatch() {
-    const highlights = getMatchHighlights(this.view.state);
-    if (!highlights || !highlights.children?.length) return;
-
-    const match = highlights.children.find(item => item.local);
-    const firstSearchItemPosition = highlights.children[0] + match.local[0].from + 1;
-    this.view.domAtPos(firstSearchItemPosition)?.node?.scrollIntoView(true);
-  }
-
-  doSearch(text) {
-    const query = new SearchQuery({
-      search: text,
-      caseSensitive: false,
-      regexp: false,
-      wholeWord: false 
-    });
-    const tr = this.view.state.tr;
-    setSearchState(tr, query);
-    this.view.dispatch(tr);
-
-    this.goToFirstMatch();
-    return getMatchHighlights(this.view.state);
-  }
-
   setToolbar(toolbar) {
     this.toolbar = toolbar;
   }
@@ -670,13 +645,8 @@ export class Editor extends EventEmitter {
       state: EditorState.create(state),
     });
 
-    const searchPlugin = search();
-
     const newState = this.state.reconfigure({
-      plugins: [
-        ...this.extensionService.plugins,
-        searchPlugin,
-      ],
+      plugins: [...this.extensionService.plugins],
     });
 
     this.view.updateState(newState);

packages/super-editor/src/extensions/index.js

@@ -56,6 +56,7 @@ import { PopoverPlugin } from './popover-plugin/index.js';
 import { TrackChanges } from './track-changes/index.js';
 import { Pagination } from './pagination/index.js';
 import { LinkedStyles } from './linked-styles/linked-styles.js';
+import { Search } from './search/index.js';
 
 // Helpers
 import { trackChangesHelpers } from './track-changes/index.js';
@@ -161,6 +162,7 @@ const getStarterExtensions = () => {
     ShapeContainer,
     ShapeTextbox,
     ContentBlock,
+    Search,
   ];
 };
 
@@ -220,4 +222,5 @@ export {
   AiMark,
   AiAnimationMark,
   AiPlugin,
+  Search,
 };

packages/super-editor/src/extensions/search/index.js

@@ -0,0 +1 @@
+export * from './search.js';

packages/super-editor/src/extensions/search/search.js

@@ -0,0 +1,45 @@
+import { Extension } from '@core/Extension.js';
+import { search, SearchQuery, setSearchState, getMatchHighlights } from 'prosemirror-search';
+
+
+export const Search = Extension.create({
+  addPmPlugins() {
+    return [search()];
+  },
+
+  addCommands() {
+    return {
+      goToFirstMatch: () => ({ state, editor, dispatch }) => {
+        const highlights = getMatchHighlights(state);
+        if (!highlights || !highlights.children?.length) return;
+
+        const match = highlights.children.find(item => item.local);
+        const firstSearchItemPosition = highlights.children[0] + match.local[0].from + 1;
+        editor.view.domAtPos(firstSearchItemPosition)?.node?.scrollIntoView(true);
+      },
+      search: (text) => ({ state, dispatch }) => {
+        const query = new SearchQuery({
+          search: text,
+          caseSensitive: false,
+          regexp: false,
+          wholeWord: false,
+        });
+        const tr = state.tr;
+        setSearchState(tr, query);
+
+        const newState = state.apply(tr);
+        const decoSet = getMatchHighlights(newState);
+        const decorations = decoSet ? decoSet.find() : [];
+
+        dispatch(tr);
+
+        return decorations.map(deco => ({
+          from: deco.from,
+          to:   deco.to,
+          text: newState.doc.textBetween(deco.from, deco.to)
+        }));
+      }
+
+    }
+  }
+});

packages/superdoc/src/core/SuperDoc.js

@@ -516,6 +516,10 @@ export class SuperDoc extends EventEmitter {
     }
   }
 
+  search(text) {
+    return this.activeEditor?.commands.search(text);
+  }
+
   /**
    * Set the document to locked or unlocked
    * @param {boolean} lock