@jupyterlab/codemirror 4.0.0-alpha.19 → 4.0.0-alpha.20

package/lib/searchprovider.js

@@ -1,426 +1,293 @@
 // Copyright (c) Jupyter Development Team.
 // Distributed under the terms of the Modified BSD License.
-/*
-  Parts of the implementation of the search in this file were derived from
-  CodeMirror's search at:
-  https://github.com/codemirror/CodeMirror/blob/c2676685866c571a1c9c82cb25018cc08b4d42b2/addon/search/search.js
-  which is licensed with the following license:
-
-  MIT License
-
-  Copyright (C) 2017 by Marijn Haverbeke <marijnh@gmail.com> and others
-
-  Permission is hereby granted, free of charge, to any person obtaining a copy
-  of this software and associated documentation files (the "Software"), to deal
-  in the Software without restriction, including without limitation the rights
-  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-  copies of the Software, and to permit persons to whom the Software is
-  furnished to do so, subject to the following conditions:
-
-  The above copyright notice and this permission notice shall be included in
-  all copies or substantial portions of the Software.
-
-  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-  THE SOFTWARE.
-*/
-import { GenericSearchProvider, TextSearchEngine } from '@jupyterlab/documentsearch';
 import { JSONExt } from '@lumino/coreutils';
-import { Signal } from '@lumino/signaling';
-import { RegExpCursor } from '@codemirror/search';
-import { Compartment, StateEffect, StateField } from '@codemirror/state';
+import { StateEffect, StateField } from '@codemirror/state';
 import { Decoration, EditorView } from '@codemirror/view';
+import { GenericSearchProvider, TextSearchEngine } from '@jupyterlab/documentsearch';
+import { Signal } from '@lumino/signaling';
 /**
- * CodeMirror search provider for file editor
+ * Search provider for editors.
  */
