@difizen/libro-search 0.1.0 → 0.1.2

package/es/libro-search-view.js

@@ -1,5 +1,8 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _dec, _dec2, _dec3, _dec4, _dec5, _dec6, _dec7, _dec8, _dec9, _dec10, _class, _class2, _descriptor, _descriptor2, _descriptor3, _descriptor4, _descriptor5, _descriptor6, _descriptor7, _descriptor8;
+var _dec, _dec2, _dec3, _dec4, _dec5, _dec6, _dec7, _dec8, _dec9, _dec10, _dec11, _dec12, _dec13, _class, _class2, _descriptor, _descriptor2, _descriptor3, _descriptor4, _descriptor5, _descriptor6, _descriptor7, _descriptor8, _descriptor9, _descriptor10, _descriptor11;
+function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw new Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator.return && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw new Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, catch: function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw new Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; }
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
 function _initializerDefineProperty(target, property, descriptor, context) { if (!descriptor) return; Object.defineProperty(target, property, { enumerable: descriptor.enumerable, configurable: descriptor.configurable, writable: descriptor.writable, value: descriptor.initializer ? descriptor.initializer.call(context) : void 0 }); }
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
@@ -15,13 +18,13 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
 function _applyDecoratedDescriptor(target, property, decorators, descriptor, context) { var desc = {}; Object.keys(descriptor).forEach(function (key) { desc[key] = descriptor[key]; }); desc.enumerable = !!desc.enumerable; desc.configurable = !!desc.configurable; if ('value' in desc || desc.initializer) { desc.writable = true; } desc = decorators.slice().reverse().reduce(function (desc, decorator) { return decorator(target, property, desc) || desc; }, desc); if (context && desc.initializer !== void 0) { desc.value = desc.initializer ? desc.initializer.call(context) : void 0; desc.initializer = undefined; } if (desc.initializer === void 0) { Object.defineProperty(target, property, desc); desc = null; } return desc; }
 function _initializerWarningHelper(descriptor, context) { throw new Error('Decorating class property failed. Please ensure that ' + 'transform-class-properties is enabled and runs after the decorators transform.'); }
-import { RightOutlined, ArrowUpOutlined, ArrowDownOutlined, EllipsisOutlined, CloseOutlined, createFromIconfontCN } from '@ant-design/icons';
+import { ArrowDownOutlined, ArrowUpOutlined, CloseOutlined, createFromIconfontCN, EllipsisOutlined, RightOutlined } from '@ant-design/icons';
 import { LirboContextKey } from '@difizen/libro-core';
-import { prop, useInject } from '@difizen/mana-app';
+import { prop, useInject, watch } from '@difizen/mana-app';
 import { BaseView, view, ViewInstance } from '@difizen/mana-app';
 import { inject, transient } from '@difizen/mana-app';
 import { l10n } from '@difizen/mana-l10n';
-import { Input, Button, Checkbox, Tag } from 'antd';
+import { Button, Checkbox, Input, Tag } from 'antd';
 import classnames from 'classnames';
 import { forwardRef, useEffect, useRef } from 'react';
 import { LibroSearchProviderFactory } from "./libro-search-provider.js";
