@progress/kendo-react-editor 9.0.0-develop.1 → 9.0.0-develop.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +27 -26
- package/config/toolsSettings.mjs +31 -11
- package/dialogs/FindReplace.js +1 -1
- package/dialogs/FindReplace.mjs +56 -48
- package/dist/cdn/js/kendo-react-editor.js +1 -1
- package/index.d.mts +1 -4
- package/index.d.ts +1 -4
- package/messages/index.mjs +2 -0
- package/package-metadata.mjs +1 -1
- package/package.json +11 -11
- package/tools/cleanFormatting.mjs +5 -8
- package/tools/findReplace.mjs +16 -21
- package/tools/indent.mjs +3 -1
- package/tools/insertImage.mjs +25 -22
- package/tools/insertLink.mjs +25 -22
- package/tools/insertTable/popupGrid.mjs +14 -20
- package/tools/lists-styled.js +1 -1
- package/tools/lists-styled.mjs +26 -16
- package/tools/outdent.mjs +8 -2
- package/tools/pdf.mjs +3 -6
- package/tools/print.mjs +3 -6
- package/tools/proseMirrorTool.mjs +4 -1
- package/tools/selectAll.mjs +3 -6
- package/tools/table-wizard/cellPropsUtils.js +1 -1
- package/tools/table-wizard/cellPropsUtils.mjs +39 -36
- package/tools/table-wizard/tableCellProperties.mjs +81 -21
- package/tools/table-wizard/tableProperties.mjs +183 -62
- package/tools/table-wizard/utils.mjs +5 -4
- package/tools/unlink.mjs +7 -2
- package/tools/utils.js +1 -1
- package/tools/utils.mjs +6 -6
- package/tools/viewHtml.mjs +23 -20
- package/utils/index.mjs +5 -1
package/README.md
CHANGED
|
@@ -5,10 +5,11 @@
|
|
|
5
5
|
# KendoReact WYSIWYG Editor Component for React
|
|
6
6
|
|
|
7
7
|
> **Important**
|
|
8
|
-
>
|
|
9
|
-
>
|
|
10
|
-
>
|
|
11
|
-
>
|
|
8
|
+
>
|
|
9
|
+
> - This package is а part of [KendoReact](https://www.telerik.com/kendo-react-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)—a commercial UI library.
|
|
10
|
+
> - You will need to install a license key when adding the package to your project. For more information, please refer to the [KendoReact My License page](https://www.telerik.com/kendo-react-ui/components/my-license/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor).
|
|
11
|
+
> - To receive a license key, you need to either [purchase a license](https://www.telerik.com/kendo-react-ui/pricing?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor) or register for a [free trial](https://www.telerik.com/try/kendo-react-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor). Doing so indicates that you [accept the KendoReact License Agreement](https://www.telerik.com/purchase/license-agreement/progress-kendoreact?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor).
|
|
12
|
+
> - The 30-day free trial gives you access to all the KendoReact components and their full functionality. Additionally, for the period of your license, you get access to our legendary technical support provided directly by the KendoReact dev team!
|
|
12
13
|
>
|
|
13
14
|
> [Start using KendoReact](https://www.telerik.com/try/kendo-react-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor) and speed up your development process!
|
|
14
15
|
|
|
@@ -18,38 +19,38 @@
|
|
|
18
19
|
|
|
19
20
|
Among the features which the KendoReact Editor component delivers are:
|
|
20
21
|
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
22
|
+
- [Ready-to-use, customizable toolset](https://www.telerik.com/kendo-react-ui/components/editor/tools/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)—The Editor provides a rich set of built-in, user-interface tools. It also enables you to customize each one of them and/or add custom ones.
|
|
23
|
+
- [Custom rendering](https://www.telerik.com/kendo-react-ui/components/editor/custom-rendering/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)—The Editor provides options for customizing the way it renders its elements—for example, HTML wrapper element, tools, and dialogs.
|
|
24
|
+
- [Get and/or set HTML content](https://www.telerik.com/kendo-react-ui/components/editor/content/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)—You can programmatically get the HTML content of the Editor and/or set an updated version back.
|
|
25
|
+
- [Sanitizing pasted HTML content](https://www.telerik.com/kendo-react-ui/components/editor/paste/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)—A set of built-in functions look after sanitizing the content which the user pastes in the content area of the editor.
|
|
26
|
+
- [Plugins](https://www.telerik.com/kendo-react-ui/components/editor/plugins/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)—Various ways to extend and customize the functionality and features of the editor by using different plugins.
|
|
27
|
+
- [Modifying the schema](https://www.telerik.com/kendo-react-ui/components/editor/schema/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)—By modifying the default, built-in schema, you can add additional types of nodes and marks as well as edit and remove the existing ones. This results in more tailored and customizable experience for the users.
|
|
28
|
+
- [Globalization](https://www.telerik.com/kendo-react-ui/components/editor/globalization/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)—By using the available globalization options in KendoReact, you can translate the Editor messages by adapting them to specific culture locales.
|
|
29
|
+
- [Theme support](https://www.telerik.com/kendo-react-ui/components/styling/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)—The KendoReact Editor, as well as all 100+ components in the KendoReact suite, are styled in three polished themes (Bootstrap, Material, and Default) and can be further customized to match your specific design guidelines.
|
|
29
30
|
|
|
30
31
|
## Support Options
|
|
31
32
|
|
|
32
33
|
For any issues you might encounter while working with the KendoReact Editor, use any of the available support channels:
|
|
33
34
|
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
35
|
+
- Industry-leading technical support—KendoReact paid license holders and users with an active (free) trial license can take advantage of our outstanding customer support. To submit a ticket, use [the dedicated KendoReact support system](https://www.telerik.com/account/support-tickets?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor).
|
|
36
|
+
- Product forums—The [KendoReact forums](https://www.telerik.com/forums/kendo-ui-react?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor) are part of the free support you can get from the community and from the KendoReact team.
|
|
37
|
+
- Feedback portal—The [KendoReact feedback portal](https://feedback.telerik.com/kendo-react-ui?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor) is where you can request and vote for new features to be added.
|
|
37
38
|
|
|
38
39
|
## Resources
|
|
39
40
|
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
41
|
+
- [Getting Started with KendoReact](https://www.telerik.com/kendo-react-ui/components/getting-started/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)
|
|
42
|
+
- [Get Started with the KendoReact Editor](https://www.telerik.com/kendo-react-ui/components/editor/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)
|
|
43
|
+
- [API Reference of the KendoReact Editor](https://www.telerik.com/kendo-react-ui/components/editor/api/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)
|
|
44
|
+
- [KendoReact Roadmap](https://www.telerik.com/support/whats-new/kendo-react-ui/roadmap?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)
|
|
45
|
+
- [Blogs](https://www.telerik.com/blogs/tag/kendoreact?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)
|
|
46
|
+
- [Demos, documentation, and component reference](https://www.telerik.com/kendo-react-ui/components/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)
|
|
47
|
+
- [KendoReact pricing and licensing](https://www.telerik.com/kendo-react-ui/pricing?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)
|
|
48
|
+
- [Changelog](https://www.telerik.com/kendo-react-ui/components/changelogs/ui-for-react/?utm_medium=referral&utm_source=npm&utm_campaign=kendo-ui-react-trial-npm-editor)
|
|
48
49
|
|
|
49
50
|
High-level component overview pages
|
|
50
51
|
|
|
51
|
-
|
|
52
|
+
- [React Editor Component](https://www.telerik.com/kendo-react-ui/editor)
|
|
52
53
|
|
|
53
|
-
|
|
54
|
+
_Copyright © 2024 Progress Software Corporation and/or its subsidiaries or affiliates. All Rights Reserved._
|
|
54
55
|
|
|
55
|
-
|
|
56
|
+
_Progress, Telerik, and certain product names used herein are trademarks or registered trademarks of Progress Software Corporation and/or one of its subsidiaries or affiliates in the U.S. and/or other countries._
|
package/config/toolsSettings.mjs
CHANGED
|
@@ -371,11 +371,7 @@ var s;
|
|
|
371
371
|
value: "'Courier New', Courier, monospace",
|
|
372
372
|
style: { fontFamily: "'Courier New', Courier, monospace" }
|
|
373
373
|
},
|
|
374
|
-
{
|
|
375
|
-
text: "Georgia",
|
|
376
|
-
value: "Georgia, serif",
|
|
377
|
-
style: { fontFamily: "Georgia, serif" }
|
|
378
|
-
},
|
|
374
|
+
{ text: "Georgia", value: "Georgia, serif", style: { fontFamily: "Georgia, serif" } },
|
|
379
375
|
{
|
|
380
376
|
text: "Impact",
|
|
381
377
|
value: "Impact, Charcoal, sans-serif",
|
|
@@ -412,12 +408,36 @@ var s;
|
|
|
412
408
|
defaultItem: { text: i[e.format], value: "", localizationKey: e.format },
|
|
413
409
|
items: [
|
|
414
410
|
{ text: "Paragraph", value: "p", style: { display: "block", marginLeft: 0 } },
|
|
415
|
-
{
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
{
|
|
411
|
+
{
|
|
412
|
+
text: "Heading 1",
|
|
413
|
+
value: "h1",
|
|
414
|
+
style: { display: "block", fontSize: "2em", marginLeft: 0, fontWeight: "bold" }
|
|
415
|
+
},
|
|
416
|
+
{
|
|
417
|
+
text: "Heading 2",
|
|
418
|
+
value: "h2",
|
|
419
|
+
style: { display: "block", fontSize: "1.5em", marginLeft: 0, fontWeight: "bold" }
|
|
420
|
+
},
|
|
421
|
+
{
|
|
422
|
+
text: "Heading 3",
|
|
423
|
+
value: "h3",
|
|
424
|
+
style: { display: "block", fontSize: "1.17em", marginLeft: 0, fontWeight: "bold" }
|
|
425
|
+
},
|
|
426
|
+
{
|
|
427
|
+
text: "Heading 4",
|
|
428
|
+
value: "h4",
|
|
429
|
+
style: { display: "block", fontSize: "1em", marginLeft: 0, fontWeight: "bold" }
|
|
430
|
+
},
|
|
431
|
+
{
|
|
432
|
+
text: "Heading 5",
|
|
433
|
+
value: "h5",
|
|
434
|
+
style: { display: "block", fontSize: "0.83em", marginLeft: 0, fontWeight: "bold" }
|
|
435
|
+
},
|
|
436
|
+
{
|
|
437
|
+
text: "Heading 6",
|
|
438
|
+
value: "h6",
|
|
439
|
+
style: { display: "block", fontSize: "0.67em", marginLeft: 0, fontWeight: "bold" }
|
|
440
|
+
}
|
|
421
441
|
],
|
|
422
442
|
commandName: "FormatBlock"
|
|
423
443
|
}, n.foreColor = {
|
package/dialogs/FindReplace.js
CHANGED
|
@@ -5,4 +5,4 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=require("react"),
|
|
8
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const A=require("react"),E=require("@progress/kendo-react-buttons"),B=require("@progress/kendo-react-dialogs"),R=require("@progress/kendo-react-layout"),N=require("@progress/kendo-react-intl"),l=require("../messages/index.js"),j=require("../config/toolsSettings.js"),P=require("../tools/utils.js"),m=require("@progress/kendo-editor-common"),F=require("@progress/kendo-react-common"),f=require("@progress/kendo-react-inputs"),C=require("@progress/kendo-react-form"),M=require("@progress/kendo-svg-icons");function K(u){const s=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(u){for(const e in u)if(e!=="default"){const a=Object.getOwnPropertyDescriptor(u,e);Object.defineProperty(s,e,a.get?a:{enumerable:!0,get:()=>u[e]})}}return s.default=u,Object.freeze(s)}const t=K(A),U=13,_=27,V=j.EditorToolsSettings.findAndReplace;let w=class extends t.Component{constructor(s){super(s),this.onTabSelect=e=>{this.setState({selectedTab:e.selected})},this.onClose=()=>{const e=this.props.view,a=e.state,c=a.tr.setSelection(m.TextSelection.create(a.doc,a.selection.from,a.selection.to));e.updateState(a.apply(c)),e.focus(),this.props.onClose.call(void 0)},this.matchesMessage=e=>{const a=this.state.matches,c=this.state.nextMatch;let o=0,i=0;if(a&&c){const n=a.findIndex(r=>r.eq(c));o=n===-1?a.length:n+1,i=a.length}return P.formatString(e,o,i)},this.onFindNext=()=>{this.onFind()},this.onFindPrev=()=>{this.onFind(!0)},this.onFind=(e=!1)=>{const a=this.props.view,{searchText:c,matchCase:o,matchCyclic:i,matchWord:n,useRegExp:r}=this.state,h={text:c,matchWord:n,matchCase:o,useRegExp:r,backward:e,matchCyclic:i},d=m.find(a.state,h);if(d){const g=a.state.tr.setSelection(d);g.scrollIntoView(),a.updateState(a.state.apply(g)),this.setState({nextMatch:d})}},this.onReplace=()=>{const e=this.props.view,a=e.state.selection,{replaceText:c}=this.state;if(!a.empty){const o=a.from,i=o+c.length,n=m.replace(a,c,e.state.tr);n.setSelection(m.TextSelection.create(n.doc,o,i)),n.scrollIntoView(),e.dispatch(n),this.setNextState({})}},this.onReplaceAll=()=>{const e=this.props.view,{searchText:a,replaceText:c,matchCase:o,matchWord:i,useRegExp:n}=this.state,r={text:a,matchWord:i,matchCase:o,useRegExp:n},h=m.replaceAll(e.state,c,r);h&&e.dispatch(h),this.setNextState({})},this.onKeyDown=e=>{e.keyCode===U?this.onFindNext():e.keyCode===_&&this.onClose()},this.onMatchCaseChecked=e=>this.setNextState({matchCase:e.value}),this.onMatchWordChecked=e=>this.setNextState({matchWord:e.value}),this.onMatchCyclicChecked=e=>this.setNextState({matchCyclic:e.value}),this.onUseRegExpChecked=e=>this.setNextState({useRegExp:e.value}),this.onSearchChange=e=>this.setNextState({searchText:e.target.value}),this.onReplaceChange=e=>this.setNextState({replaceText:e.target.value}),this.setNextState=e=>{const a={...this.state,...e,matches:void 0,nextMatch:void 0},c=this.props.view;if(a.searchText){const{searchText:o,matchWord:i,matchCase:n,useRegExp:r,matchCyclic:h}=a,d={text:o,matchWord:i,matchCase:n,useRegExp:r},g=c.state.selection,p=m.findAll(c.state.doc,d),S=x=>!x&&p[0]||p.find(k=>k.from>=g.from)||h&&p[0]||void 0;this.setState(x=>({...a,matches:p,nextMatch:S(x.searchText)}))}else this.setState(a)},this.state={selectedTab:0,searchText:m.selectedLineTextOnly(s.view.state),replaceText:"",matchCase:!1,matchWord:!1,matchCyclic:!1,useRegExp:!1}}get settings(){return this.props.settings||V}componentDidUpdate(s,e){const a=this.props.view,{matches:c=[],nextMatch:o}=this.state;if(e.nextMatch!==o){const i=a.state,n=i.tr,r=[];c.forEach(h=>{r.push({from:h.from,to:h.to,attrs:{class:o&&h.eq(o)?"k-text-selected":"k-text-highlighted"}})}),n.setMeta(m.textHighlightKey,r),n.setSelection(o||m.TextSelection.create(i.doc,i.selection.from)),a.dispatch(n)}}render(){const s=N.provideLocalizationService(this),{findReplaceDialogTitle:e,findReplaceTabFind:a,findReplaceTabReplace:c,findReplaceFindWhat:o,findReplaceReplaceWith:i,findReplaceReplace:n,findReplaceReplaceAll:r,findReplaceMatchCase:h,findReplaceMatchWord:d,findReplaceMatchCyclic:g,findReplaceUseRegExp:p,findReplacePrevMatch:S,findReplaceNextMatch:x,findReplaceMatches:k}=this.settings.messages,{matchCase:W,matchWord:L,matchCyclic:q,useRegExp:I,searchText:D,replaceText:O,nextMatch:b}=this.state,v=t.createElement("div",{className:"k-search-options"},t.createElement("span",null,t.createElement(f.Checkbox,{id:"match-case",checked:W,onChange:this.onMatchCaseChecked}),t.createElement("label",{htmlFor:"match-case",className:"k-checkbox-label"},s.toLanguageString(h,l.messages[h]))),t.createElement("span",null,t.createElement(f.Checkbox,{id:"match-whole",checked:L,onChange:this.onMatchWordChecked}),t.createElement("label",{htmlFor:"match-whole",className:"k-checkbox-label"},s.toLanguageString(d,l.messages[d]))),t.createElement("span",null,t.createElement(f.Checkbox,{id:"match-cyclic",checked:q,onChange:this.onMatchCyclicChecked}),t.createElement("label",{htmlFor:"match-cyclic",className:"k-checkbox-label"},s.toLanguageString(g,l.messages[g]))),t.createElement("span",null,t.createElement(f.Checkbox,{id:"regular-expression",checked:I,onChange:this.onUseRegExpChecked}),t.createElement("label",{htmlFor:"regular-expression",className:"k-checkbox-label"},s.toLanguageString(p,l.messages[p])))),T=t.createElement("div",{className:"k-matches-container"},t.createElement(E.Button,{fillMode:"flat",themeColor:"primary",onClick:this.onFindPrev},t.createElement(F.IconWrap,{name:"chevron-left",icon:M.chevronLeftIcon}),s.toLanguageString(S,l.messages[S])),t.createElement("span",null,this.matchesMessage(s.toLanguageString(k,l.messages[k]))),t.createElement(E.Button,{fillMode:"flat",themeColor:"primary",onClick:this.onFindNext},s.toLanguageString(x,l.messages[x]),t.createElement(F.IconWrap,{name:"chevron-right",icon:M.chevronRightIcon}))),y=t.createElement(C.Form,{render:()=>t.createElement(C.FormElement,{horizontal:!0},t.createElement(C.FieldWrapper,null,t.createElement("label",{htmlFor:"findWhat",className:"k-form-label"},s.toLanguageString(o,l.messages[o])),t.createElement("div",{className:"k-form-field-wrap"},t.createElement(f.Input,{id:"findWhat",type:"text",value:D,onChange:this.onSearchChange,onFocus:this.onSearchChange,onKeyDown:this.onKeyDown,autoFocus:!0}))))}),z=t.createElement(C.Form,{render:()=>t.createElement(C.FormElement,{horizontal:!0},t.createElement(C.FieldWrapper,null,t.createElement("label",{htmlFor:"replaceWith",className:"k-form-label"},s.toLanguageString(i,l.messages[i])),t.createElement("div",{className:"k-form-field-wrap"},t.createElement(f.Input,{id:"replaceWith",type:"text",value:O,onChange:this.onReplaceChange}))))});return t.createElement(B.Window,{title:s.toLanguageString(e,l.messages[e]),onClose:this.onClose,style:{width:"auto",height:"auto",userSelect:"none"},resizable:!1,minimizeButton:()=>null,maximizeButton:()=>null},t.createElement(R.TabStrip,{selected:this.state.selectedTab,className:"k-editor-find-replace",onSelect:this.onTabSelect,animation:!1},t.createElement(R.TabStripTab,{title:s.toLanguageString(a,l.messages[a])},y,v,T),t.createElement(R.TabStripTab,{title:s.toLanguageString(c,l.messages[c])},y,z,t.createElement("div",{className:"k-actions k-hstack k-justify-content-end"},t.createElement(E.Button,{disabled:!b,onClick:this.onReplace},s.toLanguageString(n,l.messages[n])),t.createElement(E.Button,{disabled:!b,onClick:this.onReplaceAll},s.toLanguageString(r,l.messages[r]))),v,T)))}};N.registerForLocalization(w);exports.FindAndReplaceDialog=w;
|
package/dialogs/FindReplace.mjs
CHANGED
|
@@ -7,17 +7,17 @@
|
|
|
7
7
|
*/
|
|
8
8
|
"use client";
|
|
9
9
|
import * as e from "react";
|
|
10
|
-
import { Button as
|
|
11
|
-
import { Window as
|
|
12
|
-
import { TabStrip as
|
|
13
|
-
import { registerForLocalization as
|
|
10
|
+
import { Button as x } from "@progress/kendo-react-buttons";
|
|
11
|
+
import { Window as K } from "@progress/kendo-react-dialogs";
|
|
12
|
+
import { TabStrip as O, TabStripTab as b } from "@progress/kendo-react-layout";
|
|
13
|
+
import { registerForLocalization as U, provideLocalizationService as B } from "@progress/kendo-react-intl";
|
|
14
14
|
import { messages as l } from "../messages/index.mjs";
|
|
15
15
|
import { EditorToolsSettings as P } from "../config/toolsSettings.mjs";
|
|
16
16
|
import { formatString as q } from "../tools/utils.mjs";
|
|
17
|
-
import { TextSelection as
|
|
17
|
+
import { TextSelection as E, find as V, replace as j, replaceAll as H, findAll as _, selectedLineTextOnly as $, textHighlightKey as G } from "@progress/kendo-editor-common";
|
|
18
18
|
import { IconWrap as T } from "@progress/kendo-react-common";
|
|
19
|
-
import { Checkbox as
|
|
20
|
-
import { Form as
|
|
19
|
+
import { Checkbox as C, Input as y } from "@progress/kendo-react-inputs";
|
|
20
|
+
import { Form as M, FormElement as F, FieldWrapper as N } from "@progress/kendo-react-form";
|
|
21
21
|
import { chevronLeftIcon as J, chevronRightIcon as Q } from "@progress/kendo-svg-icons";
|
|
22
22
|
const X = 13, Y = 27, Z = P.findAndReplace;
|
|
23
23
|
let ee = class extends e.Component {
|
|
@@ -25,7 +25,9 @@ let ee = class extends e.Component {
|
|
|
25
25
|
super(o), this.onTabSelect = (t) => {
|
|
26
26
|
this.setState({ selectedTab: t.selected });
|
|
27
27
|
}, this.onClose = () => {
|
|
28
|
-
const t = this.props.view, a = t.state, n = a.tr.setSelection(
|
|
28
|
+
const t = this.props.view, a = t.state, n = a.tr.setSelection(
|
|
29
|
+
E.create(a.doc, a.selection.from, a.selection.to)
|
|
30
|
+
);
|
|
29
31
|
t.updateState(a.apply(n)), t.focus(), this.props.onClose.call(void 0);
|
|
30
32
|
}, this.matchesMessage = (t) => {
|
|
31
33
|
const a = this.state.matches, n = this.state.nextMatch;
|
|
@@ -49,7 +51,7 @@ let ee = class extends e.Component {
|
|
|
49
51
|
const t = this.props.view, a = t.state.selection, { replaceText: n } = this.state;
|
|
50
52
|
if (!a.empty) {
|
|
51
53
|
const s = a.from, i = s + n.length, c = j(a, n, t.state.tr);
|
|
52
|
-
c.setSelection(
|
|
54
|
+
c.setSelection(E.create(c.doc, s, i)), c.scrollIntoView(), t.dispatch(c), this.setNextState({});
|
|
53
55
|
}
|
|
54
56
|
}, this.onReplaceAll = () => {
|
|
55
57
|
const t = this.props.view, { searchText: a, replaceText: n, matchCase: s, matchWord: i, useRegExp: c } = this.state, r = { text: a, matchWord: i, matchCase: s, useRegExp: c }, h = H(t.state, n, r);
|
|
@@ -57,15 +59,19 @@ let ee = class extends e.Component {
|
|
|
57
59
|
}, this.onKeyDown = (t) => {
|
|
58
60
|
t.keyCode === X ? this.onFindNext() : t.keyCode === Y && this.onClose();
|
|
59
61
|
}, this.onMatchCaseChecked = (t) => this.setNextState({ matchCase: t.value }), this.onMatchWordChecked = (t) => this.setNextState({ matchWord: t.value }), this.onMatchCyclicChecked = (t) => this.setNextState({ matchCyclic: t.value }), this.onUseRegExpChecked = (t) => this.setNextState({ useRegExp: t.value }), this.onSearchChange = (t) => this.setNextState({ searchText: t.target.value }), this.onReplaceChange = (t) => this.setNextState({ replaceText: t.target.value }), this.setNextState = (t) => {
|
|
60
|
-
const a = {
|
|
62
|
+
const a = {
|
|
63
|
+
...this.state,
|
|
64
|
+
...t,
|
|
65
|
+
matches: void 0,
|
|
66
|
+
nextMatch: void 0
|
|
67
|
+
}, n = this.props.view;
|
|
61
68
|
if (a.searchText) {
|
|
62
|
-
const { searchText: s, matchWord: i, matchCase: c, useRegExp: r, matchCyclic: h } = a, m = { text: s, matchWord: i, matchCase: c, useRegExp: r }, d = n.state.selection, p = _(n.state.doc, m);
|
|
63
|
-
|
|
64
|
-
this.setState({
|
|
69
|
+
const { searchText: s, matchWord: i, matchCase: c, useRegExp: r, matchCyclic: h } = a, m = { text: s, matchWord: i, matchCase: c, useRegExp: r }, d = n.state.selection, p = _(n.state.doc, m), f = (g) => !g && p[0] || p.find((u) => u.from >= d.from) || h && p[0] || void 0;
|
|
70
|
+
this.setState((g) => ({
|
|
65
71
|
...a,
|
|
66
72
|
matches: p,
|
|
67
|
-
nextMatch: g
|
|
68
|
-
});
|
|
73
|
+
nextMatch: f(g.searchText)
|
|
74
|
+
}));
|
|
69
75
|
} else
|
|
70
76
|
this.setState(a);
|
|
71
77
|
}, this.state = {
|
|
@@ -96,14 +102,14 @@ let ee = class extends e.Component {
|
|
|
96
102
|
class: s && h.eq(s) ? "k-text-selected" : "k-text-highlighted"
|
|
97
103
|
}
|
|
98
104
|
});
|
|
99
|
-
}), c.setMeta(G, r), c.setSelection(s ||
|
|
105
|
+
}), c.setMeta(G, r), c.setSelection(s || E.create(i.doc, i.selection.from)), a.dispatch(c);
|
|
100
106
|
}
|
|
101
107
|
}
|
|
102
108
|
/**
|
|
103
109
|
* @hidden
|
|
104
110
|
*/
|
|
105
111
|
render() {
|
|
106
|
-
const o =
|
|
112
|
+
const o = B(this), {
|
|
107
113
|
findReplaceDialogTitle: t,
|
|
108
114
|
findReplaceTabFind: a,
|
|
109
115
|
findReplaceTabReplace: n,
|
|
@@ -115,31 +121,21 @@ let ee = class extends e.Component {
|
|
|
115
121
|
findReplaceMatchWord: m,
|
|
116
122
|
findReplaceMatchCyclic: d,
|
|
117
123
|
findReplaceUseRegExp: p,
|
|
118
|
-
findReplacePrevMatch:
|
|
119
|
-
findReplaceNextMatch:
|
|
120
|
-
findReplaceMatches:
|
|
121
|
-
} = this.settings.messages, { matchCase: w, matchWord: W, matchCyclic: L, useRegExp: A, searchText: z, replaceText: D, nextMatch: S } = this.state, k = /* @__PURE__ */ e.createElement("div", { className: "k-search-options" }, /* @__PURE__ */ e.createElement("span", null, /* @__PURE__ */ e.createElement(
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
/* @__PURE__ */ e.createElement(T, { name: "chevron-left", icon: J }),
|
|
129
|
-
o.toLanguageString(g, l[g])
|
|
130
|
-
), /* @__PURE__ */ e.createElement("span", null, this.matchesMessage(o.toLanguageString(E, l[E]))), /* @__PURE__ */ e.createElement(
|
|
131
|
-
u,
|
|
132
|
-
{
|
|
133
|
-
fillMode: "flat",
|
|
134
|
-
themeColor: "primary",
|
|
135
|
-
onClick: this.onFindNext
|
|
136
|
-
},
|
|
137
|
-
o.toLanguageString(f, l[f]),
|
|
138
|
-
/* @__PURE__ */ e.createElement(T, { name: "chevron-right", icon: Q })
|
|
139
|
-
)), v = /* @__PURE__ */ e.createElement(
|
|
140
|
-
F,
|
|
124
|
+
findReplacePrevMatch: f,
|
|
125
|
+
findReplaceNextMatch: g,
|
|
126
|
+
findReplaceMatches: u
|
|
127
|
+
} = this.settings.messages, { matchCase: w, matchWord: W, matchCyclic: L, useRegExp: A, searchText: z, replaceText: D, nextMatch: S } = this.state, k = /* @__PURE__ */ e.createElement("div", { className: "k-search-options" }, /* @__PURE__ */ e.createElement("span", null, /* @__PURE__ */ e.createElement(C, { id: "match-case", checked: w, onChange: this.onMatchCaseChecked }), /* @__PURE__ */ e.createElement("label", { htmlFor: "match-case", className: "k-checkbox-label" }, o.toLanguageString(h, l[h]))), /* @__PURE__ */ e.createElement("span", null, /* @__PURE__ */ e.createElement(C, { id: "match-whole", checked: W, onChange: this.onMatchWordChecked }), /* @__PURE__ */ e.createElement("label", { htmlFor: "match-whole", className: "k-checkbox-label" }, o.toLanguageString(m, l[m]))), /* @__PURE__ */ e.createElement("span", null, /* @__PURE__ */ e.createElement(C, { id: "match-cyclic", checked: L, onChange: this.onMatchCyclicChecked }), /* @__PURE__ */ e.createElement("label", { htmlFor: "match-cyclic", className: "k-checkbox-label" }, o.toLanguageString(
|
|
128
|
+
d,
|
|
129
|
+
l[d]
|
|
130
|
+
))), /* @__PURE__ */ e.createElement("span", null, /* @__PURE__ */ e.createElement(C, { id: "regular-expression", checked: A, onChange: this.onUseRegExpChecked }), /* @__PURE__ */ e.createElement("label", { htmlFor: "regular-expression", className: "k-checkbox-label" }, o.toLanguageString(p, l[p])))), R = /* @__PURE__ */ e.createElement("div", { className: "k-matches-container" }, /* @__PURE__ */ e.createElement(x, { fillMode: "flat", themeColor: "primary", onClick: this.onFindPrev }, /* @__PURE__ */ e.createElement(T, { name: "chevron-left", icon: J }), o.toLanguageString(f, l[f])), /* @__PURE__ */ e.createElement("span", null, this.matchesMessage(
|
|
131
|
+
o.toLanguageString(u, l[u])
|
|
132
|
+
)), /* @__PURE__ */ e.createElement(x, { fillMode: "flat", themeColor: "primary", onClick: this.onFindNext }, o.toLanguageString(g, l[g]), /* @__PURE__ */ e.createElement(T, { name: "chevron-right", icon: Q }))), v = /* @__PURE__ */ e.createElement(
|
|
133
|
+
M,
|
|
141
134
|
{
|
|
142
|
-
render: () => /* @__PURE__ */ e.createElement(
|
|
135
|
+
render: () => /* @__PURE__ */ e.createElement(F, { horizontal: !0 }, /* @__PURE__ */ e.createElement(N, null, /* @__PURE__ */ e.createElement("label", { htmlFor: "findWhat", className: "k-form-label" }, o.toLanguageString(
|
|
136
|
+
s,
|
|
137
|
+
l[s]
|
|
138
|
+
)), /* @__PURE__ */ e.createElement("div", { className: "k-form-field-wrap" }, /* @__PURE__ */ e.createElement(
|
|
143
139
|
y,
|
|
144
140
|
{
|
|
145
141
|
id: "findWhat",
|
|
@@ -153,9 +149,12 @@ let ee = class extends e.Component {
|
|
|
153
149
|
))))
|
|
154
150
|
}
|
|
155
151
|
), I = /* @__PURE__ */ e.createElement(
|
|
156
|
-
|
|
152
|
+
M,
|
|
157
153
|
{
|
|
158
|
-
render: () => /* @__PURE__ */ e.createElement(
|
|
154
|
+
render: () => /* @__PURE__ */ e.createElement(F, { horizontal: !0 }, /* @__PURE__ */ e.createElement(N, null, /* @__PURE__ */ e.createElement("label", { htmlFor: "replaceWith", className: "k-form-label" }, o.toLanguageString(
|
|
155
|
+
i,
|
|
156
|
+
l[i]
|
|
157
|
+
)), /* @__PURE__ */ e.createElement("div", { className: "k-form-field-wrap" }, /* @__PURE__ */ e.createElement(
|
|
159
158
|
y,
|
|
160
159
|
{
|
|
161
160
|
id: "replaceWith",
|
|
@@ -167,7 +166,7 @@ let ee = class extends e.Component {
|
|
|
167
166
|
}
|
|
168
167
|
);
|
|
169
168
|
return /* @__PURE__ */ e.createElement(
|
|
170
|
-
|
|
169
|
+
K,
|
|
171
170
|
{
|
|
172
171
|
title: o.toLanguageString(t, l[t]),
|
|
173
172
|
onClose: this.onClose,
|
|
@@ -177,7 +176,7 @@ let ee = class extends e.Component {
|
|
|
177
176
|
maximizeButton: () => null
|
|
178
177
|
},
|
|
179
178
|
/* @__PURE__ */ e.createElement(
|
|
180
|
-
|
|
179
|
+
O,
|
|
181
180
|
{
|
|
182
181
|
selected: this.state.selectedTab,
|
|
183
182
|
className: "k-editor-find-replace",
|
|
@@ -196,11 +195,20 @@ let ee = class extends e.Component {
|
|
|
196
195
|
/* @__PURE__ */ e.createElement(
|
|
197
196
|
b,
|
|
198
197
|
{
|
|
199
|
-
title: o.toLanguageString(
|
|
198
|
+
title: o.toLanguageString(
|
|
199
|
+
n,
|
|
200
|
+
l[n]
|
|
201
|
+
)
|
|
200
202
|
},
|
|
201
203
|
v,
|
|
202
204
|
I,
|
|
203
|
-
/* @__PURE__ */ e.createElement("div", { className: "k-actions k-hstack k-justify-content-end" }, /* @__PURE__ */ e.createElement(
|
|
205
|
+
/* @__PURE__ */ e.createElement("div", { className: "k-actions k-hstack k-justify-content-end" }, /* @__PURE__ */ e.createElement(x, { disabled: !S, onClick: this.onReplace }, o.toLanguageString(
|
|
206
|
+
c,
|
|
207
|
+
l[c]
|
|
208
|
+
)), /* @__PURE__ */ e.createElement(x, { disabled: !S, onClick: this.onReplaceAll }, o.toLanguageString(
|
|
209
|
+
r,
|
|
210
|
+
l[r]
|
|
211
|
+
))),
|
|
204
212
|
k,
|
|
205
213
|
R
|
|
206
214
|
)
|
|
@@ -208,7 +216,7 @@ let ee = class extends e.Component {
|
|
|
208
216
|
);
|
|
209
217
|
}
|
|
210
218
|
};
|
|
211
|
-
|
|
219
|
+
U(ee);
|
|
212
220
|
export {
|
|
213
221
|
ee as FindAndReplaceDialog
|
|
214
222
|
};
|