@ckeditor/ckeditor5-find-and-replace 44.3.0 → 45.0.0-alpha.0

package/dist/translations/be.d.ts

@@ -0,0 +1,8 @@
+/**
+ * @license Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
+ */
+
+import type { Translations } from '@ckeditor/ckeditor5-utils';
+declare const translations: Translations;
+export default translations;

package/dist/translations/be.js

@@ -0,0 +1,5 @@
+/**
+ * @license Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
+ */
+export default {"be":{"dictionary":{"Find and replace":"Знайсці і замяніць","Find in text…":"Знайсці ў тэксце…","Find":"Знайсці","Previous result":"Папярэдні вынік","Next result":"Наступны вынік","Replace":"Замяніць","Replace all":"Замяніць усё","Match case":"З улікам рэгістру","Whole words only":"Толькі слова цалкам","Replace with…":"Замяніць на…","Text to find must not be empty.":"Тэкст для пошуку не павінен быць пустым.","Tip: Find some text first in order to replace it.":"Падказка: спачатку знайдзіце тэкст, каб замяніць яго.","Advanced options":"Дадатковыя параметры","Find in the document":"Знайсці ў дакуменце"},getPluralForm(n){return (n % 10 == 1 && n % 100 != 11 ? 0 : n % 10 >= 2 && n % 10 <= 4 && (n % 100 < 10 || n % 100 >= 20) ? 1 : 2);}}}

package/dist/translations/be.umd.js

@@ -0,0 +1,11 @@
+/**
+ * @license Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
+ */
+
+( e => {
+const { [ 'be' ]: { dictionary, getPluralForm } } = {"be":{"dictionary":{"Find and replace":"Знайсці і замяніць","Find in text…":"Знайсці ў тэксце…","Find":"Знайсці","Previous result":"Папярэдні вынік","Next result":"Наступны вынік","Replace":"Замяніць","Replace all":"Замяніць усё","Match case":"З улікам рэгістру","Whole words only":"Толькі слова цалкам","Replace with…":"Замяніць на…","Text to find must not be empty.":"Тэкст для пошуку не павінен быць пустым.","Tip: Find some text first in order to replace it.":"Падказка: спачатку знайдзіце тэкст, каб замяніць яго.","Advanced options":"Дадатковыя параметры","Find in the document":"Знайсці ў дакуменце"},getPluralForm(n){return (n % 10 == 1 && n % 100 != 11 ? 0 : n % 10 >= 2 && n % 10 <= 4 && (n % 100 < 10 || n % 100 >= 20) ? 1 : 2);}}};
+e[ 'be' ] ||= { dictionary: {}, getPluralForm: null };
+e[ 'be' ].dictionary = Object.assign( e[ 'be' ].dictionary, dictionary );
+e[ 'be' ].getPluralForm = getPluralForm;
+} )( window.CKEDITOR_TRANSLATIONS ||= {} );

package/lang/translations/be.po