@@ -45,11 +48,15 @@ export var ReplaceToggle = function ReplaceToggle() {
   });
 };
 export var SearchIndex = function SearchIndex() {
-  var _instance$currentMatc, _instance$matchesCoun;
   var instance = useInject(ViewInstance);
-  return /*#__PURE__*/_jsxs("div", {
+
+  // TODO: trigger update when current match index changed, matchesCount dont work
+  useEffect(function () {
+    //
+  }, [instance.currentMatchIndex]);
+  return /*#__PURE__*/_jsx("div", {
     className: "libro-search-index",
-    children: [(_instance$currentMatc = instance.currentMatchIndex) !== null && _instance$currentMatc !== void 0 ? _instance$currentMatc : '-', "/", (_instance$matchesCoun = instance.matchesCount) !== null && _instance$matchesCoun !== void 0 ? _instance$matchesCoun : '-']
+    children: instance.matchesCount !== undefined ? "".concat(instance.currentMatchIndex, "/").concat(instance.matchesCount) : '无结果'
   });
 };
 export var SearchContent = function SearchContent() {
@@ -87,6 +94,7 @@ export var SearchContent = function SearchContent() {
             value: instance.findStr,
             onChange: instance.handleFindChange,
             size: "small",
+            placeholder: "\u641C\u7D22",
             suffix: /*#__PURE__*/_jsxs("span", {
               className: "libro-search-input-suffix",
               children: [/*#__PURE__*/_jsx(IconFont, {
@@ -94,13 +102,15 @@ export var SearchContent = function SearchContent() {
                   'libro-search-input-suffix-active': instance.caseSensitive
                 }),
                 onClick: instance.toggleCaseSensitive,
-                type: "icon-Aa"
+                type: "icon-Aa",
+                title: "Match Case"
               }), /*#__PURE__*/_jsx(IconFont, {
                 className: classnames({
                   'libro-search-input-suffix-active': instance.useRegex
                 }),
                 onClick: instance.toggleUseRegex,
-                type: "icon-zhengzeshi"
+                type: "icon-zhengzeshi",
+                title: "Use Regular Expression"
               })]
             })
           })
@@ -108,10 +118,12 @@ export var SearchContent = function SearchContent() {
           className: "libro-search-action",
           children: [/*#__PURE__*/_jsx(SearchIndex, {}), /*#__PURE__*/_jsxs("div", {
             children: [/*#__PURE__*/_jsx(Button, {
+              title: "Previous Match",
               onClick: instance.previous,
               icon: /*#__PURE__*/_jsx(ArrowUpOutlined, {}),
               size: "small"
             }), /*#__PURE__*/_jsx(Button, {
+              title: "Next Match",
               onClick: instance.next,
               icon: /*#__PURE__*/_jsx(ArrowDownOutlined, {}),
               size: "small"
@@ -133,7 +145,8 @@ export var SearchContent = function SearchContent() {
           children: /*#__PURE__*/_jsx(Input, {
             value: instance.replaceStr,
             onChange: instance.handleReplaceChange,
-            size: "small"
+            size: "small",
+            placeholder: "\u66FF\u6362"
           })
         }), /*#__PURE__*/_jsx("td", {
           className: "libro-search-action",
@@ -143,13 +156,15 @@ export var SearchContent = function SearchContent() {
               icon: /*#__PURE__*/_jsx(IconFont, {
                 type: "icon-zifuchuantihuan_2"
               }),
-              size: "small"
+              size: "small",
+              title: "Replace"
             }), /*#__PURE__*/_jsx(Button, {
               onClick: instance.replaceAll,
               icon: /*#__PURE__*/_jsx(IconFont, {
                 type: "icon-tihuantupian"
               }),
-              size: "small"
+              size: "small",
+              title: "Replace All"
             })]
           })
         })]
@@ -169,7 +184,7 @@ export var SearchContent = function SearchContent() {
   });
 };
 // TODO: 更改图标