-export class CodeMirrorSearchProvider {
-    constructor(editor) {
-        /**
-         * Set to true if the widget under search is read-only, false
-         * if it is editable.  Will be used to determine whether to show
-         * the replace option.
-         */
-        this.isReadOnly = false;
-        this._matchState = {};
-        this._changed = new Signal(this);
-        this._disposed = false;
-        this.editor = editor;
-        this._highlightEffect = StateEffect.define({
-            map: (value, mapping) => ({
-                matches: value.matches.map(v => ({
-                    text: v.text,
-                    position: mapping.mapPos(v.position)
-                }))
-            })
-        });
-        this._highlightMark = Decoration.mark({ class: 'cm-searching' });
-        this._highlightField = StateField.define({
-            create: () => {
-                return Decoration.none;
-            },
-            update: (highlights, transaction) => {
-                highlights = highlights.map(transaction.changes);
-                for (let ef of transaction.effects) {
-                    if (ef.is(this._highlightEffect)) {
-                        const e = ef;
-                        if (e.value.matches.length) {
-                            highlights = highlights.update({
-                                add: e.value.matches.map(m => this._highlightMark.range(m.position, m.position + m.text.length))
-                            });
-                        }
-                        else {
-                            highlights = Decoration.none;
-                        }
-                    }
-                }
-                return highlights;
-            },
-            provide: f => EditorView.decorations.from(f)
-        });
-        this._listener = new Compartment();
-        this.editor.injectExtension(this._listener.of([]));
-    }
+export class EditorSearchProvider {
     /**
-     * Whether the search provider is disposed or not.
+     * Constructor
      */
-    get isDisposed() {
-        return this._disposed;
+    constructor() {
+        /**
+         * Current match index
+         */
+        this.currentIndex = null;
+        /**
+         * Current search query
+         */
+        this.query = null;
+        this._isActive = true;
+        this._isDisposed = false;
+        this._cmHandler = null;
+        this.currentIndex = null;
+        this._stateChanged = new Signal(this);
     }
     /**
-     * Dispose the search provider
+     * CodeMirror search highlighter
      */
-    dispose() {
-        if (this._disposed) {
-            return;
+    get cmHandler() {
+        if (!this._cmHandler) {
+            this._cmHandler = new CodeMirrorSearchHighlighter(this.editor);
         }
-        this._disposed = true;
-        Signal.clearData(this);
+        return this._cmHandler;
     }
     /**
-     * Initialize the search using a CodeMirrorEditor object.
-     *
-     * @param query the search regular expression
+     * Changed signal to be emitted when search matches change.
      */
-    async startQuery(query) {
-        if (!this.editor) {
-            return Promise.resolve();
-        }
-        return this._startQuery(query);
+    get stateChanged() {
+        return this._stateChanged;
     }
     /**
-     * Refresh the search highlight overlay
+     * Current match index
      */
-    refreshOverlay() {
-        this._refreshOverlay();
-    }
-    async _startQuery(query, refreshOverlay = true) {
-        // no point in removing overlay in the middle of the search
-        await this.endQuery(false);
-        this._query = query;
-        this.editor.editor.dispatch({
-            effects: this._listener.reconfigure(EditorView.updateListener.of((v) => {
-                if (v.docChanged) {
-                    this._onDocChanged(v);
-                }
-            }))
-        });
-        await this._setInitialMatches(query);
-        if (refreshOverlay) {
-            this._refreshOverlay();
-        }
-        const matches = this._parseMatchesFromState();
-        if (matches.length === 0) {
-            return Promise.resolve();
-        }
-        const cursorMatch = this._findNext(false);
-        const match = cursorMatch &&
-            this._matchState[cursorMatch.from.line][cursorMatch.from.ch];
-        this._currentMatch = match;
-        await this._highlightCurrentMatch(cursorMatch);
-        return Promise.resolve();
+    get currentMatchIndex() {
+        return this.isActive ? this.currentIndex : null;
     }
     /**
-     * Clears state of a search provider to prepare for startQuery to be called
-     * in order to start a new query or refresh an existing one.
+     * Whether the cell search is active.
      *
-     * @param removeOverlay Whether to remove the search highlight overlay or not.
+     * This is used when applying search only on selected cells.
      */
-    async endQuery(removeOverlay = true) {
-        this._matchState = {};
-        this._currentMatch = null;
-        const from = this.editor.getPositionAt(this.editor.state.selection.main.from);
-        const to = this.editor.getPositionAt(this.editor.state.selection.main.to);
-        // Setting a reverse selection to allow search-as-you-type to maintain the
-        // current selected match.  See comment in _findNext for more details.
-        if (from !== to) {
-            this.editor.setSelection({
-                start: to,
-                end: from
-            });
-        }
-        this.editor.editor.dispatch({
-            effects: this._listener.reconfigure([])
-        });
+    get isActive() {
+        return this._isActive;
     }
     /**
-     * Clear currently highlighted match.
+     * Whether the search provider is disposed or not.
      */
-    clearHighlight() {
-        this._currentMatch = null;
-        const cursor = this.editor.getCursorPosition();
-        // Reset cursor position to remove any selection
-        this.editor.setCursorPosition(cursor);
-        return Promise.resolve();
+    get isDisposed() {
+        return this._isDisposed;
     }
     /**
-     * Move the current match indicator to the next match.
-     *
-     * @param loop Whether to loop within the matches list.
-     *
-     * @returns A promise that resolves once the action has completed.
+     * Number of matches in the cell.
      */
-    async highlightNext(loop) {
-        return this._highlightCurrentMatch(this._findNext(false));
+    get matchesCount() {
+        return this.isActive ? this.cmHandler.matches.length : 0;
     }
     /**
-     * Move the current match indicator to the previous match.
-     *
-     * @param loop Whether to loop within the matches list.
-     *
-     * @returns A promise that resolves once the action has completed.
+     * Clear currently highlighted match
      */
-    async highlightPrevious(loop) {
-        return this._highlightCurrentMatch(this._findNext(true));
+    clearHighlight() {
+        this.currentIndex = null;
+        this.cmHandler.clearHighlight();
+        return Promise.resolve();
     }
-    async _highlightCurrentMatch(cursorMatch) {
-        // Highlight the current index
-        if (!cursorMatch) {
-            // Set cursor to remove any selection
-            this.editor.editor.dispatch({ selection: { anchor: 0 } });
+    /**
+     * Dispose the search provider
+     */
+    dispose() {
+        if (this._isDisposed) {
             return;
         }
-        const match = this._matchState[cursorMatch.from.line][cursorMatch.from.ch];
-        this._currentMatch = match;
-        this.editor.editor.focus();
-        this.editor.editor.dispatch({
-            selection: {
-                anchor: match.position,
-                head: match.position + match.text.length
-            },
-            scrollIntoView: true
-        });
-        return match;
+        this._isDisposed = true;
+        Signal.clearData(this);
+        if (this.isActive) {
+            this.endQuery().catch(reason => {
+                console.error(`Failed to end search query on cells.`, reason);
+            });
+        }
     }
     /**
-     * Replace the currently selected match with the provided text
+     * Set `isActive` status.
      *
-     * @param newText The replacement text
-     * @param loop Whether to loop within the matches list.
+     * #### Notes
+     * It will start or end the search
      *
-     * @returns A promise that resolves with a boolean indicating whether a replace occurred.
+     * @param v New value
      */
-    async replaceCurrentMatch(newText, loop, options) {
-        // If the current selection exactly matches the current match,
-        // replace it.  Otherwise, just select the next match after the cursor.
-        let replaceOccurred = false;
-        if (this._currentMatchIsSelected()) {
-            const cursor = new RegExpCursor(this.editor.doc, this._query.source, { ignoreCase: !this._query.ignoreCase }, this.editor.state.selection.main.from).next();
-            if (cursor.done) {
-                return replaceOccurred;
+    async setIsActive(v) {
+        if (this._isActive !== v) {
+            this._isActive = v;
+        }
+        if (this._isActive) {
+            if (this.query !== null) {
+                await this.startQuery(this.query, this.filters);
             }
-            const value = cursor.value;
-            replaceOccurred = true;
-            const insertText = (options === null || options === void 0 ? void 0 : options.preserveCase)
-                ? GenericSearchProvider.preserveCase(this.editor.doc.sliceString(cursor.value.from, cursor.value.to), newText)
-                : newText;
-            this.editor.editor.dispatch({
-                changes: { from: value.from, to: value.to, insert: insertText }
-            });
         }
-        await this.highlightNext();
-        return replaceOccurred;
+        else {
+            await this.endQuery();
+        }
     }
     /**
-     * Replace all matches in the notebook with the provided text
-     *
-     * @param newText The replacement text
+     * Initialize the search using the provided options. Should update the UI
+     * to highlight all matches and "select" the first match.
      *
-     * @returns A promise that resolves with a boolean indicating whether a replace occurred.
+     * @param query A RegExp to be use to perform the search
+     * @param filters Filter parameters to pass to provider
      */
-    async replaceAllMatches(newText, options) {
-        let replaceOccurred = false;
-        return new Promise((resolve, _) => {
-            let cursor = new RegExpCursor(this.editor.doc, this._query.source, {
-                ignoreCase: !this._query.ignoreCase
-            }).next();
-            let changeSpec = [];
-            while (!cursor.done) {
-                replaceOccurred = true;
-                const insertText = (options === null || options === void 0 ? void 0 : options.preserveCase)
-                    ? GenericSearchProvider.preserveCase(this.editor.doc.sliceString(cursor.value.from, cursor.value.to), newText)
-                    : newText;
-                changeSpec.push({
-                    from: cursor.value.from,
-                    to: cursor.value.to,
-                    insert: insertText
-                });
-                cursor = cursor.next();
-            }
-            this.editor.editor.dispatch({ changes: changeSpec });
-            this._matchState = {};
-            this._currentMatch = null;
-            resolve(replaceOccurred);
-        });
+    async startQuery(query, filters) {
+        this.query = query;
+        this.filters = filters;
+        // Search input
+        const content = this.model.sharedModel.getSource();
+        await this.updateCodeMirror(content);
+        this.model.sharedModel.changed.connect(this.onSharedModelChanged, this);
     }
     /**
-     * The list of matches
+     * Stop the search and clean any UI elements.
      */
-    get matches() {
-        return this._parseMatchesFromState();
+    async endQuery() {
+        await this.cmHandler.endQuery();
+        this.currentIndex = null;
     }
     /**
-     * The number of matches.
+     * Highlight the next match.
+     *
+     * @returns The next match if there is one.
      */
-    get matchesCount() {
-        let size = 0;
-        for (const line in this._matchState) {
-            size += Object.keys(this._matchState[line]).length;
+    async highlightNext(loop = true) {
+        if (this.matchesCount === 0 || !this.isActive) {
+            this.currentIndex = null;
+        }
+        else {
+            // This starts from the cursor position
+            let match = await this.cmHandler.highlightNext();
+            if (match) {
+                this.currentIndex = this.cmHandler.currentIndex;
+            }
+            else {
+                this.currentIndex = loop ? 0 : null;
+            }
+            return match;
         }
-        return size;
+        return Promise.resolve(this.getCurrentMatch());
     }
     /**
-     * The current match
+     * Highlight the previous match.
+     *
+     * @returns The previous match if there is one.
      */
-    get currentMatch() {
-        return this._currentMatch;
+    async highlightPrevious(loop = true) {
+        if (this.matchesCount === 0 || !this.isActive) {
+            this.currentIndex = null;
+        }
+        else {
+            // This starts from the cursor position
+            let match = await this.cmHandler.highlightPrevious();
+            if (match) {
+                this.currentIndex = this.cmHandler.currentIndex;
+            }
+            else {
+                this.currentIndex = loop ? this.matchesCount - 1 : null;
+            }
+            return match;
+        }
+        return Promise.resolve(this.getCurrentMatch());
     }
     /**
-     * Signal indicating that something in the search has changed, so the UI should update
+     * Replace the currently selected match with the provided text.
+     *
+     * If no match is selected, it won't do anything.
+     *
+     * @param newText The replacement text.
+     * @returns Whether a replace occurred.
      */
-    get stateChanged() {
-        return this._changed;
+    replaceCurrentMatch(newText, loop, options) {
+        if (!this.isActive) {
+            return Promise.resolve(false);
+        }
+        let occurred = false;
+        if (this.currentIndex !== null &&
+            this.currentIndex < this.cmHandler.matches.length) {
+            const editor = this.editor;
+            const selection = editor.state.sliceDoc(editor.state.selection.main.from, editor.state.selection.main.to);
+            const match = this.getCurrentMatch();
+            // If cursor is not on a selection, highlight the next match
+            if (selection !== (match === null || match === void 0 ? void 0 : match.text)) {
+                this.currentIndex = null;
+                // The next will be highlighted as a consequence of this returning false
+            }
+            else {
+                this.cmHandler.matches.splice(this.currentIndex, 1);
+                this.currentIndex = null;
+                const substitutedText = (options === null || options === void 0 ? void 0 : options.regularExpression)
+                    ? match.text.replace(this.query, newText)
+                    : newText;
+                const insertText = (options === null || options === void 0 ? void 0 : options.preserveCase)
+                    ? GenericSearchProvider.preserveCase(match.text, substitutedText)
+                    : substitutedText;
+                this.model.sharedModel.updateSource(match.position, match.position + match.text.length, insertText);
+                occurred = true;
+            }
+        }
+        return Promise.resolve(occurred);
     }
     /**
-     * The current index of the selected match.
+     * Replace all matches in the cell source with the provided text
+     *
+     * @param newText The replacement text.
+     * @returns Whether a replace occurred.
      */
-    get currentMatchIndex() {
-        if (!this._currentMatch) {
-            return null;
-        }
-        // TODO make it more efficient
-        return this.matches.indexOf(this._currentMatch);
-    }
-    _onDocChanged(update) {
-        // TODO: CM6 migration
-        if (update.changes.length) {
-            this._setInitialMatches(this._query)
-                .then(() => {
-                this._changed.emit(undefined);
-            })
-                .catch(reason => {
-                console.error(`Fail to reapply search on CodeMirror document change:\n${reason}`);
-            });
+    replaceAllMatches(newText, options) {
+        if (!this.isActive) {
+            return Promise.resolve(false);
         }
-    }
-    _refreshOverlay() {
-        let effects = [
-            this._highlightEffect.of({ matches: this.matches })
-        ];
-        if (!this.editor.state.field(this._highlightField, false)) {
-            effects.push(StateEffect.appendConfig.of([this._highlightField]));
+        let occurred = this.cmHandler.matches.length > 0;
+        let src = this.model.sharedModel.getSource();
+        let lastEnd = 0;
+        const finalSrc = this.cmHandler.matches.reduce((agg, match) => {
+            const start = match.position;
+            const end = start + match.text.length;
+            const substitutedText = (options === null || options === void 0 ? void 0 : options.regularExpression)
+                ? match.text.replace(this.query, newText)
+                : newText;
+            const insertText = (options === null || options === void 0 ? void 0 : options.preserveCase)
+                ? GenericSearchProvider.preserveCase(match.text, substitutedText)
+                : substitutedText;
+            const newStep = `${agg}${src.slice(lastEnd, start)}${insertText}`;
+            lastEnd = end;
+            return newStep;
+        }, '');
+        if (occurred) {
+            this.cmHandler.matches = [];
+            this.currentIndex = null;
+            this.model.sharedModel.setSource(`${finalSrc}${src.slice(lastEnd)}`);
         }
-        this.editor.editor.dispatch({ effects });
-        this._changed.emit(undefined);
+        return Promise.resolve(occurred);
     }
     /**
-     * Do a full search on the entire document.
-     *
-     * This manually constructs the initial match state across the whole
-     * document. This must be done manually because the codemirror overlay
-     * is lazy-loaded, so it will only tokenize lines that are in or near
-     * the viewport.  This is sufficient for efficiently maintaining the
-     * state when changes are made to the document, as changes occur in or
-     * near the viewport, but to scan the whole document, a manual search
-     * across the entire content is required.
+     * Get the current match if it exists.
      *
-     * @param query The search term
+     * @returns The current match
      */
-    async _setInitialMatches(query) {
-        this._matchState = {};
-        const content = this.editor.doc.toString();
-        const matches = await TextSearchEngine.search(query, content);
-        matches.forEach(match => {
-            const { line, ch } = this._getPosition(match.position);
-            if (!this._matchState[line]) {
-                this._matchState[line] = {};
-            }
-            this._matchState[line][ch] = match;
-        });
-    }
-    _findNext(reverse) {
-        const caseSensitive = this._query.ignoreCase;
-        const state = this.editor.state;
-        // In order to support search-as-you-type, we needed a way to allow the first
-        // match to be selected when a search is started, but prevent the selected
-        // search to move for each new keypress.  To do this, when a search is ended,
-        // the cursor is reversed, putting the head at the 'from' position.  When a new
-        // search is started, the cursor we want is at the 'from' position, so that the same
-        // match is selected when the next key is entered (if it is still a match).
-        //
-        // When toggling through a search normally, the cursor is always set in the forward
-        // direction, so head is always at the 'to' position.  That way, if reverse = false,
-        // the search proceeds from the 'to' position during normal toggling.  If reverse = true,
-        // the search always proceeds from the 'anchor' position, which is at the 'from'.
-        const lastPosition = reverse
-            ? state.selection.main.anchor
-            : state.selection.main.head;
-        let cursor = new RegExpCursor(this.editor.doc, this._query.source, { ignoreCase: !caseSensitive }, lastPosition).next();
-        if (cursor.done) {
-            const startOrEnd = reverse ? this.editor.doc.length : 0;
-            cursor = new RegExpCursor(this.editor.doc, this._query.source, { ignoreCase: !caseSensitive }, startOrEnd).next();
-            if (cursor.done) {
-                return null;
-            }
+    getCurrentMatch() {
+        if (this.currentIndex === null) {
+            return undefined;
         }
-        return {
-            from: this._getPosition(cursor.value.from),
-            to: this._getPosition(cursor.value.to)
-        };
-    }
-    // TODO: remove this when Position API are removed and we work with
-    // offsets only. Contrary to the functions in CodeMirrorEditor,
-    // these functions work with CM6 position (i.e. line number starting at 1).
-    _getPosition(offset) {
-        const line = this.editor.doc.lineAt(offset);
-        return { line: line.number, ch: offset - line.from };
-    }
-    _parseMatchesFromState() {
-        // Flatten state map
-        const matches = new Array();
-        for (const lineKey in this._matchState) {
-            const lineMatches = this._matchState[lineKey];
-            for (const posKey in lineMatches) {
-                matches.push(lineMatches[posKey]);
+        else {
+            let match = undefined;
+            if (this.currentIndex < this.cmHandler.matches.length) {
+                match = this.cmHandler.matches[this.currentIndex];
             }
+            return match;
+        }
+    }
+    /**
+     * Callback on source change
+     *
+     * @param emitter Source of the change
+     * @param changes Source change
+     */
+    async onSharedModelChanged(emitter, changes) {
+        if (changes.sourceChange) {
+            await this.updateCodeMirror(emitter.getSource());
+            this._stateChanged.emit();
         }
-        return matches;
     }
-    _currentMatchIsSelected() {
-        if (!this._currentMatch) {
-            return false;
+    /**
+     * Update matches
+     */
+    async updateCodeMirror(content) {
+        if (this.query !== null && this.isActive) {
+            this.cmHandler.matches = await TextSearchEngine.search(this.query, content);
+        }
+        else {
+            this.cmHandler.matches = [];
         }
-        const currentSelection = this.editor.getSelection();
-        const currentSelectionLength = currentSelection.end.column - currentSelection.start.column;
-        const selectionIsOneLine = currentSelection.start.line === currentSelection.end.line;
-        return (selectionIsOneLine &&
-            this._currentMatch.text.length === currentSelectionLength &&
-            this._currentMatch.position ===
-                this.editor.doc.line(currentSelection.start.line).from +
-                    currentSelection.start.column);
     }
 }
 /**
@@ -459,7 +326,9 @@ export class CodeMirrorSearchHighlighter {
                         const e = ef;
                         if (e.value.matches.length) {
                             highlights = highlights.update({
-                                add: e.value.matches.map(m => this._highlightMark.range(m.position, m.position + m.text.length))
+                                add: e.value.matches.map(m => this._highlightMark.range(m.position, m.position + m.text.length)),
+                                // filter out old marks
+                                filter: () => false
                             });
                         }
                         else {