@@ -0,0 +1,68 @@
+# Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
+#
+# Want to contribute to this file? Submit your changes via a GitHub Pull Request.
+#
+# Check out the official contributor's guide:
+# https://ckeditor.com/docs/ckeditor5/latest/framework/guides/contributing/contributing.html
+#
+msgid ""
+msgstr ""
+"Language: be\n"
+"Plural-Forms: nplurals=3; plural=(n % 10 == 1 && n % 100 != 11 ? 0 : n % 10 >= 2 && n % 10 <= 4 && (n % 100 < 10 || n % 100 >= 20) ? 1 : 2);\n"
+"Content-Type: text/plain; charset=UTF-8\n"
+
+msgctxt "The tooltip of a find and replace button in the toolbar. Also, the title of the find and replace form."
+msgid "Find and replace"
+msgstr "Знайсці і замяніць"
+
+msgctxt "The label for the searched text in the find and replace dropdown."
+msgid "Find in text…"
+msgstr "Знайсці ў тэксце…"
+
+msgctxt "The label for the find action button in the find and replace dropdown."
+msgid "Find"
+msgstr "Знайсці"
+
+msgctxt "The label for the previous result button in the find and replace dropdown."
+msgid "Previous result"
+msgstr "Папярэдні вынік"
+
+msgctxt "The label for the previous result button in the find and replace dropdown."
+msgid "Next result"
+msgstr "Наступны вынік"
+
+msgctxt "The label for the (single) replace action button in the find and replace dropdown."
+msgid "Replace"
+msgstr "Замяніць"
+
+msgctxt "The label for the replace all action button in the find and replace dropdown."
+msgid "Replace all"
+msgstr "Замяніць усё"
+
+msgctxt "The label for the match case checkbox in the find and replace dropdown."
+msgid "Match case"
+msgstr "З улікам рэгістру"
+
+msgctxt "The label for the whole words only checkbox in the find and replace dropdown."
+msgid "Whole words only"
+msgstr "Толькі слова цалкам"
+
+msgctxt "The label for the text replacement in the find and replace dropdown."
+msgid "Replace with…"
+msgstr "Замяніць на…"
+
+msgctxt "An error text displayed when user attempted to find an empty text."
+msgid "Text to find must not be empty."
+msgstr "Тэкст для пошуку не павінен быць пустым."
+
+msgctxt "A message displayed next to the replace field when disabled but user tries to use it."
+msgid "Tip: Find some text first in order to replace it."
+msgstr "Падказка: спачатку знайдзіце тэкст, каб замяніць яго."
+
+msgctxt "The label and the tooltip of the options dropdown button in the find and replace form."
+msgid "Advanced options"
+msgstr "Дадатковыя параметры"
+
+msgctxt "Keystroke description for assistive technologies: keystroke for opening the find and replace UI."
+msgid "Find in the document"
+msgstr "Знайсці ў дакуменце"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ckeditor/ckeditor5-find-and-replace",
-  "version": "44.3.0",
+  "version": "45.0.0-alpha.0",
   "description": "Find and replace feature for CKEditor 5.",
   "keywords": [
     "ckeditor",
@@ -13,11 +13,12 @@
   "type": "module",
   "main": "src/index.js",
   "dependencies": {
-    "@ckeditor/ckeditor5-core": "44.3.0",
-    "@ckeditor/ckeditor5-ui": "44.3.0",
-    "@ckeditor/ckeditor5-utils": "44.3.0",
-    "ckeditor5": "44.3.0",
-    "lodash-es": "4.17.21"
+    "@ckeditor/ckeditor5-core": "45.0.0-alpha.0",
+    "@ckeditor/ckeditor5-icons": "45.0.0-alpha.0",
+    "@ckeditor/ckeditor5-ui": "45.0.0-alpha.0",
+    "@ckeditor/ckeditor5-utils": "45.0.0-alpha.0",
+    "ckeditor5": "45.0.0-alpha.0",
+    "es-toolkit": "1.32.0"
   },
   "author": "CKSource (http://cksource.com/)",
   "license": "SEE LICENSE IN LICENSE.md",

package/src/findandreplaceediting.js

@@ -14,86 +14,13 @@ import FindNextCommand from './findnextcommand.js';
 import FindPreviousCommand from './findpreviouscommand.js';
 import FindAndReplaceState from './findandreplacestate.js';
 import FindAndReplaceUtils from './findandreplaceutils.js';
-import { debounce } from 'lodash-es';
+import { debounce } from 'es-toolkit/compat';
 import '../theme/findandreplace.css';
 const HIGHLIGHT_CLASS = 'ck-find-result_selected';
 /**
  * Implements the editing part for find and replace plugin. For example conversion, commands etc.
  */
 export default class FindAndReplaceEditing extends Plugin {
-    constructor() {
-        super(...arguments);
-        /**
-         * Reacts to document changes in order to update search list.
-         */
-        this._onDocumentChange = () => {
-            const changedNodes = new Set();
-            const removedMarkers = new Set();
-            const model = this.editor.model;
-            const { results } = this.state;
-            const changes = model.document.differ.getChanges();
-            const changedMarkers = model.document.differ.getChangedMarkers();
-            // Get nodes in which changes happened to re-run a search callback on them.
-            changes.forEach(change => {
-                if (!change.position) {
-                    return;
-                }
-                if (change.name === '$text' || (change.position.nodeAfter && model.schema.isInline(change.position.nodeAfter))) {
-                    changedNodes.add(change.position.parent);
-                    [...model.markers.getMarkersAtPosition(change.position)].forEach(markerAtChange => {
-                        removedMarkers.add(markerAtChange.name);
-                    });
-                }
-                else if (change.type === 'insert' && change.position.nodeAfter) {
-                    changedNodes.add(change.position.nodeAfter);
-                }
-            });
-            // Get markers from removed nodes also.
-            changedMarkers.forEach(({ name, data: { newRange } }) => {
-                if (newRange && newRange.start.root.rootName === '$graveyard') {
-                    removedMarkers.add(name);
-                }
-            });
-            // Get markers from the updated nodes and remove all (search will be re-run on these nodes).
-            changedNodes.forEach(node => {
-                const markersInNode = [...model.markers.getMarkersIntersectingRange(model.createRangeIn(node))];
-                markersInNode.forEach(marker => removedMarkers.add(marker.name));
-            });
-            // Remove results from the changed part of content.
-            removedMarkers.forEach(markerName => {
-                if (!results.has(markerName)) {
-                    return;
-                }
-                if (results.get(markerName) === this.state.highlightedResult) {
-                    this.state.highlightedResult = null;
-                }
-                results.remove(markerName);
-            });
-            // Run search callback again on updated nodes.
-            const changedSearchResults = [];
-            const findAndReplaceUtils = this.editor.plugins.get('FindAndReplaceUtils');
-            changedNodes.forEach(nodeToCheck => {
-                const changedNodeSearchResults = findAndReplaceUtils.updateFindResultFromRange(model.createRangeOn(nodeToCheck), model, this.state.lastSearchCallback, results);
-                changedSearchResults.push(...changedNodeSearchResults);
-            });
-            changedMarkers.forEach(markerToCheck => {
-                // Handle search result highlight update when T&C plugin is active.
-                // Lookup is performed only on newly inserted markers.
-                if (markerToCheck.data.newRange) {
-                    const changedNodeSearchResults = findAndReplaceUtils.updateFindResultFromRange(markerToCheck.data.newRange, model, this.state.lastSearchCallback, results);
-                    changedSearchResults.push(...changedNodeSearchResults);
-                }
-            });
-            if (!this.state.highlightedResult && changedSearchResults.length) {
-                // If there are found phrases but none is selected, select the first one.
-                this.state.highlightedResult = changedSearchResults[0];
-            }
-            else {
-                // If there is already highlight item then refresh highlight offset after appending new items.
-                this.state.refreshHighlightOffset(model);
-            }
-        };
-    }
     /**
      * @inheritDoc
      */
@@ -112,6 +39,10 @@ export default class FindAndReplaceEditing extends Plugin {
     static get isOfficialPlugin() {
         return true;
     }
+    /**
+     * An object storing the find and replace state within a given editor instance.
+     */
+    state;
     /**
      * @inheritDoc
      */
@@ -230,4 +161,74 @@ export default class FindAndReplaceEditing extends Plugin {
             }
         });
     }