-export var SearchComponent = /*#__PURE__*/forwardRef(function SearchComponent(_props, ref) {
+export var SearchComponent = /*#__PURE__*/forwardRef(function SearchComponent(props, ref) {
   var instance = useInject(ViewInstance);
   return /*#__PURE__*/_jsx("div", {
     tabIndex: 1,
@@ -185,26 +200,66 @@ export var SearchComponent = /*#__PURE__*/forwardRef(function SearchComponent(_p
     children: instance.searchVisible && /*#__PURE__*/_jsx(SearchContent, {})
   });
 });
-export var LibroSearchView = (_dec = transient(), _dec2 = view('libro-search-view'), _dec3 = prop(), _dec4 = prop(), _dec5 = prop(), _dec6 = prop(), _dec7 = prop(), _dec8 = prop(), _dec9 = prop(), _dec10 = prop(), _dec(_class = _dec2(_class = (_class2 = /*#__PURE__*/function (_BaseView) {
+export var LibroSearchView = (_dec = transient(), _dec2 = view('libro-search-view'), _dec3 = inject(LirboContextKey), _dec4 = inject(LibroSearchUtils), _dec5 = inject(LibroSearchProviderFactory), _dec6 = prop(), _dec7 = prop(), _dec8 = prop(), _dec9 = prop(), _dec10 = prop(), _dec11 = prop(), _dec12 = prop(), _dec13 = prop(), _dec(_class = _dec2(_class = (_class2 = /*#__PURE__*/function (_BaseView) {
   _inherits(LibroSearchView, _BaseView);
   var _super = _createSuper(LibroSearchView);
-  function LibroSearchView(contextKey, utils, searchProviderFactory) {
+  function LibroSearchView() {
     var _this;
     _classCallCheck(this, LibroSearchView);
-    _this = _super.call(this);
-    _initializerDefineProperty(_this, "searchProvider", _descriptor, _assertThisInitialized(_this));
-    _initializerDefineProperty(_this, "searchVisible", _descriptor2, _assertThisInitialized(_this));
-    _initializerDefineProperty(_this, "settingVisible", _descriptor3, _assertThisInitialized(_this));
-    _initializerDefineProperty(_this, "findStr", _descriptor4, _assertThisInitialized(_this));
-    _initializerDefineProperty(_this, "lastSearch", _descriptor5, _assertThisInitialized(_this));
-    _initializerDefineProperty(_this, "replaceStr", _descriptor6, _assertThisInitialized(_this));
-    _initializerDefineProperty(_this, "caseSensitive", _descriptor7, _assertThisInitialized(_this));
-    _initializerDefineProperty(_this, "useRegex", _descriptor8, _assertThisInitialized(_this));
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _super.call.apply(_super, [this].concat(args));
+    _initializerDefineProperty(_this, "contextKey", _descriptor, _assertThisInitialized(_this));
+    _initializerDefineProperty(_this, "utils", _descriptor2, _assertThisInitialized(_this));
+    _initializerDefineProperty(_this, "searchProviderFactory", _descriptor3, _assertThisInitialized(_this));
+    _initializerDefineProperty(_this, "searchProvider", _descriptor4, _assertThisInitialized(_this));
+    _initializerDefineProperty(_this, "searchVisible", _descriptor5, _assertThisInitialized(_this));
+    _initializerDefineProperty(_this, "settingVisible", _descriptor6, _assertThisInitialized(_this));
+    _initializerDefineProperty(_this, "findStr", _descriptor7, _assertThisInitialized(_this));
+    _initializerDefineProperty(_this, "lastSearch", _descriptor8, _assertThisInitialized(_this));
+    _initializerDefineProperty(_this, "replaceStr", _descriptor9, _assertThisInitialized(_this));
+    _initializerDefineProperty(_this, "caseSensitive", _descriptor10, _assertThisInitialized(_this));
+    _initializerDefineProperty(_this, "useRegex", _descriptor11, _assertThisInitialized(_this));
     _this.view = SearchComponent;
-    _this.onviewWillUnmount = function () {
-      var _this$searchProvider;
-      (_this$searchProvider = _this.searchProvider) === null || _this$searchProvider === void 0 || _this$searchProvider.endQuery();
+    _this.onViewMount = function () {
+      if (!_this.searchProvider && _this.libro) {
+        _this.searchProvider = _this.searchProviderFactory({
+          view: _this.libro
+        });
+        _this.toDispose.push(watch(_this.libro.model, 'active', _this.onActiveCellChanged));
+        _this.toDispose.push(_this.libro.model.onSourceChanged(function () {
+          return _this.onCellsChanged();
+        }));
+      }
+    };
+    _this.onActiveCellChanged = function () {
+      if (_this.searchVisible) {
+        var _this$searchProvider;
+        (_this$searchProvider = _this.searchProvider) === null || _this$searchProvider === void 0 || _this$searchProvider.onActiveCellChanged();
+      }
     };
+    _this.onCellsChanged = function () {
+      if (_this.searchVisible) {
+        var _this$searchProvider2;
+        (_this$searchProvider2 = _this.searchProvider) === null || _this$searchProvider2 === void 0 || _this$searchProvider2.onCellsChanged();
+      }
+    };
+    _this.onviewWillUnmount = /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+      var _this$searchProvider3, _this$searchProvider4;
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            _context.next = 2;
+            return (_this$searchProvider3 = _this.searchProvider) === null || _this$searchProvider3 === void 0 ? void 0 : _this$searchProvider3.endQuery();
+          case 2:
+            (_this$searchProvider4 = _this.searchProvider) === null || _this$searchProvider4 === void 0 || _this$searchProvider4.dispose();
+          case 3:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
     _this.show = function () {
       var _this$findInputRef;
       _this.contextKey.disableCommandMode();
@@ -213,10 +268,13 @@ export var LibroSearchView = (_dec = transient(), _dec2 = view('libro-search-vie
       (_this$findInputRef = _this.findInputRef) === null || _this$findInputRef === void 0 || (_this$findInputRef = _this$findInputRef.current) === null || _this$findInputRef === void 0 || _this$findInputRef.focus();
     };
     _this.hide = function () {
-      var _this$searchProvider2, _this$libro;
+      var _this$searchProvider5, _this$libro;
       _this.searchVisible = false;
       _this.contextKey.enableCommandMode();
-      (_this$searchProvider2 = _this.searchProvider) === null || _this$searchProvider2 === void 0 || _this$searchProvider2.endQuery();
+      (_this$searchProvider5 = _this.searchProvider) === null || _this$searchProvider5 === void 0 || _this$searchProvider5.endQuery();
+      if (_this.searchProvider) {
+        _this.searchProvider.replaceMode = false;
+      }
       (_this$libro = _this.libro) === null || _this$libro === void 0 || _this$libro.focus();
     };
     _this.onFocus = function () {
@@ -234,11 +292,11 @@ export var LibroSearchView = (_dec = transient(), _dec2 = view('libro-search-vie
         _this.lastSearch = _this.findStr;
         var query = _this.utils.parseQuery(_this.findStr || '', _this.caseSensitive, _this.useRegex);
         if (query) {
-          var _this$searchProvider3;
-          (_this$searchProvider3 = _this.searchProvider) === null || _this$searchProvider3 === void 0 || _this$searchProvider3.startQuery(query, undefined, hightlightNext);
+          var _this$searchProvider6;
+          (_this$searchProvider6 = _this.searchProvider) === null || _this$searchProvider6 === void 0 || _this$searchProvider6.startQuery(query, undefined, hightlightNext);
         } else {
-          var _this$searchProvider4;
-          (_this$searchProvider4 = _this.searchProvider) === null || _this$searchProvider4 === void 0 || _this$searchProvider4.endQuery();
+          var _this$searchProvider7;
+          (_this$searchProvider7 = _this.searchProvider) === null || _this$searchProvider7 === void 0 || _this$searchProvider7.endQuery();
         }
       }
     };
@@ -258,14 +316,15 @@ export var LibroSearchView = (_dec = transient(), _dec2 = view('libro-search-vie
     };
     _this.toggleUseRegex = function () {
       _this.useRegex = !_this.useRegex;
+      _this.search();
     };
     _this.next = function () {
-      var _this$searchProvider5;
-      (_this$searchProvider5 = _this.searchProvider) === null || _this$searchProvider5 === void 0 || _this$searchProvider5.highlightNext();
+      var _this$searchProvider8;
+      (_this$searchProvider8 = _this.searchProvider) === null || _this$searchProvider8 === void 0 || _this$searchProvider8.highlightNext();
     };
     _this.previous = function () {
-      var _this$searchProvider6;
-      (_this$searchProvider6 = _this.searchProvider) === null || _this$searchProvider6 === void 0 || _this$searchProvider6.highlightPrevious();
+      var _this$searchProvider9;
+      (_this$searchProvider9 = _this.searchProvider) === null || _this$searchProvider9 === void 0 || _this$searchProvider9.highlightPrevious();
     };
     _this.searchCellOutputChange = function (e) {
       if (_this.searchProvider) {
@@ -273,20 +332,20 @@ export var LibroSearchView = (_dec = transient(), _dec2 = view('libro-search-vie
       }
     };
     _this.replace = function () {
-      var _this$searchProvider7;
-      (_this$searchProvider7 = _this.searchProvider) === null || _this$searchProvider7 === void 0 || _this$searchProvider7.replaceCurrentMatch(_this.replaceStr);
+      var _this$searchProvider10;
+      (_this$searchProvider10 = _this.searchProvider) === null || _this$searchProvider10 === void 0 || _this$searchProvider10.replaceCurrentMatch(_this.replaceStr);
     };
     _this.replaceAll = function () {
-      var _this$searchProvider8;
-      (_this$searchProvider8 = _this.searchProvider) === null || _this$searchProvider8 === void 0 || _this$searchProvider8.replaceAllMatches(_this.replaceStr);
+      var _this$searchProvider11;
+      (_this$searchProvider11 = _this.searchProvider) === null || _this$searchProvider11 === void 0 || _this$searchProvider11.replaceAllMatches(_this.replaceStr);
     };
     _this.initialQuery = function () {
-      var _this$searchProvider9;
-      var init = (_this$searchProvider9 = _this.searchProvider) === null || _this$searchProvider9 === void 0 ? void 0 : _this$searchProvider9.getInitialQuery();
+      var _this$searchProvider12;
+      var init = (_this$searchProvider12 = _this.searchProvider) === null || _this$searchProvider12 === void 0 ? void 0 : _this$searchProvider12.getInitialQuery();
       if (init) {
         _this.findStr = init;
-        _this.search(false);
       }
+      _this.search(false);
     };
     _this.getHeaderHeight = function () {
       var _this$libro3;
@@ -302,11 +361,11 @@ export var LibroSearchView = (_dec = transient(), _dec2 = view('libro-search-vie
     };
     _this.nextMatch = function (reverse) {
       if (reverse) {
-        var _this$searchProvider10;
-        (_this$searchProvider10 = _this.searchProvider) === null || _this$searchProvider10 === void 0 || _this$searchProvider10.highlightPrevious();
+        var _this$searchProvider13;
+        (_this$searchProvider13 = _this.searchProvider) === null || _this$searchProvider13 === void 0 || _this$searchProvider13.highlightPrevious();
       } else {
-        var _this$searchProvider11;
-        (_this$searchProvider11 = _this.searchProvider) === null || _this$searchProvider11 === void 0 || _this$searchProvider11.highlightNext();
+        var _this$searchProvider14;
+        (_this$searchProvider14 = _this.searchProvider) === null || _this$searchProvider14 === void 0 || _this$searchProvider14.highlightNext();
       }
     };
     _this.handleKeydown = function (e) {
@@ -343,30 +402,13 @@ export var LibroSearchView = (_dec = transient(), _dec2 = view('libro-search-vie
     _this.handleReplaceChange = function (e) {
       _this.replaceStr = e.target.value;
     };
-    _this.contextKey = contextKey;
-    _this.utils = utils;
-    _this.searchProviderFactory = searchProviderFactory;
     return _this;
   }
-  LibroSearchView = inject(LibroSearchProviderFactory)(LibroSearchView, undefined, 2) || LibroSearchView;
-  LibroSearchView = inject(LibroSearchUtils)(LibroSearchView, undefined, 1) || LibroSearchView;
-  LibroSearchView = inject(LirboContextKey)(LibroSearchView, undefined, 0) || LibroSearchView;
   _createClass(LibroSearchView, [{
-    key: "libro",
-    get: function get() {
-      return this._libro;
-    },
-    set: function set(value) {
-      this._libro = value;
-      this.searchProvider = this.searchProviderFactory({
-        view: this.libro
-      });
-    }
-  }, {
     key: "replaceVisible",
     get: function get() {
-      var _this$searchProvider$, _this$searchProvider12;
-      return (_this$searchProvider$ = (_this$searchProvider12 = this.searchProvider) === null || _this$searchProvider12 === void 0 ? void 0 : _this$searchProvider12.replaceMode) !== null && _this$searchProvider$ !== void 0 ? _this$searchProvider$ : false;
+      var _this$searchProvider$, _this$searchProvider15;
+      return (_this$searchProvider$ = (_this$searchProvider15 = this.searchProvider) === null || _this$searchProvider15 === void 0 ? void 0 : _this$searchProvider15.replaceMode) !== null && _this$searchProvider$ !== void 0 ? _this$searchProvider$ : false;
     }
   }, {
     key: "contentHeight",
@@ -383,8 +425,8 @@ export var LibroSearchView = (_dec = transient(), _dec2 = view('libro-search-vie
   }, {
     key: "currentMatchIndex",
     get: function get() {
-      var _this$searchProvider13;
-      var current = (_this$searchProvider13 = this.searchProvider) === null || _this$searchProvider13 === void 0 ? void 0 : _this$searchProvider13.currentMatchIndex;
+      var _this$searchProvider16;
+      var current = (_this$searchProvider16 = this.searchProvider) === null || _this$searchProvider16 === void 0 ? void 0 : _this$searchProvider16.currentMatchIndex;
       if (current !== undefined) {
         return current + 1;
       }
@@ -393,59 +435,74 @@ export var LibroSearchView = (_dec = transient(), _dec2 = view('libro-search-vie
   }, {
     key: "matchesCount",
     get: function get() {
-      var _this$searchProvider14;
-      return (_this$searchProvider14 = this.searchProvider) === null || _this$searchProvider14 === void 0 ? void 0 : _this$searchProvider14.matchesCount;
+      var _this$searchProvider17;
+      return (_this$searchProvider17 = this.searchProvider) === null || _this$searchProvider17 === void 0 ? void 0 : _this$searchProvider17.matchesCount;
     }
   }]);
   return LibroSearchView;
-}(BaseView), (_descriptor = _applyDecoratedDescriptor(_class2.prototype, "searchProvider", [_dec3], {
+}(BaseView), (_descriptor = _applyDecoratedDescriptor(_class2.prototype, "contextKey", [_dec3], {
+  configurable: true,
+  enumerable: true,
+  writable: true,
+  initializer: null
+}), _descriptor2 = _applyDecoratedDescriptor(_class2.prototype, "utils", [_dec4], {
+  configurable: true,
+  enumerable: true,
+  writable: true,
+  initializer: null
+}), _descriptor3 = _applyDecoratedDescriptor(_class2.prototype, "searchProviderFactory", [_dec5], {
+  configurable: true,
+  enumerable: true,
+  writable: true,
+  initializer: null
+}), _descriptor4 = _applyDecoratedDescriptor(_class2.prototype, "searchProvider", [_dec6], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: null
-}), _descriptor2 = _applyDecoratedDescriptor(_class2.prototype, "searchVisible", [_dec4], {
+}), _descriptor5 = _applyDecoratedDescriptor(_class2.prototype, "searchVisible", [_dec7], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function initializer() {
     return false;
   }
-}), _descriptor3 = _applyDecoratedDescriptor(_class2.prototype, "settingVisible", [_dec5], {
+}), _descriptor6 = _applyDecoratedDescriptor(_class2.prototype, "settingVisible", [_dec8], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function initializer() {
     return false;
   }
-}), _descriptor4 = _applyDecoratedDescriptor(_class2.prototype, "findStr", [_dec6], {
+}), _descriptor7 = _applyDecoratedDescriptor(_class2.prototype, "findStr", [_dec9], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function initializer() {
     return undefined;
   }
-}), _descriptor5 = _applyDecoratedDescriptor(_class2.prototype, "lastSearch", [_dec7], {
+}), _descriptor8 = _applyDecoratedDescriptor(_class2.prototype, "lastSearch", [_dec10], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function initializer() {
     return undefined;
   }
-}), _descriptor6 = _applyDecoratedDescriptor(_class2.prototype, "replaceStr", [_dec8], {
+}), _descriptor9 = _applyDecoratedDescriptor(_class2.prototype, "replaceStr", [_dec11], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function initializer() {
     return '';
   }
-}), _descriptor7 = _applyDecoratedDescriptor(_class2.prototype, "caseSensitive", [_dec9], {
+}), _descriptor10 = _applyDecoratedDescriptor(_class2.prototype, "caseSensitive", [_dec12], {
   configurable: true,
   enumerable: true,
   writable: true,
   initializer: function initializer() {
     return false;
   }
-}), _descriptor8 = _applyDecoratedDescriptor(_class2.prototype, "useRegex", [_dec10], {
+}), _descriptor11 = _applyDecoratedDescriptor(_class2.prototype, "useRegex", [_dec13], {
   configurable: true,
   enumerable: true,
   writable: true,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@difizen/libro-search",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "",
   "keywords": [
     "libro",
@@ -36,8 +36,9 @@
     "@difizen/mana-app": "latest",
     "@difizen/mana-l10n": "latest",
     "@ant-design/icons": "^5.1.0",
-    "@difizen/libro-common": "^0.1.0",
-    "@difizen/libro-core": "^0.1.0",
+    "@difizen/libro-common": "^0.1.2",
+    "@difizen/libro-core": "^0.1.2",
+    "@difizen/libro-code-editor": "^0.1.2",
     "@types/lodash.debounce": "^4.0.7",
     "classnames": "^2.3.2",
     "lodash.debounce": "^4.0.8",

package/src/abstract-search-provider.ts

@@ -1,3 +1,4 @@
+import type { SearchMatch } from '@difizen/libro-code-editor';
 import type { Event } from '@difizen/mana-app';
 import type { View } from '@difizen/mana-app';
 import { Emitter } from '@difizen/mana-app';
@@ -6,10 +7,8 @@ import { transient } from '@difizen/mana-app';
 import type {
   SearchFilter,
   SearchFilters,
-  SearchMatch,
   SearchProvider,
 } from './libro-search-protocol.js';
-
 /**
  * Abstract class implementing the search provider interface.
  */

package/src/index.less

@@ -2,19 +2,21 @@
   position: absolute;
   top: 0;
   right: 0;
-  box-shadow: 0 2px 2px 0 #7c68681a;
-  background-color: var(--mana-color-bg-elevated);
   z-index: 2000;
+  background-color: var(--mana-color-bg-elevated);
+  box-shadow: 0 2px 2px 0 #7c68681a;
 }
 
 .libro-search-content {
   display: flex;
   align-items: center;
-  padding: 2px 6px;
   min-width: 320px;
+  padding: 2px 6px;
 }
 
 .libro-search-row {
+  display: flex;
+  align-items: center;
   height: 32px;
 
   input {
@@ -22,18 +24,18 @@
   }
 
   .ant-btn {
+    margin-left: 4px;
     border: none;
     box-shadow: none;
-    margin-left: 4px;
   }
 }
 
 .libro-search-replace-toggle {
-  padding: 4px;
   display: flex;
   align-items: center;
   height: 100%;
   margin-right: 4px;
+  padding: 4px;
   cursor: pointer;
 
   &:hover {
@@ -42,8 +44,8 @@
 }
 
 .libro-search-input {
-  align-items: center;
   flex: 1;
+  align-items: center;
 
   .ant-input-affix-wrapper-sm {
     margin-right: 4px;
@@ -67,12 +69,12 @@
 }
 
 .libro-search-index {
-  // width: 24px;
   display: flex;
   align-items: center;
   justify-content: center;
-  margin-left: 4px;
+  width: 50px;
   margin-right: 16px;
+  margin-left: 4px;
 }
 
 .libro-search-action {

package/src/libro-search-engine-text.ts

@@ -1,4 +1,4 @@
-import type { SearchMatch } from './libro-search-protocol.js';
+import type { SearchMatch } from '@difizen/libro-code-editor';
 
 /**
  * Search for regular expression matches in a string.

package/src/libro-search-generic-provider.ts

@@ -143,7 +143,7 @@ export class GenericSearchProvider extends AbstractSearchProvider {
    *
    * @returns A promise that resolves with a boolean indicating whether a replace occurred.
    */
-  async replaceCurrentMatch(_newText: string, _loop?: boolean): Promise<boolean> {
+  async replaceCurrentMatch(newText: string, loop?: boolean): Promise<boolean> {
     return Promise.resolve(false);
   }
 
@@ -154,7 +154,7 @@ export class GenericSearchProvider extends AbstractSearchProvider {
    *
    * @returns A promise that resolves with a boolean indicating whether a replace occurred.
    */
-  async replaceAllMatches(_newText: string): Promise<boolean> {
+  async replaceAllMatches(newText: string): Promise<boolean> {
     // This is read only, but we could loosen this in theory for input boxes...
     return Promise.resolve(false);
   }
@@ -166,7 +166,7 @@ export class GenericSearchProvider extends AbstractSearchProvider {
    * @param query A RegExp to be use to perform the search
    * @param filters Filter parameters to pass to provider
    */
-  startQuery = async (query: RegExp | null, _filters = {}): Promise<void> => {
+  startQuery = async (query: RegExp | null, filters = {}): Promise<void> => {
     await this.endQuery();
     this._query = query;
 
@@ -281,8 +281,8 @@ export class GenericSearchProvider extends AbstractSearchProvider {
   }
 
   protected async _onWidgetChanged(
-    _mutations: MutationRecord[],
-    _observer: MutationObserver,
+    mutations: MutationRecord[],
+    observer: MutationObserver,
   ) {
     this._currentMatchIndex = -1;
     // This is typically cheap, but we do not control the rate of change or size of the output
@@ -290,7 +290,7 @@ export class GenericSearchProvider extends AbstractSearchProvider {
     this._stateChanged.fire();
   }
 }
-function elementInViewport(el: HTMLElement): boolean {
+export function elementInViewport(el: HTMLElement): boolean {
   const boundingClientRect = el.getBoundingClientRect();
   return (
     boundingClientRect.top >= 0 &&

package/src/libro-search-manager.ts

@@ -1,4 +1,5 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
+import type { CommandRegistry, KeybindingRegistry } from '@difizen/mana-app';
 import {
   LibroCommandRegister,
   LibroExtensionSlotContribution,
@@ -8,13 +9,13 @@ import type {
   LibroSlot,
   LibroView,
 } from '@difizen/libro-core';
-import type { CommandRegistry, KeybindingRegistry } from '@difizen/mana-app';
 import {
   ViewManager,
   CommandContribution,
   KeybindingContribution,
+  inject,
+  singleton,
 } from '@difizen/mana-app';
-import { inject, singleton } from '@difizen/mana-app';
 
 import { LibroSearchView } from './libro-search-view.js';
 
@@ -60,7 +61,7 @@ export class LibroSearchManager
       commands,
       LibroSearchToggleCommand.ShowLibroSearch,
       {
-        execute: (_cell, libro, _position) => {
+        execute: (cell, libro, position) => {
           if (libro) {
             this.showSearchView(libro);
           }