@progress/kendo-vue-editor 2.7.1-dev.202112201220 → 2.7.2

package/dist/npm/dialogs/FindReplace.js

@@ -0,0 +1,805 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FindAndReplaceDialogVue3 = exports.FindAndReplaceDialog = void 0; // @ts-ignore
+
+var Vue = require("vue");
+
+var allVue = Vue;
+var gh = allVue.h;
+
+var kendo_vue_dialogs_1 = require("@progress/kendo-vue-dialogs");
+
+var kendo_vue_layout_1 = require("@progress/kendo-vue-layout");
+
+var kendo_vue_intl_1 = require("@progress/kendo-vue-intl");
+
+var messages_1 = require("./../messages");
+
+var toolsSettings_1 = require("./../config/toolsSettings");
+
+var utils_1 = require("./../tools/utils");
+
+var kendo_editor_common_1 = require("@progress/kendo-editor-common");
+
+var enter = 13,
+    esc = 27;
+var settings = toolsSettings_1.EditorToolsSettings.findAndReplace; // tslint:enable:max-line-length
+
+var FindAndReplaceDialog = {
+  name: 'KendoFindAndReplaceDialog',
+  props: {
+    view: Object,
+    settings: {
+      type: Object,
+      default: function _default() {
+        return settings;
+      }
+    },
+    dir: String
+  },
+  inject: {
+    kendoLocalizationService: {
+      default: null
+    }
+  },
+  data: function data() {
+    return {
+      selectedTab: 0,
+      searchText: kendo_editor_common_1.selectedLineTextOnly(this.$props.view.state),
+      replaceText: '',
+      matchCase: false,
+      matchWord: false,
+      matchCyclic: false,
+      useRegExp: false,
+      nextMatch: undefined
+    };
+  },
+  mounted: function mounted() {
+    if (this.$el) {
+      document.body.append(this.$el);
+    }
+  },
+
+  /**
+   * @hidden
+   */
+  updated: function updated() {
+    var view = this.$props.view;
+    var _a = this.$data,
+        _b = _a.matches,
+        matches = _b === void 0 ? [] : _b,
+        nextMatch = _a.nextMatch;
+
+    if (this._prevMatch !== nextMatch) {
+      var state = view.state; // highlight selection
+
+      var tr = state.tr;
+      var highlights_1 = [];
+      matches.forEach(function (m) {
+        highlights_1.push({
+          from: m.from,
+          to: m.to,
+          attrs: {
+            class: nextMatch && m.eq(nextMatch) ? 'k-text-selected' : 'k-text-highlighted'
+          }
+        });
+      });
+      tr.setMeta(kendo_editor_common_1.textHighlightKey, highlights_1);
+      tr.setSelection(nextMatch || kendo_editor_common_1.TextSelection.create(state.doc, state.selection.from));
+      view.dispatch(tr);
+    }
+  },
+  destroyed: !!gh ? undefined : function () {
+    if (this.$el) {
+      this.$el.remove();
+    }
+  },
+  // @ts-ignore
+  unmounted: function unmounted() {
+    if (this.$el) {
+      this.$el.remove();
+    }
+  },
+  watch: {
+    nextMatch: function nextMatch(_newNextMatch, oldMatch) {
+      this._prevMatch = oldMatch;
+    }
+  },
+  // @ts-ignore
+  setup: !gh ? undefined : function () {
+    var v3 = !!gh;
+    return {
+      v3: v3
+    };
+  },
+  // @ts-ignore
+  render: function render(createElement) {
+    var _this = this;
+
+    var h = gh || createElement;
+    var localization = kendo_vue_intl_1.provideLocalizationService(this);
+    var _a = this.settings.messages,
+        findReplaceDialogTitle = _a.findReplaceDialogTitle,
+        findReplaceTabFind = _a.findReplaceTabFind,
+        findReplaceTabReplace = _a.findReplaceTabReplace,
+        findReplaceFindWhat = _a.findReplaceFindWhat,
+        findReplaceReplaceWith = _a.findReplaceReplaceWith,
+        findReplaceReplace = _a.findReplaceReplace,
+        findReplaceReplaceAll = _a.findReplaceReplaceAll,
+        findReplaceMatchCase = _a.findReplaceMatchCase,
+        findReplaceMatchWord = _a.findReplaceMatchWord,
+        findReplaceMatchCyclic = _a.findReplaceMatchCyclic,
+        findReplaceUseRegExp = _a.findReplaceUseRegExp,
+        findReplacePrevMatch = _a.findReplacePrevMatch,
+        findReplaceNextMatch = _a.findReplaceNextMatch,
+        findReplaceMatches = _a.findReplaceMatches;
+
+    var _b = this,
+        matchCase = _b.matchCase,
+        matchWord = _b.matchWord,
+        matchCyclic = _b.matchCyclic,
+        useRegExp = _b.useRegExp,
+        searchText = _b.searchText,
+        replaceText = _b.replaceText,
+        nextMatch = _b.nextMatch;
+
+    var checkboxes = h("div", {
+      "class": "k-search-options"
+    }, [h("span", [h("input", {
+      "class": "k-checkbox",
+      type: "checkbox",
+      attrs: this.v3 ? undefined : {
+        type: "checkbox",
+        id: "match-case"
+      },
+      id: "match-case",
+      checked: this.v3 ? matchCase : null,
+      domProps: this.v3 ? undefined : {
+        "checked": matchCase
+      },
+      onChange: this.onMatchCaseChecked,
+      on: this.v3 ? undefined : {
+        "change": this.onMatchCaseChecked
+      }
+    }), h("label", {
+      "for": "match-case",
+      attrs: this.v3 ? undefined : {
+        "for": "match-case"
+      },
+      "class": "k-checkbox-label"
+    }, [localization.toLanguageString(findReplaceMatchCase, messages_1.messages[findReplaceMatchCase])])]), h("span", [h("input", {
+      "class": "k-checkbox",
+      type: "checkbox",
+      attrs: this.v3 ? undefined : {
+        type: "checkbox",
+        id: "match-whole"
+      },
+      id: "match-whole",
+      checked: this.v3 ? matchWord : null,
+      domProps: this.v3 ? undefined : {
+        "checked": matchWord
+      },
+      onChange: this.onMatchWordChecked,
+      on: this.v3 ? undefined : {
+        "change": this.onMatchWordChecked
+      }
+    }), h("label", {
+      "for": "match-whole",
+      attrs: this.v3 ? undefined : {
+        "for": "match-whole"
+      },
+      "class": "k-checkbox-label"
+    }, [localization.toLanguageString(findReplaceMatchWord, messages_1.messages[findReplaceMatchWord])])]), h("span", [h("input", {
+      "class": "k-checkbox",
+      type: "checkbox",
+      attrs: this.v3 ? undefined : {
+        type: "checkbox",
+        id: "match-cyclic"
+      },
+      id: "match-cyclic",
+      checked: this.v3 ? matchCyclic : null,
+      domProps: this.v3 ? undefined : {
+        "checked": matchCyclic
+      },
+      onChange: this.onMatchCyclicChecked,
+      on: this.v3 ? undefined : {
+        "change": this.onMatchCyclicChecked
+      }
+    }), h("label", {
+      "for": "match-cyclic",
+      attrs: this.v3 ? undefined : {
+        "for": "match-cyclic"
+      },
+      "class": "k-checkbox-label"
+    }, [localization.toLanguageString(findReplaceMatchCyclic, messages_1.messages[findReplaceMatchCyclic])])]), h("span", [h("input", {
+      "class": "k-checkbox",
+      type: "checkbox",
+      attrs: this.v3 ? undefined : {
+        type: "checkbox",
+        id: "regular-expression"
+      },
+      id: "regular-expression",
+      checked: this.v3 ? useRegExp : null,
+      domProps: this.v3 ? undefined : {
+        "checked": useRegExp
+      },
+      onChange: this.onUseRegExpChecked,
+      on: this.v3 ? undefined : {
+        "change": this.onUseRegExpChecked
+      }
+    }), h("label", {
+      "for": "regular-expression",
+      attrs: this.v3 ? undefined : {
+        "for": "regular-expression"
+      },
+      "class": "k-checkbox-label"
+    }, [localization.toLanguageString(findReplaceUseRegExp, messages_1.messages[findReplaceUseRegExp])])])]);
+    var navigation = h("div", {
+      "class": "k-matches-container"
+    }, [h("button", {
+      "class": "k-button k-flat k-primary",
+      onClick: this.onFindPrev,
+      on: this.v3 ? undefined : {
+        "click": this.onFindPrev
+      }
+    }, [h("span", {
+      "class": "k-icon k-i-arrow-chevron-left"
+    }), localization.toLanguageString(findReplacePrevMatch, messages_1.messages[findReplacePrevMatch])]), h("span", [this.matchesMessage(localization.toLanguageString(findReplaceMatches, messages_1.messages[findReplaceMatches]))]), h("button", {
+      "class": "k-button k-flat k-primary",
+      onClick: this.onFindNext,
+      on: this.v3 ? undefined : {
+        "click": this.onFindNext
+      }
+    }, [localization.toLanguageString(findReplaceNextMatch, messages_1.messages[findReplaceNextMatch]), h("span", {
+      "class": "k-icon k-i-arrow-chevron-right"
+    })])]);
+    var findWhatLabel = h("div", {
+      "class": "k-edit-label"
+    }, [h("label", {
+      "for": "findWhat",
+      attrs: this.v3 ? undefined : {
+        "for": "findWhat"
+      }
+    }, [localization.toLanguageString(findReplaceFindWhat, messages_1.messages[findReplaceFindWhat])])]);
+    var findWhat = h("div", {
+      "class": "k-edit-field"
+    }, [h("input", {
+      id: "findWhat",
+      attrs: this.v3 ? undefined : {
+        id: "findWhat",
+        type: "text",
+        autoFocus: true
+      },
+      type: "text",
+      "class": "k-textbox",
+      value: this.v3 ? searchText : null,
+      domProps: this.v3 ? undefined : {
+        "value": searchText
+      },
+      onInput: this.onSearchChange,
+      on: this.v3 ? undefined : {
+        "input": this.onSearchChange,
+        "focus": this.onSearchChange,
+        "keydown": this.onKeyDown
+      },
+      onFocus: this.onSearchChange,
+      onKeydown: this.onKeyDown,
+      autoFocus: true
+    })]);
+    var replaceWithLabel = h("div", {
+      "class": "k-edit-label"
+    }, [h("label", {
+      "for": "replaceWith",
+      attrs: this.v3 ? undefined : {
+        "for": "replaceWith"
+      }
+    }, [localization.toLanguageString(findReplaceReplaceWith, messages_1.messages[findReplaceReplaceWith])])]);
+    var replaceWith = h("div", {
+      "class": "k-edit-field"
+    }, [h("input", {
+      id: "replaceWith",
+      attrs: this.v3 ? undefined : {
+        id: "replaceWith",
+        type: "text"
+      },
+      "class": "k-textbox",
+      type: "text",
+      value: this.v3 ? replaceText : null,
+      domProps: this.v3 ? undefined : {
+        "value": replaceText
+      },
+      onInput: this.onReplaceChange,
+      on: this.v3 ? undefined : {
+        "input": this.onReplaceChange
+      }
+    })]);
+    return (// @ts-ignore function children
+      h(kendo_vue_dialogs_1.Window, {
+        title: localization.toLanguageString(findReplaceDialogTitle, messages_1.messages[findReplaceDialogTitle]),
+        attrs: this.v3 ? undefined : {
+          title: localization.toLanguageString(findReplaceDialogTitle, messages_1.messages[findReplaceDialogTitle]),
+          windowStyle: {
+            width: 'auto',
+            height: 'auto',
+            userSelect: 'none'
+          },
+          resizable: false,
+          minimizeButton: function minimizeButton() {
+            return null;
+          },
+          maximizeButton: function maximizeButton() {
+            return null;
+          }
+        },
+        onClose: this.onClose,
+        on: this.v3 ? undefined : {
+          "close": this.onClose
+        },
+        windowStyle: {
+          width: 'auto',
+          height: 'auto',
+          userSelect: 'none'
+        },
+        resizable: false,
+        minimizeButton: function minimizeButton() {
+          return null;
+        },
+        maximizeButton: function maximizeButton() {
+          return null;
+        }
+      }, this.v3 ? function () {
+        return [// @ts-ignore function children
+        h(kendo_vue_layout_1.TabStrip, {
+          selected: _this.selectedTab,
+          attrs: _this.v3 ? undefined : {
+            selected: _this.selectedTab,
+            animation: false
+          },
+          "class": "k-editor-find-replace",
+          onSelect: _this.onTabSelect,
+          on: _this.v3 ? undefined : {
+            "select": _this.onTabSelect
+          },
+          animation: false
+        }, _this.v3 ? function () {
+          return [// @ts-ignore function children
+          h(kendo_vue_layout_1.TabStripTab, {
+            title: localization.toLanguageString(findReplaceTabFind, messages_1.messages[findReplaceTabFind]),
+            attrs: _this.v3 ? undefined : {
+              title: localization.toLanguageString(findReplaceTabFind, messages_1.messages[findReplaceTabFind])
+            }
+          }, _this.v3 ? function () {
+            return [h("div", {
+              "class": "k-edit-form-container"
+            }, [findWhatLabel, findWhat]), checkboxes, navigation];
+          } : [h("div", {
+            "class": "k-edit-form-container"
+          }, [findWhatLabel, findWhat]), checkboxes, navigation]), // @ts-ignore function children
+          h(kendo_vue_layout_1.TabStripTab, {
+            title: localization.toLanguageString(findReplaceTabReplace, messages_1.messages[findReplaceTabReplace]),
+            attrs: _this.v3 ? undefined : {
+              title: localization.toLanguageString(findReplaceTabReplace, messages_1.messages[findReplaceTabReplace])
+            }
+          }, _this.v3 ? function () {
+            return [h("div", {
+              "class": "k-edit-form-container"
+            }, [findWhatLabel, findWhat, replaceWithLabel, replaceWith]), h("div", {
+              "class": "k-actions k-hstack k-justify-content-end"
+            }, [h("button", {
+              "class": "k-button",
+              disabled: !Boolean(nextMatch),
+              attrs: _this.v3 ? undefined : {
+                disabled: !Boolean(nextMatch)
+              },
+              onClick: _this.onReplace,
+              on: _this.v3 ? undefined : {
+                "click": _this.onReplace
+              }
+            }, [localization.toLanguageString(findReplaceReplace, messages_1.messages[findReplaceReplace])]), h("button", {
+              "class": "k-button",
+              disabled: !Boolean(nextMatch),
+              attrs: _this.v3 ? undefined : {
+                disabled: !Boolean(nextMatch)
+              },
+              onClick: _this.onReplaceAll,
+              on: _this.v3 ? undefined : {
+                "click": _this.onReplaceAll
+              }
+            }, [localization.toLanguageString(findReplaceReplaceAll, messages_1.messages[findReplaceReplaceAll])])]), checkboxes, navigation];
+          } : [h("div", {
+            "class": "k-edit-form-container"
+          }, [findWhatLabel, findWhat, replaceWithLabel, replaceWith]), h("div", {
+            "class": "k-actions k-hstack k-justify-content-end"
+          }, [h("button", {
+            "class": "k-button",
+            disabled: !Boolean(nextMatch),
+            attrs: _this.v3 ? undefined : {
+              disabled: !Boolean(nextMatch)
+            },
+            onClick: _this.onReplace,
+            on: _this.v3 ? undefined : {
+              "click": _this.onReplace
+            }
+          }, [localization.toLanguageString(findReplaceReplace, messages_1.messages[findReplaceReplace])]), h("button", {
+            "class": "k-button",
+            disabled: !Boolean(nextMatch),
+            attrs: _this.v3 ? undefined : {
+              disabled: !Boolean(nextMatch)
+            },
+            onClick: _this.onReplaceAll,
+            on: _this.v3 ? undefined : {
+              "click": _this.onReplaceAll
+            }
+          }, [localization.toLanguageString(findReplaceReplaceAll, messages_1.messages[findReplaceReplaceAll])])]), checkboxes, navigation])];
+        } : [h(kendo_vue_layout_1.TabStripTab, {
+          title: localization.toLanguageString(findReplaceTabFind, messages_1.messages[findReplaceTabFind]),
+          attrs: _this.v3 ? undefined : {
+            title: localization.toLanguageString(findReplaceTabFind, messages_1.messages[findReplaceTabFind])
+          }
+        }, _this.v3 ? function () {
+          return [h("div", {
+            "class": "k-edit-form-container"
+          }, [findWhatLabel, findWhat]), checkboxes, navigation];
+        } : [h("div", {
+          "class": "k-edit-form-container"
+        }, [findWhatLabel, findWhat]), checkboxes, navigation]), h(kendo_vue_layout_1.TabStripTab, {
+          title: localization.toLanguageString(findReplaceTabReplace, messages_1.messages[findReplaceTabReplace]),
+          attrs: _this.v3 ? undefined : {
+            title: localization.toLanguageString(findReplaceTabReplace, messages_1.messages[findReplaceTabReplace])
+          }
+        }, _this.v3 ? function () {
+          return [h("div", {
+            "class": "k-edit-form-container"
+          }, [findWhatLabel, findWhat, replaceWithLabel, replaceWith]), h("div", {
+            "class": "k-actions k-hstack k-justify-content-end"
+          }, [h("button", {
+            "class": "k-button",
+            disabled: !Boolean(nextMatch),
+            attrs: _this.v3 ? undefined : {
+              disabled: !Boolean(nextMatch)
+            },
+            onClick: _this.onReplace,
+            on: _this.v3 ? undefined : {
+              "click": _this.onReplace
+            }
+          }, [localization.toLanguageString(findReplaceReplace, messages_1.messages[findReplaceReplace])]), h("button", {
+            "class": "k-button",
+            disabled: !Boolean(nextMatch),
+            attrs: _this.v3 ? undefined : {
+              disabled: !Boolean(nextMatch)
+            },
+            onClick: _this.onReplaceAll,
+            on: _this.v3 ? undefined : {
+              "click": _this.onReplaceAll
+            }
+          }, [localization.toLanguageString(findReplaceReplaceAll, messages_1.messages[findReplaceReplaceAll])])]), checkboxes, navigation];
+        } : [h("div", {
+          "class": "k-edit-form-container"
+        }, [findWhatLabel, findWhat, replaceWithLabel, replaceWith]), h("div", {
+          "class": "k-actions k-hstack k-justify-content-end"
+        }, [h("button", {
+          "class": "k-button",
+          disabled: !Boolean(nextMatch),
+          attrs: _this.v3 ? undefined : {
+            disabled: !Boolean(nextMatch)
+          },
+          onClick: _this.onReplace,
+          on: _this.v3 ? undefined : {
+            "click": _this.onReplace
+          }
+        }, [localization.toLanguageString(findReplaceReplace, messages_1.messages[findReplaceReplace])]), h("button", {
+          "class": "k-button",
+          disabled: !Boolean(nextMatch),
+          attrs: _this.v3 ? undefined : {
+            disabled: !Boolean(nextMatch)
+          },
+          onClick: _this.onReplaceAll,
+          on: _this.v3 ? undefined : {
+            "click": _this.onReplaceAll
+          }
+        }, [localization.toLanguageString(findReplaceReplaceAll, messages_1.messages[findReplaceReplaceAll])])]), checkboxes, navigation])])];
+      } : [h(kendo_vue_layout_1.TabStrip, {
+        selected: _this.selectedTab,
+        attrs: _this.v3 ? undefined : {
+          selected: _this.selectedTab,
+          animation: false
+        },
+        "class": "k-editor-find-replace",
+        onSelect: _this.onTabSelect,
+        on: _this.v3 ? undefined : {
+          "select": _this.onTabSelect
+        },
+        animation: false
+      }, _this.v3 ? function () {
+        return [h(kendo_vue_layout_1.TabStripTab, {
+          title: localization.toLanguageString(findReplaceTabFind, messages_1.messages[findReplaceTabFind]),
+          attrs: _this.v3 ? undefined : {
+            title: localization.toLanguageString(findReplaceTabFind, messages_1.messages[findReplaceTabFind])
+          }
+        }, _this.v3 ? function () {
+          return [h("div", {
+            "class": "k-edit-form-container"
+          }, [findWhatLabel, findWhat]), checkboxes, navigation];
+        } : [h("div", {
+          "class": "k-edit-form-container"
+        }, [findWhatLabel, findWhat]), checkboxes, navigation]), h(kendo_vue_layout_1.TabStripTab, {
+          title: localization.toLanguageString(findReplaceTabReplace, messages_1.messages[findReplaceTabReplace]),
+          attrs: _this.v3 ? undefined : {
+            title: localization.toLanguageString(findReplaceTabReplace, messages_1.messages[findReplaceTabReplace])
+          }
+        }, _this.v3 ? function () {
+          return [h("div", {
+            "class": "k-edit-form-container"
+          }, [findWhatLabel, findWhat, replaceWithLabel, replaceWith]), h("div", {
+            "class": "k-actions k-hstack k-justify-content-end"
+          }, [h("button", {
+            "class": "k-button",
+            disabled: !Boolean(nextMatch),
+            attrs: _this.v3 ? undefined : {
+              disabled: !Boolean(nextMatch)
+            },
+            onClick: _this.onReplace,
+            on: _this.v3 ? undefined : {
+              "click": _this.onReplace
+            }
+          }, [localization.toLanguageString(findReplaceReplace, messages_1.messages[findReplaceReplace])]), h("button", {
+            "class": "k-button",
+            disabled: !Boolean(nextMatch),
+            attrs: _this.v3 ? undefined : {
+              disabled: !Boolean(nextMatch)
+            },
+            onClick: _this.onReplaceAll,
+            on: _this.v3 ? undefined : {
+              "click": _this.onReplaceAll
+            }
+          }, [localization.toLanguageString(findReplaceReplaceAll, messages_1.messages[findReplaceReplaceAll])])]), checkboxes, navigation];
+        } : [h("div", {
+          "class": "k-edit-form-container"
+        }, [findWhatLabel, findWhat, replaceWithLabel, replaceWith]), h("div", {
+          "class": "k-actions k-hstack k-justify-content-end"
+        }, [h("button", {
+          "class": "k-button",
+          disabled: !Boolean(nextMatch),
+          attrs: _this.v3 ? undefined : {
+            disabled: !Boolean(nextMatch)
+          },
+          onClick: _this.onReplace,
+          on: _this.v3 ? undefined : {
+            "click": _this.onReplace
+          }
+        }, [localization.toLanguageString(findReplaceReplace, messages_1.messages[findReplaceReplace])]), h("button", {
+          "class": "k-button",
+          disabled: !Boolean(nextMatch),
+          attrs: _this.v3 ? undefined : {
+            disabled: !Boolean(nextMatch)
+          },
+          onClick: _this.onReplaceAll,
+          on: _this.v3 ? undefined : {
+            "click": _this.onReplaceAll
+          }
+        }, [localization.toLanguageString(findReplaceReplaceAll, messages_1.messages[findReplaceReplaceAll])])]), checkboxes, navigation])];
+      } : [h(kendo_vue_layout_1.TabStripTab, {
+        title: localization.toLanguageString(findReplaceTabFind, messages_1.messages[findReplaceTabFind]),
+        attrs: _this.v3 ? undefined : {
+          title: localization.toLanguageString(findReplaceTabFind, messages_1.messages[findReplaceTabFind])
+        }
+      }, _this.v3 ? function () {
+        return [h("div", {
+          "class": "k-edit-form-container"
+        }, [findWhatLabel, findWhat]), checkboxes, navigation];
+      } : [h("div", {
+        "class": "k-edit-form-container"
+      }, [findWhatLabel, findWhat]), checkboxes, navigation]), h(kendo_vue_layout_1.TabStripTab, {
+        title: localization.toLanguageString(findReplaceTabReplace, messages_1.messages[findReplaceTabReplace]),
+        attrs: _this.v3 ? undefined : {
+          title: localization.toLanguageString(findReplaceTabReplace, messages_1.messages[findReplaceTabReplace])
+        }
+      }, _this.v3 ? function () {
+        return [h("div", {
+          "class": "k-edit-form-container"
+        }, [findWhatLabel, findWhat, replaceWithLabel, replaceWith]), h("div", {
+          "class": "k-actions k-hstack k-justify-content-end"
+        }, [h("button", {
+          "class": "k-button",
+          disabled: !Boolean(nextMatch),
+          attrs: _this.v3 ? undefined : {
+            disabled: !Boolean(nextMatch)
+          },
+          onClick: _this.onReplace,
+          on: _this.v3 ? undefined : {
+            "click": _this.onReplace
+          }
+        }, [localization.toLanguageString(findReplaceReplace, messages_1.messages[findReplaceReplace])]), h("button", {
+          "class": "k-button",
+          disabled: !Boolean(nextMatch),
+          attrs: _this.v3 ? undefined : {
+            disabled: !Boolean(nextMatch)
+          },
+          onClick: _this.onReplaceAll,
+          on: _this.v3 ? undefined : {
+            "click": _this.onReplaceAll
+          }
+        }, [localization.toLanguageString(findReplaceReplaceAll, messages_1.messages[findReplaceReplaceAll])])]), checkboxes, navigation];
+      } : [h("div", {
+        "class": "k-edit-form-container"
+      }, [findWhatLabel, findWhat, replaceWithLabel, replaceWith]), h("div", {
+        "class": "k-actions k-hstack k-justify-content-end"
+      }, [h("button", {
+        "class": "k-button",
+        disabled: !Boolean(nextMatch),
+        attrs: _this.v3 ? undefined : {
+          disabled: !Boolean(nextMatch)
+        },
+        onClick: _this.onReplace,
+        on: _this.v3 ? undefined : {
+          "click": _this.onReplace
+        }
+      }, [localization.toLanguageString(findReplaceReplace, messages_1.messages[findReplaceReplace])]), h("button", {
+        "class": "k-button",
+        disabled: !Boolean(nextMatch),
+        attrs: _this.v3 ? undefined : {
+          disabled: !Boolean(nextMatch)
+        },
+        onClick: _this.onReplaceAll,
+        on: _this.v3 ? undefined : {
+          "click": _this.onReplaceAll
+        }
+      }, [localization.toLanguageString(findReplaceReplaceAll, messages_1.messages[findReplaceReplaceAll])])]), checkboxes, navigation])])])
+    ); //    document.body);
+  },
+  methods: {
+    onTabSelect: function onTabSelect(event) {
+      this.selectedTab = event.selected;
+    },
+    onClose: function onClose() {
+      var view = this.$props.view;
+      var state = view.state;
+      var transaction = state.tr.setSelection(kendo_editor_common_1.TextSelection.create(state.doc, state.selection.from, state.selection.to));
+      view.updateState(state.apply(transaction));
+      view.focus();
+      this.$emit('close');
+    },
+    matchesMessage: function matchesMessage(locMessage) {
+      var matches = this.matches;
+      var nextMatch = this.nextMatch;
+      var cur = 0,
+          all = 0;
+
+      if (matches && nextMatch) {
+        var current = matches.findIndex(function (s) {
+          return s.eq(nextMatch);
+        });
+        cur = current === -1 ? matches.length : current + 1;
+        all = matches.length;
+      }
+
+      return utils_1.formatString(locMessage, cur, all);
+    },
+    onFindNext: function onFindNext() {
+      this.onFind();
+    },
+    onFindPrev: function onFindPrev() {
+      this.onFind(true);
+    },
+    onFind: function onFind(backward) {
+      if (backward === void 0) {
+        backward = false;
+      }
+
+      var view = this.$props.view;
+      var _a = this.$data,
+          text = _a.searchText,
+          matchCase = _a.matchCase,
+          matchCyclic = _a.matchCyclic,
+          matchWord = _a.matchWord,
+          useRegExp = _a.useRegExp;
+      var searchOptions = {
+        text: text,
+        matchWord: matchWord,
+        matchCase: matchCase,
+        useRegExp: useRegExp,
+        backward: backward,
+        matchCyclic: matchCyclic
+      };
+      var selectionResult = kendo_editor_common_1.find(view.state, searchOptions);
+
+      if (selectionResult) {
+        var transaction = view.state.tr.setSelection(selectionResult);
+        transaction.scrollIntoView();
+        view.updateState(view.state.apply(transaction));
+        this.nextMatch = selectionResult;
+      }
+    },
+    onReplace: function onReplace() {
+      var view = this.$props.view;
+      var selection = view.state.selection;
+      var replaceText = this.$data.replaceText;
+
+      if (!selection.empty) {
+        var start = selection.from;
+        var end = start + replaceText.length;
+        var transaction = kendo_editor_common_1.replace(selection, replaceText, view.state.tr);
+        transaction.setSelection(kendo_editor_common_1.TextSelection.create(transaction.doc, start, end));
+        transaction.scrollIntoView();
+        view.dispatch(transaction);
+        this.setNextState({});
+      }
+    },
+    onReplaceAll: function onReplaceAll() {
+      var view = this.$props.view;
+      var _a = this.$data,
+          searchText = _a.searchText,
+          replaceText = _a.replaceText,
+          matchCase = _a.matchCase,
+          matchWord = _a.matchWord,
+          useRegExp = _a.useRegExp;
+      var searchOptions = {
+        text: searchText,
+        matchWord: matchWord,
+        matchCase: matchCase,
+        useRegExp: useRegExp
+      };
+      view.dispatch(kendo_editor_common_1.replaceAll(view.state, replaceText, searchOptions));
+      this.setNextState({});
+    },
+    onKeyDown: function onKeyDown(event) {
+      if (event.keyCode === enter) {
+        this.onFindNext();
+      } else if (event.keyCode === esc) {
+        this.onClose();
+      }
+    },
+    onMatchCaseChecked: function onMatchCaseChecked(e) {
+      this.matchCase = e.target.checked;
+      this.setNextState();
+    },
+    onMatchWordChecked: function onMatchWordChecked(e) {
+      this.matchWord = e.target.checked;
+      this.setNextState();
+    },
+    onMatchCyclicChecked: function onMatchCyclicChecked(e) {
+      this.matchCyclic = e.target.checked;
+      this.setNextState();
+    },
+    onUseRegExpChecked: function onUseRegExpChecked(e) {
+      this.useRegExp = e.target.checked;
+      this.setNextState();
+    },
+    onSearchChange: function onSearchChange(e) {
+      this.searchText = e.target.value;
+      this.setNextState();
+    },
+    onReplaceChange: function onReplaceChange(e) {
+      this.replaceText = e.target.value;
+      this.setNextState();
+    },
+    setNextState: function setNextState() {
+      var view = this.$props.view;
+
+      if (this.searchText) {
+        var searchOptions = {
+          text: this.searchText,
+          matchWord: this.matchWord,
+          matchCase: this.matchCase,
+          useRegExp: this.useRegExp
+        };
+        var selection_1 = view.state.selection;
+        var matches = kendo_editor_common_1.findAll(view.state.doc, searchOptions);
+        var nextMatch = !this.searchText && matches[0] || matches.find(function (match) {
+          return match.from >= selection_1.from;
+        }) || this.matchCyclic && matches[0] || undefined;
+        this.matches = matches;
+        this.nextMatch = nextMatch;
+      } else {
+        this.matches = undefined;
+        this.nextMatch = undefined;
+      }
+    }
+  }
+};
+exports.FindAndReplaceDialog = FindAndReplaceDialog;
+var FindAndReplaceDialogVue3 = FindAndReplaceDialog;
+exports.FindAndReplaceDialogVue3 = FindAndReplaceDialogVue3;