+    /**
+     * Reacts to document changes in order to update search list.
+     */
+    _onDocumentChange = () => {
+        const changedNodes = new Set();
+        const removedMarkers = new Set();
+        const model = this.editor.model;
+        const { results } = this.state;
+        const changes = model.document.differ.getChanges();
+        const changedMarkers = model.document.differ.getChangedMarkers();
+        // Get nodes in which changes happened to re-run a search callback on them.
+        changes.forEach(change => {
+            if (!change.position) {
+                return;
+            }
+            if (change.name === '$text' || (change.position.nodeAfter && model.schema.isInline(change.position.nodeAfter))) {
+                changedNodes.add(change.position.parent);
+                [...model.markers.getMarkersAtPosition(change.position)].forEach(markerAtChange => {
+                    removedMarkers.add(markerAtChange.name);
+                });
+            }
+            else if (change.type === 'insert' && change.position.nodeAfter) {
+                changedNodes.add(change.position.nodeAfter);
+            }
+        });
+        // Get markers from removed nodes also.
+        changedMarkers.forEach(({ name, data: { newRange } }) => {
+            if (newRange && newRange.start.root.rootName === '$graveyard') {
+                removedMarkers.add(name);
+            }
+        });
+        // Get markers from the updated nodes and remove all (search will be re-run on these nodes).
+        changedNodes.forEach(node => {
+            const markersInNode = [...model.markers.getMarkersIntersectingRange(model.createRangeIn(node))];
+            markersInNode.forEach(marker => removedMarkers.add(marker.name));
+        });
+        // Remove results from the changed part of content.
+        removedMarkers.forEach(markerName => {
+            if (!results.has(markerName)) {
+                return;
+            }
+            if (results.get(markerName) === this.state.highlightedResult) {
+                this.state.highlightedResult = null;
+            }
+            results.remove(markerName);
+        });
+        // Run search callback again on updated nodes.
+        const changedSearchResults = [];
+        const findAndReplaceUtils = this.editor.plugins.get('FindAndReplaceUtils');
+        changedNodes.forEach(nodeToCheck => {
+            const changedNodeSearchResults = findAndReplaceUtils.updateFindResultFromRange(model.createRangeOn(nodeToCheck), model, this.state.lastSearchCallback, results);
+            changedSearchResults.push(...changedNodeSearchResults);
+        });
+        changedMarkers.forEach(markerToCheck => {
+            // Handle search result highlight update when T&C plugin is active.
+            // Lookup is performed only on newly inserted markers.
+            if (markerToCheck.data.newRange) {
+                const changedNodeSearchResults = findAndReplaceUtils.updateFindResultFromRange(markerToCheck.data.newRange, model, this.state.lastSearchCallback, results);
+                changedSearchResults.push(...changedNodeSearchResults);
+            }
+        });
+        if (!this.state.highlightedResult && changedSearchResults.length) {
+            // If there are found phrases but none is selected, select the first one.
+            this.state.highlightedResult = changedSearchResults[0];
+        }
+        else {
+            // If there is already highlight item then refresh highlight offset after appending new items.
+            this.state.refreshHighlightOffset(model);
+        }
+    };
 }

