"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.SearchPanelPlugin = void 0;
const search_1 = require("@codemirror/search");
const view_1 = require("@codemirror/view");
const lodash_1 = require("../../../lodash.js");
const react_facet_1 = require("../react-facet.js");
const SearchPopup_1 = require("./view/SearchPopup.js");
const INPUT_DELAY = 200;
const SearchPanelPlugin = (params) => view_1.ViewPlugin.fromClass(class {
    view;
    params;
    anchor;
    renderer;
    searchConfig = {
        search: '',
        caseSensitive: false,
        wholeWord: false,
    };
    receiver;
    setViewSearchWithDelay;
    constructor(view) {
        this.view = view;
        this.anchor = null;
        this.renderer = null;
        this.params = params;
        this.receiver = params.receiver;
        this.handleClose = this.handleClose.bind(this);
        this.handleChange = this.handleChange.bind(this);
        this.handleSearchNext = this.handleSearchNext.bind(this);
        this.handleSearchPrev = this.handleSearchPrev.bind(this);
        this.handleSearchConfigChange = this.handleSearchConfigChange.bind(this);
        this.handleEditorModeChange = this.handleEditorModeChange.bind(this);
        this.setViewSearchWithDelay = (0, lodash_1.debounce)(this.setViewSearch, this.params.inputDelay ?? INPUT_DELAY);
        this.receiver?.on('change-editor-mode', this.handleEditorModeChange);
    }
    update(update) {
        const isPanelOpen = (0, search_1.searchPanelOpen)(update.state);
        if (isPanelOpen && !this.renderer) {
            const initial = (0, search_1.getSearchQuery)(update.state);
            this.anchor = document.querySelector(this.params.anchorSelector);
            this.renderer = this.view.state
                .facet(react_facet_1.ReactRendererFacet)
                .createItem('cm-search', () => (0, SearchPopup_1.renderSearchPopup)({
                initial,
                open: true,
                anchor: this.anchor,
                onChange: this.handleChange,
                onClose: this.handleClose,
                onSearchNext: this.handleSearchNext,
                onSearchPrev: this.handleSearchPrev,
                onConfigChange: this.handleSearchConfigChange,
            }));
        }
        else if (!isPanelOpen && this.renderer) {
            this.renderer?.remove();
            this.renderer = null;
        }
    }
    destroy() {
        this.renderer?.remove();
        this.renderer = null;
        this.receiver?.off('change-editor-mode', this.handleEditorModeChange);
    }
    setViewSearch(config) {
        this.searchConfig = {
            ...this.searchConfig,
            ...config,
        };
        const searchQuery = new search_1.SearchQuery({
            ...this.searchConfig,
        });
        this.view.dispatch({ effects: search_1.setSearchQuery.of(searchQuery) });
    }
    handleEditorModeChange({ mode }) {
        if (mode === 'wysiwyg') {
            (0, search_1.closeSearchPanel)(this.view);
        }
    }
    handleChange(search) {
        this.setViewSearchWithDelay({ search });
    }
    handleClose() {
        this.setViewSearch({ search: '' });
        (0, search_1.closeSearchPanel)(this.view);
    }
    handleSearchNext() {
        (0, search_1.findNext)(this.view);
    }
    handleSearchPrev() {
        (0, search_1.findPrevious)(this.view);
    }
    handleSearchConfigChange(config) {
        this.setViewSearch(config);
    }
}, {
    provide: () => [
        view_1.keymap.of(search_1.searchKeymap),
        (0, search_1.search)({
            createPanel: () => ({
                // Create an empty search panel
                dom: document.createElement('div'),
            }),
        }),
    ],
});
exports.SearchPanelPlugin = SearchPanelPlugin;
//# sourceMappingURL=plugin.js.map
