@progress/kendo-react-editor 14.5.0-develop.14 → 14.5.0-develop.16
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/Editor.js +1 -1
- package/Editor.mjs +94 -78
- package/dist/cdn/js/kendo-react-editor.js +1 -1
- package/messages/index.d.ts +4 -0
- package/messages/index.js +1 -1
- package/messages/index.mjs +202 -198
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +12 -12
- package/tools/align.js +1 -1
- package/tools/align.mjs +19 -18
- package/tools/indent.js +1 -1
- package/tools/indent.mjs +18 -17
- package/tools/inlineFormat.js +1 -1
- package/tools/inlineFormat.mjs +23 -22
- package/tools/outdent.js +1 -1
- package/tools/outdent.mjs +23 -22
- package/tools/proseMirrorTool.js +1 -1
- package/tools/proseMirrorTool.mjs +19 -18
package/Editor.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 strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
8
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const N=require("react"),i=require("prop-types"),w=require("@progress/kendo-react-buttons"),C=require("@progress/kendo-react-common"),o=require("@progress/kendo-editor-common"),S=require("./config/defaultStyles.js"),q=require("./config/toolsSettings.js"),x=require("./dialogs/index.js"),L=require("./utils/index.js"),D=require("./utils/props-key.js"),A=require("./utils/controlled-value.js"),B=require("./package-metadata.js"),h=require("./messages/index.js"),O=require("@progress/kendo-react-intl");function I(g){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(g){for(const e in g)if(e!=="default"){const t=Object.getOwnPropertyDescriptor(g,e);Object.defineProperty(c,e,t.get?t:{enumerable:!0,get:()=>g[e]})}}return c.default=g,Object.freeze(c)}const p=I(N),{link:M,bold:F,italic:W,underline:j}=q.EditorToolsSettings,P=class P extends p.Component{constructor(c){super(c),this.state={view:void 0,linkDialog:!1},this._element=null,this._contentElement=null,this.iframe=null,this.trOnChange=null,this.htmlOnChange=null,this.showLicenseWatermark=!1,this.focus=()=>{this.view&&this.view.focus()},this.renderDialog=(e,t,s)=>this.state[s]&&p.createElement(e,{view:this.view,settings:t,dir:this.props.dir,onClose:()=>this.setState({[s]:!1})}),this.renderTool=(e,t,s=!1)=>{const d=p.createElement(e,{view:this.view,dir:this.props.dir,key:t,className:s?"k-toolbar-button":void 0});return d.type===w.ToolbarSeparator?p.createElement(e,{key:t}):d},this.updateTools=(e,t)=>{this.setState({view:e})},this.filterTransaction=(e,t)=>{const s={target:this,transaction:e,state:t};return(this.props.onExecute&&this.props.onExecute.call(void 0,s))!==!1},this.onPasteHtml=e=>{if(this.props.onPasteHtml&&this.pasteEvent){const t={target:this,pastedHtml:e,nativeEvent:this.pasteEvent},s=this.props.onPasteHtml.call(void 0,t);if(this.pasteEvent=void 0,typeof s=="string")return s}return e},this.dispatchTransaction=e=>{const t=e.docChanged;if(this.props.onChange&&t){this.trOnChange=e;const s=e.doc,d=e.doc.type.schema,u={target:this,value:s,html:"",transaction:e,schema:d};Object.defineProperty(u,"html",{get:()=>(this.htmlOnChange=L.EditorUtils.getHtml({doc:s,schema:d}),this.htmlOnChange)}),this.props.onChange.call(void 0,u)}this.view&&(this.props.value===void 0||!t)&&this.view.updateState(this.view.state.apply(e))},this.onFocus=(e,t)=>{if(this.props.onFocus){const s={target:this,nativeEvent:t};this.props.onFocus.call(void 0,s)}return!1},this.onBlur=(e,t)=>{if(this.props.onBlur){const s={target:this,nativeEvent:t};this.props.onBlur.call(void 0,s)}return!1},this.onPaste=(e,t)=>(this.props.onPasteHtml&&(this.pasteEvent=t),!1),this.onIFrameInit=e=>{if(this.props.onIFrameInit){const t={target:this,iframe:e};this.props.onIFrameInit.call(void 0,t)}return!1},this.showLicenseWatermark=!C.validatePackage(B.packageMetadata,{component:"Editor"}),this.licenseMessage=C.getLicenseMessage(B.packageMetadata)}get value(){return this.trOnChange!==null?this.trOnChange.doc:this.props.value!==void 0?this.props.value:this.view?this.view.state.doc:this.props.defaultContent||""}get element(){return this._element}get contentElement(){return this._contentElement}get view(){return this._view}componentDidMount(){this.initialize()}componentDidUpdate(c){const{value:e}=this.props,t=this.view;e===void 0||!t||(A.updateEditorValue(t,e,c.value,this.trOnChange,this.htmlOnChange),this.trOnChange=null,this.htmlOnChange=null)}componentWillUnmount(){var e;this.view&&this.view.destroy(),this._view=void 0;const c=(e=this.iframe)==null?void 0:e.contentWindow;if(c){this._contentElement&&this._contentElement.parentNode&&this._contentElement.parentNode.removeChild(this._contentElement);const t=c.document.head;for(;t&&t.firstChild;)t.removeChild(t.firstChild)}}render(){const{tools:c=[],defaultEditMode:e="iframe",preserveWhitespace:t="full",style:s,className:d}=this.props,u=O.provideLocalizationService(this),f=this.props.ariaLabel||u.toLanguageString(h.keys.contentAreaLabel,h.messages[h.keys.contentAreaLabel]);if(this.view){const r=D.editorPropsKey.getState(this.view.state);r.preserveWhitespace=t}let m=this.props.contentStyle;m===void 0&&(s||{}).height===void 0&&(m={height:"300px"});const v=(r,n)=>r.displayName||r.name||`tool-${n}`,k=(r,n)=>r.map((a,l)=>v(a,l)).join("-")||`group-${n}`,E=c.map((r,n)=>Array.isArray(r)?p.createElement(w.ButtonGroup,{key:k(r,n),className:"k-toolbar-button-group"},r.map((a,l)=>this.renderTool(a,v(a,l)))):this.renderTool(r,v(r,n),!0));return p.createElement("div",{ref:r=>{this._element=r},className:C.classNames("k-editor",d,{"k-editor-resizable":this.props.resizable}),dir:this.props.dir,style:s},E.length>0&&p.createElement(w.Toolbar,{className:"k-editor-toolbar",ariaLabel:u.toLanguageString(h.keys.toolbarAriaLabel,h.messages[h.keys.toolbarAriaLabel]),keyboardNavigation:this.props.keyboardNavigation},E),e==="iframe"?p.createElement("iframe",{ref:r=>{this.iframe=r},frameBorder:"0",title:u.toLanguageString(h.keys.iframeTitle,h.messages[h.keys.iframeTitle]),style:m,className:"k-iframe"}):p.createElement("div",{ref:r=>{this._contentElement=r},style:m,className:"k-editor-content",role:"textbox","aria-labelledby":this.props.ariaLabelledBy,"aria-describedby":this.props.ariaDescribedBy,"aria-label":f,suppressContentEditableWarning:!0}),this.renderDialog(x.EditorDialogs.InsertLinkDialog,M,"linkDialog"),this.showLicenseWatermark&&p.createElement(C.WatermarkOverlay,{message:this.licenseMessage}))}initialize(){const c=this.iframe&&this.iframe.contentWindow;if(c){const n=c.document,a=n.createElement("meta");a.setAttribute("charset","utf-8"),n.head.appendChild(a),this._contentElement=n.createElement("div"),n.body.appendChild(this._contentElement),this._contentElement.classList.add("k-content"),this._contentElement.setAttribute("role","textbox"),this.props.ariaLabelledBy&&this._contentElement.setAttribute("aria-labelledby",this.props.ariaLabelledBy),this.props.ariaDescribedBy&&this._contentElement.setAttribute("aria-describedby",this.props.ariaDescribedBy),this._contentElement.setAttribute("aria-label",this.props.ariaLabel||O.provideLocalizationService(this).toLanguageString(h.keys.contentAreaLabel,h.messages[h.keys.contentAreaLabel])),this.iframe&&this.props.onIFrameInit?this.onIFrameInit(this.iframe):[S.defaultStyle,S.tablesStyles,this.props.dir==="rtl"?S.rtlStyles:void 0].forEach(l=>{if(l){const b=n.createElement("style");b.appendChild(n.createTextNode(l)),n.head.appendChild(b)}})}const e=this._contentElement;if(!e)return;const{preserveWhitespace:t="full"}=this.props,s=[new o.Plugin({view:(()=>({update:this.updateTools})),key:new o.PluginKey("toolbar-tools-update-plugin")}),new o.Plugin({filterTransaction:this.filterTransaction,key:new o.PluginKey("onExecute-event-plugin")}),new o.Plugin({key:D.editorPropsKey,state:{init:()=>({preserveWhitespace:t}),apply:(n,a)=>a}}),o.spacesFix(),o.caretColor(),o.history(),o.dropCursor(),o.gapCursor(),o.tableEditing(),o.cspFix()],d={...L.EditorUtils.getShortcuts({types:{listItem:"list_item",hardBreak:"hard_break"},toolsSettings:{bold:F,italic:W,underline:j}}),"Mod-k":()=>{const{linkDialog:n}=this.state,a=this.view;if(a){const l=a.state,b=l.selection.empty,y=o.getMark(l,l.schema.marks[M.mark]);!n&&!(b&&!y)&&this.setState({linkDialog:!0})}return!n},"Alt-F10":()=>{var a;const n=(a=this.element)==null?void 0:a.querySelector(".k-toolbar");if(n){const l=n.querySelector(w.toolbarButtons.join(","));if(l)return l.focus(),!0}return!1}},{defaultContent:u="",value:f,onMount:m}=this.props,v=f&&typeof f!="string"?f:L.EditorUtils.createDocument(new o.Schema({nodes:o.nodes,marks:o.marks}),f||u,{preserveWhitespace:t}),k={state:o.EditorState.create({plugins:[...s,o.keymap(d),o.keymap(o.baseKeymap)],doc:v}),transformPastedHTML:this.onPasteHtml,dispatchTransaction:this.dispatchTransaction,handleDOMEvents:{focus:this.onFocus,blur:this.onBlur,paste:this.onPaste},handleDrop:(n,a,l,b)=>{let y=!1;return l.content.nodesBetween(0,l.content.size,T=>{y=y||T.type.name==="table_caption_external"}),y}},E={plugins:s,shortcuts:d,target:this,viewProps:k,dom:e},r=this._view=m&&m.call(void 0,E)||new o.EditorView({mount:e},k);this.setState({view:r})}};P.propTypes={defaultContent:i.string,value:i.oneOfType([i.object,i.string]),defaultEditMode:i.oneOf(["iframe","div"]),contentStyle:i.object,dir:i.string,className:i.string,ariaDescribedBy:i.string,ariaLabelledBy:i.string,ariaLabel:i.string,style:i.object,tools:i.arrayOf(i.any),keyboardNavigation:i.bool,resizable:i.bool,preserveWhitespace:i.oneOf([!0,!1,"full"]),onMount:i.func,onFocus:i.func,onBlur:i.func,onChange:i.func,onPasteHtml:i.func,onExecute:i.func,onIFrameInit:i.func};let _=P;O.registerForLocalization(_);exports.Editor=_;
|
package/Editor.mjs
CHANGED
|
@@ -5,28 +5,28 @@
|
|
|
5
5
|
* Licensed under commercial license. See LICENSE.md in the package root for more information
|
|
6
6
|
*-------------------------------------------------------------------------------------------
|
|
7
7
|
*/
|
|
8
|
-
import * as
|
|
8
|
+
import * as c from "react";
|
|
9
9
|
import i from "prop-types";
|
|
10
|
-
import { ToolbarSeparator as
|
|
11
|
-
import { validatePackage as
|
|
12
|
-
import { Plugin as
|
|
13
|
-
import { defaultStyle as
|
|
14
|
-
import { EditorToolsSettings as
|
|
15
|
-
import { EditorDialogs as
|
|
16
|
-
import { EditorUtils as
|
|
17
|
-
import { editorPropsKey as
|
|
18
|
-
import { updateEditorValue as
|
|
19
|
-
import { packageMetadata as
|
|
20
|
-
import { keys as
|
|
21
|
-
import { provideLocalizationService as
|
|
22
|
-
const { link: P, bold: at, italic: lt, underline: ht } =
|
|
23
|
-
constructor(
|
|
24
|
-
super(
|
|
10
|
+
import { ToolbarSeparator as A, ButtonGroup as N, Toolbar as x, toolbarButtons as F } from "@progress/kendo-react-buttons";
|
|
11
|
+
import { validatePackage as I, getLicenseMessage as M, classNames as W, WatermarkOverlay as H } from "@progress/kendo-react-common";
|
|
12
|
+
import { Plugin as E, PluginKey as S, spacesFix as z, caretColor as j, history as K, dropCursor as V, gapCursor as U, tableEditing as q, cspFix as G, Schema as $, marks as R, nodes as J, EditorState as Q, keymap as T, baseKeymap as X, EditorView as Y, getMark as Z } from "@progress/kendo-editor-common";
|
|
13
|
+
import { defaultStyle as tt, tablesStyles as et, rtlStyles as it } from "./config/defaultStyles.mjs";
|
|
14
|
+
import { EditorToolsSettings as st } from "./config/toolsSettings.mjs";
|
|
15
|
+
import { EditorDialogs as nt } from "./dialogs/index.mjs";
|
|
16
|
+
import { EditorUtils as k } from "./utils/index.mjs";
|
|
17
|
+
import { editorPropsKey as B } from "./utils/props-key.mjs";
|
|
18
|
+
import { updateEditorValue as ot } from "./utils/controlled-value.mjs";
|
|
19
|
+
import { packageMetadata as D } from "./package-metadata.mjs";
|
|
20
|
+
import { keys as d, messages as w } from "./messages/index.mjs";
|
|
21
|
+
import { provideLocalizationService as O, registerForLocalization as rt } from "@progress/kendo-react-intl";
|
|
22
|
+
const { link: P, bold: at, italic: lt, underline: ht } = st, _ = class _ extends c.Component {
|
|
23
|
+
constructor(l) {
|
|
24
|
+
super(l), this.state = {
|
|
25
25
|
view: void 0,
|
|
26
26
|
linkDialog: !1
|
|
27
27
|
}, this._element = null, this._contentElement = null, this.iframe = null, this.trOnChange = null, this.htmlOnChange = null, this.showLicenseWatermark = !1, this.focus = () => {
|
|
28
28
|
this.view && this.view.focus();
|
|
29
|
-
}, this.renderDialog = (t, e, s) => this.state[s] && /* @__PURE__ */
|
|
29
|
+
}, this.renderDialog = (t, e, s) => this.state[s] && /* @__PURE__ */ c.createElement(
|
|
30
30
|
t,
|
|
31
31
|
{
|
|
32
32
|
view: this.view,
|
|
@@ -35,7 +35,7 @@ const { link: P, bold: at, italic: lt, underline: ht } = et, k = class k extends
|
|
|
35
35
|
onClose: () => this.setState({ [s]: !1 })
|
|
36
36
|
}
|
|
37
37
|
), this.renderTool = (t, e, s = !1) => {
|
|
38
|
-
const
|
|
38
|
+
const h = /* @__PURE__ */ c.createElement(
|
|
39
39
|
t,
|
|
40
40
|
{
|
|
41
41
|
view: this.view,
|
|
@@ -44,7 +44,7 @@ const { link: P, bold: at, italic: lt, underline: ht } = et, k = class k extends
|
|
|
44
44
|
className: s ? "k-toolbar-button" : void 0
|
|
45
45
|
}
|
|
46
46
|
);
|
|
47
|
-
return
|
|
47
|
+
return h.type === A ? /* @__PURE__ */ c.createElement(t, { key: e }) : h;
|
|
48
48
|
}, this.updateTools = (t, e) => {
|
|
49
49
|
this.setState({ view: t });
|
|
50
50
|
}, this.filterTransaction = (t, e) => {
|
|
@@ -65,16 +65,16 @@ const { link: P, bold: at, italic: lt, underline: ht } = et, k = class k extends
|
|
|
65
65
|
const e = t.docChanged;
|
|
66
66
|
if (this.props.onChange && e) {
|
|
67
67
|
this.trOnChange = t;
|
|
68
|
-
const s = t.doc,
|
|
68
|
+
const s = t.doc, h = t.doc.type.schema, p = {
|
|
69
69
|
target: this,
|
|
70
70
|
value: s,
|
|
71
71
|
html: "",
|
|
72
72
|
transaction: t,
|
|
73
|
-
schema:
|
|
73
|
+
schema: h
|
|
74
74
|
};
|
|
75
|
-
Object.defineProperty(
|
|
76
|
-
get: () => (this.htmlOnChange =
|
|
77
|
-
}), this.props.onChange.call(void 0,
|
|
75
|
+
Object.defineProperty(p, "html", {
|
|
76
|
+
get: () => (this.htmlOnChange = k.getHtml({ doc: s, schema: h }), this.htmlOnChange)
|
|
77
|
+
}), this.props.onChange.call(void 0, p);
|
|
78
78
|
}
|
|
79
79
|
this.view && (this.props.value === void 0 || !e) && this.view.updateState(this.view.state.apply(t));
|
|
80
80
|
}, this.onFocus = (t, e) => {
|
|
@@ -104,7 +104,7 @@ const { link: P, bold: at, italic: lt, underline: ht } = et, k = class k extends
|
|
|
104
104
|
this.props.onIFrameInit.call(void 0, e);
|
|
105
105
|
}
|
|
106
106
|
return !1;
|
|
107
|
-
}, this.showLicenseWatermark = !
|
|
107
|
+
}, this.showLicenseWatermark = !I(D, { component: "Editor" }), this.licenseMessage = M(D);
|
|
108
108
|
}
|
|
109
109
|
/**
|
|
110
110
|
* The value of the Editor.
|
|
@@ -139,9 +139,9 @@ const { link: P, bold: at, italic: lt, underline: ht } = et, k = class k extends
|
|
|
139
139
|
/**
|
|
140
140
|
* @hidden
|
|
141
141
|
*/
|
|
142
|
-
componentDidUpdate(
|
|
142
|
+
componentDidUpdate(l) {
|
|
143
143
|
const { value: t } = this.props, e = this.view;
|
|
144
|
-
t === void 0 || !e || (
|
|
144
|
+
t === void 0 || !e || (ot(e, t, l.value, this.trOnChange, this.htmlOnChange), this.trOnChange = null, this.htmlOnChange = null);
|
|
145
145
|
}
|
|
146
146
|
/**
|
|
147
147
|
* @hidden
|
|
@@ -149,10 +149,10 @@ const { link: P, bold: at, italic: lt, underline: ht } = et, k = class k extends
|
|
|
149
149
|
componentWillUnmount() {
|
|
150
150
|
var t;
|
|
151
151
|
this.view && this.view.destroy(), this._view = void 0;
|
|
152
|
-
const
|
|
153
|
-
if (
|
|
152
|
+
const l = (t = this.iframe) == null ? void 0 : t.contentWindow;
|
|
153
|
+
if (l) {
|
|
154
154
|
this._contentElement && this._contentElement.parentNode && this._contentElement.parentNode.removeChild(this._contentElement);
|
|
155
|
-
const e =
|
|
155
|
+
const e = l.document.head;
|
|
156
156
|
for (; e && e.firstChild; )
|
|
157
157
|
e.removeChild(e.firstChild);
|
|
158
158
|
}
|
|
@@ -161,60 +161,76 @@ const { link: P, bold: at, italic: lt, underline: ht } = et, k = class k extends
|
|
|
161
161
|
* @hidden
|
|
162
162
|
*/
|
|
163
163
|
render() {
|
|
164
|
-
const { tools:
|
|
164
|
+
const { tools: l = [], defaultEditMode: t = "iframe", preserveWhitespace: e = "full", style: s, className: h } = this.props, p = O(this), u = this.props.ariaLabel || p.toLanguageString(d.contentAreaLabel, w[d.contentAreaLabel]);
|
|
165
165
|
if (this.view) {
|
|
166
|
-
const o =
|
|
166
|
+
const o = B.getState(this.view.state);
|
|
167
167
|
o.preserveWhitespace = e;
|
|
168
168
|
}
|
|
169
|
-
let
|
|
170
|
-
|
|
171
|
-
const
|
|
172
|
-
(o,
|
|
169
|
+
let m = this.props.contentStyle;
|
|
170
|
+
m === void 0 && (s || {}).height === void 0 && (m = { height: "300px" });
|
|
171
|
+
const f = (o, n) => o.displayName || o.name || `tool-${n}`, b = (o, n) => o.map((r, a) => f(r, a)).join("-") || `group-${n}`, y = l.map(
|
|
172
|
+
(o, n) => Array.isArray(o) ? /* @__PURE__ */ c.createElement(N, { key: b(o, n), className: "k-toolbar-button-group" }, o.map((r, a) => this.renderTool(r, f(r, a)))) : this.renderTool(o, f(o, n), !0)
|
|
173
173
|
);
|
|
174
|
-
return /* @__PURE__ */
|
|
174
|
+
return /* @__PURE__ */ c.createElement(
|
|
175
175
|
"div",
|
|
176
176
|
{
|
|
177
177
|
ref: (o) => {
|
|
178
178
|
this._element = o;
|
|
179
179
|
},
|
|
180
|
-
className: W("k-editor",
|
|
180
|
+
className: W("k-editor", h, { "k-editor-resizable": this.props.resizable }),
|
|
181
181
|
dir: this.props.dir,
|
|
182
182
|
style: s
|
|
183
183
|
},
|
|
184
|
-
|
|
185
|
-
|
|
184
|
+
y.length > 0 && /* @__PURE__ */ c.createElement(
|
|
185
|
+
x,
|
|
186
|
+
{
|
|
187
|
+
className: "k-editor-toolbar",
|
|
188
|
+
ariaLabel: p.toLanguageString(d.toolbarAriaLabel, w[d.toolbarAriaLabel]),
|
|
189
|
+
keyboardNavigation: this.props.keyboardNavigation
|
|
190
|
+
},
|
|
191
|
+
y
|
|
192
|
+
),
|
|
193
|
+
t === "iframe" ? /* @__PURE__ */ c.createElement(
|
|
186
194
|
"iframe",
|
|
187
195
|
{
|
|
188
196
|
ref: (o) => {
|
|
189
197
|
this.iframe = o;
|
|
190
198
|
},
|
|
191
199
|
frameBorder: "0",
|
|
192
|
-
title:
|
|
193
|
-
style:
|
|
200
|
+
title: p.toLanguageString(d.iframeTitle, w[d.iframeTitle]),
|
|
201
|
+
style: m,
|
|
194
202
|
className: "k-iframe"
|
|
195
203
|
}
|
|
196
|
-
)
|
|
204
|
+
) : /* @__PURE__ */ c.createElement(
|
|
197
205
|
"div",
|
|
198
206
|
{
|
|
199
207
|
ref: (o) => {
|
|
200
208
|
this._contentElement = o;
|
|
201
209
|
},
|
|
202
|
-
|
|
210
|
+
style: m,
|
|
211
|
+
className: "k-editor-content",
|
|
203
212
|
role: "textbox",
|
|
204
213
|
"aria-labelledby": this.props.ariaLabelledBy,
|
|
205
214
|
"aria-describedby": this.props.ariaDescribedBy,
|
|
206
|
-
"aria-label":
|
|
215
|
+
"aria-label": u,
|
|
216
|
+
suppressContentEditableWarning: !0
|
|
207
217
|
}
|
|
208
|
-
)
|
|
209
|
-
this.renderDialog(
|
|
210
|
-
this.showLicenseWatermark && /* @__PURE__ */
|
|
218
|
+
),
|
|
219
|
+
this.renderDialog(nt.InsertLinkDialog, P, "linkDialog"),
|
|
220
|
+
this.showLicenseWatermark && /* @__PURE__ */ c.createElement(H, { message: this.licenseMessage })
|
|
211
221
|
);
|
|
212
222
|
}
|
|
213
223
|
initialize() {
|
|
214
|
-
const
|
|
215
|
-
if (
|
|
216
|
-
const n =
|
|
217
|
-
r.setAttribute("charset", "utf-8"), n.head.appendChild(r), this._contentElement = n.createElement("div"), n.body.appendChild(this._contentElement), this._contentElement.classList.add("k-content"), this.
|
|
224
|
+
const l = this.iframe && this.iframe.contentWindow;
|
|
225
|
+
if (l) {
|
|
226
|
+
const n = l.document, r = n.createElement("meta");
|
|
227
|
+
r.setAttribute("charset", "utf-8"), n.head.appendChild(r), this._contentElement = n.createElement("div"), n.body.appendChild(this._contentElement), this._contentElement.classList.add("k-content"), this._contentElement.setAttribute("role", "textbox"), this.props.ariaLabelledBy && this._contentElement.setAttribute("aria-labelledby", this.props.ariaLabelledBy), this.props.ariaDescribedBy && this._contentElement.setAttribute("aria-describedby", this.props.ariaDescribedBy), this._contentElement.setAttribute(
|
|
228
|
+
"aria-label",
|
|
229
|
+
this.props.ariaLabel || O(this).toLanguageString(
|
|
230
|
+
d.contentAreaLabel,
|
|
231
|
+
w[d.contentAreaLabel]
|
|
232
|
+
)
|
|
233
|
+
), this.iframe && this.props.onIFrameInit ? this.onIFrameInit(this.iframe) : [tt, et, this.props.dir === "rtl" ? it : void 0].forEach((a) => {
|
|
218
234
|
if (a) {
|
|
219
235
|
const v = n.createElement("style");
|
|
220
236
|
v.appendChild(n.createTextNode(a)), n.head.appendChild(v);
|
|
@@ -226,37 +242,37 @@ const { link: P, bold: at, italic: lt, underline: ht } = et, k = class k extends
|
|
|
226
242
|
return;
|
|
227
243
|
const { preserveWhitespace: e = "full" } = this.props, s = [
|
|
228
244
|
// https://prosemirror.net/docs/ref/#state.PluginSpec
|
|
229
|
-
new
|
|
245
|
+
new E({
|
|
230
246
|
view: (() => ({ update: this.updateTools })),
|
|
231
|
-
key: new
|
|
247
|
+
key: new S("toolbar-tools-update-plugin")
|
|
232
248
|
}),
|
|
233
|
-
new
|
|
249
|
+
new E({
|
|
234
250
|
filterTransaction: this.filterTransaction,
|
|
235
|
-
key: new
|
|
251
|
+
key: new S("onExecute-event-plugin")
|
|
236
252
|
}),
|
|
237
|
-
new
|
|
238
|
-
key:
|
|
253
|
+
new E({
|
|
254
|
+
key: B,
|
|
239
255
|
state: {
|
|
240
256
|
init: () => ({ preserveWhitespace: e }),
|
|
241
257
|
apply: (n, r) => r
|
|
242
258
|
}
|
|
243
259
|
}),
|
|
244
|
-
H(),
|
|
245
260
|
z(),
|
|
246
261
|
j(),
|
|
247
262
|
K(),
|
|
248
|
-
A(),
|
|
249
263
|
V(),
|
|
250
|
-
U()
|
|
251
|
-
|
|
252
|
-
|
|
264
|
+
U(),
|
|
265
|
+
q(),
|
|
266
|
+
G()
|
|
267
|
+
], h = {
|
|
268
|
+
...k.getShortcuts({
|
|
253
269
|
types: { listItem: "list_item", hardBreak: "hard_break" },
|
|
254
270
|
toolsSettings: { bold: at, italic: lt, underline: ht }
|
|
255
271
|
}),
|
|
256
272
|
"Mod-k": () => {
|
|
257
273
|
const { linkDialog: n } = this.state, r = this.view;
|
|
258
274
|
if (r) {
|
|
259
|
-
const a = r.state, v = a.selection.empty, g =
|
|
275
|
+
const a = r.state, v = a.selection.empty, g = Z(a, a.schema.marks[P.mark]);
|
|
260
276
|
!n && !(v && !g) && this.setState({ linkDialog: !0 });
|
|
261
277
|
}
|
|
262
278
|
return !n;
|
|
@@ -265,18 +281,18 @@ const { link: P, bold: at, italic: lt, underline: ht } = et, k = class k extends
|
|
|
265
281
|
var r;
|
|
266
282
|
const n = (r = this.element) == null ? void 0 : r.querySelector(".k-toolbar");
|
|
267
283
|
if (n) {
|
|
268
|
-
const a = n.querySelector(
|
|
284
|
+
const a = n.querySelector(F.join(","));
|
|
269
285
|
if (a)
|
|
270
286
|
return a.focus(), !0;
|
|
271
287
|
}
|
|
272
288
|
return !1;
|
|
273
289
|
}
|
|
274
|
-
}, { defaultContent:
|
|
290
|
+
}, { defaultContent: p = "", value: u, onMount: m } = this.props, f = u && typeof u != "string" ? u : k.createDocument(new $({ nodes: J, marks: R }), u || p, {
|
|
275
291
|
preserveWhitespace: e
|
|
276
|
-
}),
|
|
277
|
-
state:
|
|
278
|
-
plugins: [...s,
|
|
279
|
-
doc:
|
|
292
|
+
}), b = {
|
|
293
|
+
state: Q.create({
|
|
294
|
+
plugins: [...s, T(h), T(X)],
|
|
295
|
+
doc: f
|
|
280
296
|
}),
|
|
281
297
|
transformPastedHTML: this.onPasteHtml,
|
|
282
298
|
dispatchTransaction: this.dispatchTransaction,
|
|
@@ -287,17 +303,17 @@ const { link: P, bold: at, italic: lt, underline: ht } = et, k = class k extends
|
|
|
287
303
|
},
|
|
288
304
|
handleDrop: (n, r, a, v) => {
|
|
289
305
|
let g = !1;
|
|
290
|
-
return a.content.nodesBetween(0, a.content.size, (
|
|
291
|
-
g = g ||
|
|
306
|
+
return a.content.nodesBetween(0, a.content.size, (L) => {
|
|
307
|
+
g = g || L.type.name === "table_caption_external";
|
|
292
308
|
}), g;
|
|
293
309
|
}
|
|
294
|
-
},
|
|
310
|
+
}, y = { plugins: s, shortcuts: h, target: this, viewProps: b, dom: t }, o = this._view = m && m.call(void 0, y) || new Y({ mount: t }, b);
|
|
295
311
|
this.setState({
|
|
296
|
-
view:
|
|
312
|
+
view: o
|
|
297
313
|
});
|
|
298
314
|
}
|
|
299
315
|
};
|
|
300
|
-
|
|
316
|
+
_.propTypes = {
|
|
301
317
|
defaultContent: i.string,
|
|
302
318
|
value: i.oneOfType([i.object, i.string]),
|
|
303
319
|
defaultEditMode: i.oneOf(["iframe", "div"]),
|
|
@@ -320,8 +336,8 @@ k.propTypes = {
|
|
|
320
336
|
onExecute: i.func,
|
|
321
337
|
onIFrameInit: i.func
|
|
322
338
|
};
|
|
323
|
-
let
|
|
324
|
-
rt(
|
|
339
|
+
let C = _;
|
|
340
|
+
rt(C);
|
|
325
341
|
export {
|
|
326
|
-
|
|
342
|
+
C as Editor
|
|
327
343
|
};
|