package/src/findandreplaceui.d.ts

@@ -5,7 +5,7 @@
 /**
  * @module find-and-replace/findandreplaceui
  */
-import { type Editor, Plugin } from 'ckeditor5/src/core.js';
+import { Plugin, type Editor } from 'ckeditor5/src/core.js';
 import { Dialog, type ViewWithCssTransitionDisabler } from 'ckeditor5/src/ui.js';
 import FindAndReplaceFormView from './ui/findandreplaceformview.js';
 /**

package/src/findandreplaceui.js

@@ -6,9 +6,9 @@
  * @module find-and-replace/findandreplaceui
  */
 import { Plugin } from 'ckeditor5/src/core.js';
+import { IconFindReplace } from 'ckeditor5/src/icons.js';
 import { ButtonView, MenuBarMenuListItemButtonView, Dialog, DialogViewPosition, createDropdown, DropdownView, FormHeaderView, CssTransitionDisablerMixin } from 'ckeditor5/src/ui.js';
 import FindAndReplaceFormView from './ui/findandreplaceformview.js';
-import loupeIcon from '../theme/icons/find-replace.svg';
 /**
  * The default find and replace UI.
  *
@@ -34,6 +34,10 @@ export default class FindAndReplaceUI extends Plugin {
     static get isOfficialPlugin() {
         return true;
     }
+    /**
+     * A reference to the find and replace form view.
+     */
+    formView;
     /**
      * @inheritDoc
      */
@@ -133,7 +137,7 @@ export default class FindAndReplaceUI extends Plugin {
             }
         }, { priority: 'low' });
         dropdownView.buttonView.set({
-            icon: loupeIcon,
+            icon: IconFindReplace,
             label: t('Find and replace'),
             keystroke: 'CTRL+F',
             tooltip: true
@@ -199,7 +203,7 @@ export default class FindAndReplaceUI extends Plugin {
         // Button should be disabled when in source editing mode. See #10001.
         buttonView.bind('isEnabled').to(findCommand);
         buttonView.set({
-            icon: loupeIcon,
+            icon: IconFindReplace,
             label: t('Find and replace'),
             keystroke: 'CTRL+F'
         });

package/src/findandreplaceutils.js

@@ -4,7 +4,7 @@
  */
 import { Plugin } from 'ckeditor5/src/core.js';
 import { Collection, uid } from 'ckeditor5/src/utils.js';
-import { escapeRegExp } from 'lodash-es';
+import { escapeRegExp } from 'es-toolkit/compat';
 /**
  * A set of helpers related to find and replace.
  */

package/src/findcommand.js

@@ -10,6 +10,10 @@ import { Command } from 'ckeditor5/src/core.js';
  * The find command. It is used by the {@link module:find-and-replace/findandreplace~FindAndReplace find and replace feature}.
  */
 export default class FindCommand extends Command {
+    /**
+     * The find and replace state object used for command operations.
+     */
+    _state;
     /**
      * Creates a new `FindCommand` instance.
      *

package/src/findnextcommand.js

@@ -12,6 +12,10 @@ import { Command } from 'ckeditor5/src/core.js';
  * It is used by the {@link module:find-and-replace/findandreplace~FindAndReplace find and replace feature}.
  */
 export default class FindNextCommand extends Command {
+    /**
+     * The find and replace state object used for command operations.
+     */
+    _state;
     /**
      * Creates a new `FindNextCommand` instance.
      *

package/src/replacecommandbase.js

@@ -7,6 +7,10 @@
 */
 import { Command } from 'ckeditor5/src/core.js';
 export class ReplaceCommandBase extends Command {
+    /**
+     * The find and replace state object used for command operations.
+     */
+    _state;
     /**
      * Creates a new `ReplaceCommand` instance.
      *

package/src/ui/findandreplaceformview.js

@@ -11,13 +11,83 @@ import { FocusTracker, KeystrokeHandler, Rect, isVisible } from 'ckeditor5/src/u
 // eslint-disable-next-line ckeditor5-rules/ckeditor-imports
 import '@ckeditor/ckeditor5-ui/theme/components/responsive-form/responsiveform.css';
 import '../../theme/findandreplaceform.css';
-import { icons } from 'ckeditor5/src/core.js';
+import { IconPreviousArrow } from 'ckeditor5/src/icons.js';
 /**
  * The find and replace form view class.
  *
  * See {@link module:find-and-replace/ui/findandreplaceformview~FindAndReplaceFormView}.
  */
 export default class FindAndReplaceFormView extends View {
+    /**
+     * A collection of child views.
+     */
+    children;
+    /**
+     * The find in text input view that stores the searched string.
+     *
+     * @internal
+     */
+    _findInputView;
+    /**
+     * The replace input view.
+     */
+    _replaceInputView;
+    /**
+     * The find button view that initializes the search process.
+     */
+    _findButtonView;
+    /**
+     * The find previous button view.
+     */
+    _findPrevButtonView;
+    /**
+     * The find next button view.
+     */
+    _findNextButtonView;
+    /**
+     * A collapsible view aggregating the advanced search options.
+     */
+    _advancedOptionsCollapsibleView;
+    /**
+     * A switch button view controlling the "Match case" option.
+     */
+    _matchCaseSwitchView;
+    /**
+     * A switch button view controlling the "Whole words only" option.
+     */
+    _wholeWordsOnlySwitchView;
+    /**
+     * The replace button view.
+     */
+    _replaceButtonView;
+    /**
+     * The replace all button view.
+     */
+    _replaceAllButtonView;
+    /**
+     * The `div` aggregating the inputs.
+     */
+    _inputsDivView;
+    /**
+     * The `div` aggregating the action buttons.
+     */
+    _actionButtonsDivView;
+    /**
+     * Tracks information about the DOM focus in the form.
+     */
+    _focusTracker;
+    /**
+     * An instance of the {@link module:utils/keystrokehandler~KeystrokeHandler}.
+     */
+    _keystrokes;
+    /**
+     * A collection of views that can be focused in the form.
+     */
+    _focusables;
+    /**
+     * Helps cycling over {@link #_focusables} in the form.
+     */
+    focusCycler;
     /**
      * Creates a view of find and replace form.
      *
@@ -41,14 +111,14 @@ export default class FindAndReplaceFormView extends View {
         this._findPrevButtonView = this._createButton({
             label: t('Previous result'),
             class: 'ck-button-prev',
-            icon: icons.previousArrow,
+            icon: IconPreviousArrow,
             keystroke: 'Shift+F3',
             tooltip: true
         });
         this._findNextButtonView = this._createButton({
             label: t('Next result'),
             class: 'ck-button-next',
-            icon: icons.previousArrow,
+            icon: IconPreviousArrow,
             keystroke: 'F3',
             tooltip: true
         });

package/theme/icons/find-replace.svg

@@ -1 +0,0 @@
-<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="m12.87 13.786 1.532-1.286 3.857 4.596a1 1 0 1 1-1.532 1.286l-3.857-4.596z"/><path d="M16.004 8.5a6.5 6.5 0 0 1-9.216 5.905c-1.154-.53-.863-1.415-.663-1.615.194-.194.564-.592 1.635-.141a4.5 4.5 0 0 0 5.89-5.904l-.104-.227 1.332-1.331c.045-.046.196-.041.224.007a6.47 6.47 0 0 1 .902 3.306zm-3.4-5.715c.562.305.742 1.106.354 1.494-.388.388-.995.414-1.476.178a4.5 4.5 0 0 0-6.086 5.882l.114.236-1.348 1.349c-.038.037-.17.022-.198-.023a6.5 6.5 0 0 1 5.54-9.9 6.469 6.469 0 0 1 3.1.784z"/><path d="M4.001 11.93.948 8.877a.2.2 0 0 1 .141-.341h6.106a.2.2 0 0 1 .141.341L4.283 11.93a.2.2 0 0 1-.282 0zm11.083-6.789 3.053 3.053a.2.2 0 0 1-.14.342H11.89a.2.2 0 0 1-.14-.342l3.052-3.053a.2.2 0 0 1 .282 0z"/></svg>