@ckeditor/ckeditor5-editor-balloon 32.0.0 → 34.1.0
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/LICENSE.md +2 -2
- package/README.md +3 -2
- package/build/editor-balloon.js +2 -2
- package/package.json +14 -14
- package/src/ballooneditor.js +23 -24
package/LICENSE.md
CHANGED
|
@@ -2,7 +2,7 @@ Software License Agreement
|
|
|
2
2
|
==========================
|
|
3
3
|
|
|
4
4
|
**Balloon editor implementation** – https://github.com/ckeditor/ckeditor5-editor-balloon <br>
|
|
5
|
-
Copyright (c) 2003-2022, [CKSource
|
|
5
|
+
Copyright (c) 2003-2022, [CKSource Holding sp. z o.o.](https://cksource.com) All rights reserved.
|
|
6
6
|
|
|
7
7
|
Licensed under the terms of [GNU General Public License Version 2 or later](http://www.gnu.org/licenses/gpl.html).
|
|
8
8
|
|
|
@@ -14,4 +14,4 @@ Where not otherwise indicated, all CKEditor content is authored by CKSource engi
|
|
|
14
14
|
Trademarks
|
|
15
15
|
----------
|
|
16
16
|
|
|
17
|
-
**CKEditor** is a trademark of [CKSource
|
|
17
|
+
**CKEditor** is a trademark of [CKSource Holding sp. z o.o.](https://cksource.com) All other brand and product names are trademarks, registered trademarks or service marks of their respective holders.
|
package/README.md
CHANGED
|
@@ -3,13 +3,14 @@ CKEditor 5 balloon editor implementation
|
|
|
3
3
|
|
|
4
4
|
[](https://www.npmjs.com/package/@ckeditor/ckeditor5-editor-balloon)
|
|
5
5
|
[](https://coveralls.io/github/ckeditor/ckeditor5?branch=master)
|
|
6
|
-
[](https://travis-ci.com/ckeditor/ckeditor5)
|
|
6
|
+
[](https://app.travis-ci.com/github/ckeditor/ckeditor5)
|
|
7
|
+

|
|
7
8
|
|
|
8
9
|
The balloon editor implementation (Medium-like editor) for CKEditor 5.
|
|
9
10
|
|
|
10
11
|
This package contains the [`BalloonEditor`](https://ckeditor.com/docs/ckeditor5/latest/api/module_editor-balloon_ballooneditor-BalloonEditor.html) class. Follow there to learn more about this type of editor and how to initialize it.
|
|
11
12
|
|
|
12
|
-
This package contains the source version of the balloon editor. This editor implementation is also available in the [balloon build](https://www.npmjs.com/package/@ckeditor/ckeditor5-build-balloon). Read more about [CKEditor 5 builds](https://ckeditor.com/docs/ckeditor5/latest/
|
|
13
|
+
This package contains the source version of the balloon editor. This editor implementation is also available in the [balloon build](https://www.npmjs.com/package/@ckeditor/ckeditor5-build-balloon). Read more about [CKEditor 5 builds](https://ckeditor.com/docs/ckeditor5/latest/installation/index.html).
|
|
13
14
|
|
|
14
15
|
## Documentation
|
|
15
16
|
|
package/build/editor-balloon.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* @license Copyright (c) 2003-2022, CKSource
|
|
2
|
+
* @license Copyright (c) 2003-2022, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
3
|
* For licensing, see LICENSE.md.
|
|
4
|
-
*/(()=>{var t={704:(t,e,o)=>{t.exports=o(79)("./src/core.js")},492:(t,e,o)=>{t.exports=o(79)("./src/engine.js")},273:(t,e,o)=>{t.exports=o(79)("./src/ui.js")},209:(t,e,o)=>{t.exports=o(79)("./src/utils.js")},79:t=>{"use strict";t.exports=CKEditor5.dll}},e={};function o(r){var i=e[r];if(void 0!==i)return i.exports;var n=e[r]={exports:{}};return t[r](n,n.exports,o),n.exports}o.d=(t,e)=>{for(var r in e)o.o(e,r)&&!o.o(t,r)&&Object.defineProperty(t,r,{enumerable:!0,get:e[r]})},o.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),o.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var r={};(()=>{"use strict";o.r(r),o.d(r,{BalloonEditor:()=>F});var t=o(704),e=o(273),i=o(209);const n=function(t){return null!=t&&"object"==typeof t};const s="object"==typeof global&&global&&global.Object===Object&&global;var c="object"==typeof self&&self&&self.Object===Object&&self;const a=(s||c||Function("return this")()).Symbol;var l=Object.prototype,u=l.hasOwnProperty,d=l.toString,h=a?a.toStringTag:void 0;const
|
|
4
|
+
*/(()=>{var t={704:(t,e,o)=>{t.exports=o(79)("./src/core.js")},492:(t,e,o)=>{t.exports=o(79)("./src/engine.js")},273:(t,e,o)=>{t.exports=o(79)("./src/ui.js")},209:(t,e,o)=>{t.exports=o(79)("./src/utils.js")},79:t=>{"use strict";t.exports=CKEditor5.dll}},e={};function o(r){var i=e[r];if(void 0!==i)return i.exports;var n=e[r]={exports:{}};return t[r](n,n.exports,o),n.exports}o.d=(t,e)=>{for(var r in e)o.o(e,r)&&!o.o(t,r)&&Object.defineProperty(t,r,{enumerable:!0,get:e[r]})},o.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),o.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var r={};(()=>{"use strict";o.r(r),o.d(r,{BalloonEditor:()=>F});var t=o(704),e=o(273),i=o(209);const n=function(t){return null!=t&&"object"==typeof t};const s="object"==typeof global&&global&&global.Object===Object&&global;var c="object"==typeof self&&self&&self.Object===Object&&self;const a=(s||c||Function("return this")()).Symbol;var l=Object.prototype,u=l.hasOwnProperty,d=l.toString,h=a?a.toStringTag:void 0;const g=function(t){var e=u.call(t,h),o=t[h];try{t[h]=void 0;var r=!0}catch(t){}var i=d.call(t);return r&&(e?t[h]=o:delete t[h]),i};var b=Object.prototype.toString;const f=function(t){return b.call(t)};var p=a?a.toStringTag:void 0;const m=function(t){return null==t?void 0===t?"[object Undefined]":"[object Null]":p&&p in Object(t)?g(t):f(t)};const v=function(t,e){return function(o){return t(e(o))}}(Object.getPrototypeOf,Object);var y=Function.prototype,w=Object.prototype,j=y.toString,E=w.hasOwnProperty,O=j.call(Object);const x=function(t){if(!n(t)||"[object Object]"!=m(t))return!1;var e=v(t);if(null===e)return!0;var o=E.call(e,"constructor")&&e.constructor;return"function"==typeof o&&o instanceof o&&j.call(o)==O};const T=function(t){return n(t)&&1===t.nodeType&&!x(t)};var P=o(492);class S extends t.EditorUI{constructor(t,e){super(t),this.view=e}get element(){return this.view.editable.element}init(){const t=this.editor,o=this.view,r=t.plugins.get("BalloonToolbar"),i=t.editing.view,n=o.editable,s=i.document.getRoot();n.name=s.rootName,o.render();const c=n.element;this.setEditableElement(n.name,c),this.focusTracker.add(c),n.bind("isFocused").to(this.focusTracker),i.attachDomRoot(c),(0,e.enableToolbarKeyboardFocus)({origin:i,originFocusTracker:this.focusTracker,originKeystrokeHandler:t.keystrokes,toolbar:r.toolbarView,beforeFocus(){r.show()},afterBlur(){r.hide()}}),this._initPlaceholder(),this.fire("ready")}destroy(){const t=this.view;this.editor.editing.view.detachDomRoot(t.editable.name),t.destroy(),super.destroy()}_initPlaceholder(){const t=this.editor,e=t.editing.view,o=e.document.getRoot(),r=t.sourceElement,i=t.config.get("placeholder")||r&&"textarea"===r.tagName.toLowerCase()&&r.getAttribute("placeholder");i&&(0,P.enablePlaceholder)({view:e,element:o,text:i,isDirectHost:!1,keepOnFocus:!0})}}class D extends e.EditorUIView{constructor(t,o,r){super(t),this.editable=new e.InlineEditableUIView(t,o,r)}render(){super.render(),this.registerChild(this.editable)}}class F extends t.Editor{constructor(o,r={}){if(!T(o)&&void 0!==r.initialData)throw new i.CKEditorError("editor-create-initial-data",null);super(r),void 0===this.config.get("initialData")&&this.config.set("initialData",function(t){return T(t)?(0,i.getDataFromElement)(t):t}(o)),T(o)&&(this.sourceElement=o,(0,t.secureSourceElement)(this));const n=this.config.get("plugins");n.push(e.BalloonToolbar),this.config.set("plugins",n),this.config.define("balloonToolbar",this.config.get("toolbar")),this.model.document.createRoot();const s=new D(this.locale,this.editing.view,this.sourceElement);this.ui=new S(this,s),(0,t.attachToForm)(this)}destroy(){const t=this.getData();return this.ui.destroy(),super.destroy().then((()=>{this.sourceElement&&(0,i.setDataInElement)(this.sourceElement,t)}))}static create(t,e={}){return new Promise((o=>{if(T(t)&&"TEXTAREA"===t.tagName)throw new i.CKEditorError("editor-wrong-element",null);const r=new this(t,e);o(r.initPlugins().then((()=>r.ui.init())).then((()=>r.data.init(r.config.get("initialData")))).then((()=>r.fire("ready"))).then((()=>r)))}))}}(0,i.mix)(F,t.DataApiMixin),(0,i.mix)(F,t.ElementApiMixin)})(),(window.CKEditor5=window.CKEditor5||{}).editorBalloon=r})();
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ckeditor/ckeditor5-editor-balloon",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "34.1.0",
|
|
4
4
|
"description": "Balloon editor implementation for CKEditor 5.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"ckeditor",
|
|
@@ -11,22 +11,22 @@
|
|
|
11
11
|
],
|
|
12
12
|
"main": "src/index.js",
|
|
13
13
|
"dependencies": {
|
|
14
|
-
"ckeditor5": "^
|
|
14
|
+
"ckeditor5": "^34.1.0",
|
|
15
15
|
"lodash-es": "^4.17.15"
|
|
16
16
|
},
|
|
17
17
|
"devDependencies": {
|
|
18
|
-
"@ckeditor/ckeditor5-basic-styles": "^
|
|
19
|
-
"@ckeditor/ckeditor5-core": "^
|
|
20
|
-
"@ckeditor/ckeditor5-dev-utils": "^
|
|
21
|
-
"@ckeditor/ckeditor5-engine": "^
|
|
22
|
-
"@ckeditor/ckeditor5-enter": "^
|
|
23
|
-
"@ckeditor/ckeditor5-heading": "^
|
|
24
|
-
"@ckeditor/ckeditor5-paragraph": "^
|
|
25
|
-
"@ckeditor/ckeditor5-theme-lark": "^
|
|
26
|
-
"@ckeditor/ckeditor5-typing": "^
|
|
27
|
-
"@ckeditor/ckeditor5-ui": "^
|
|
28
|
-
"@ckeditor/ckeditor5-undo": "^
|
|
29
|
-
"@ckeditor/ckeditor5-utils": "^
|
|
18
|
+
"@ckeditor/ckeditor5-basic-styles": "^34.1.0",
|
|
19
|
+
"@ckeditor/ckeditor5-core": "^34.1.0",
|
|
20
|
+
"@ckeditor/ckeditor5-dev-utils": "^30.0.0",
|
|
21
|
+
"@ckeditor/ckeditor5-engine": "^34.1.0",
|
|
22
|
+
"@ckeditor/ckeditor5-enter": "^34.1.0",
|
|
23
|
+
"@ckeditor/ckeditor5-heading": "^34.1.0",
|
|
24
|
+
"@ckeditor/ckeditor5-paragraph": "^34.1.0",
|
|
25
|
+
"@ckeditor/ckeditor5-theme-lark": "^34.1.0",
|
|
26
|
+
"@ckeditor/ckeditor5-typing": "^34.1.0",
|
|
27
|
+
"@ckeditor/ckeditor5-ui": "^34.1.0",
|
|
28
|
+
"@ckeditor/ckeditor5-undo": "^34.1.0",
|
|
29
|
+
"@ckeditor/ckeditor5-utils": "^34.1.0",
|
|
30
30
|
"webpack": "^5.58.1",
|
|
31
31
|
"webpack-cli": "^4.9.0"
|
|
32
32
|
},
|
package/src/ballooneditor.js
CHANGED
|
@@ -17,7 +17,8 @@ import BalloonEditorUI from './ballooneditorui';
|
|
|
17
17
|
import BalloonEditorUIView from './ballooneditoruiview';
|
|
18
18
|
|
|
19
19
|
/**
|
|
20
|
-
* The {@glink
|
|
20
|
+
* The {@glink installation/advanced/alternative-setups/predefined-builds#balloon-editor balloon editor}
|
|
21
|
+
* implementation (Medium-like editor).
|
|
21
22
|
* It uses an inline editable and a toolbar based on the {@link module:ui/toolbar/balloon/balloontoolbar~BalloonToolbar}.
|
|
22
23
|
* See the {@glink examples/builds/balloon-editor demo}.
|
|
23
24
|
*
|
|
@@ -28,9 +29,10 @@ import BalloonEditorUIView from './ballooneditoruiview';
|
|
|
28
29
|
*
|
|
29
30
|
* The balloon editor can be used directly from source (if you installed the
|
|
30
31
|
* [`@ckeditor/ckeditor5-editor-balloon`](https://www.npmjs.com/package/@ckeditor/ckeditor5-editor-balloon) package)
|
|
31
|
-
* but it is also available in the {@glink
|
|
32
|
+
* but it is also available in the {@glink installation/advanced/alternative-setups/predefined-builds#balloon-editor balloon build}.
|
|
32
33
|
*
|
|
33
|
-
* {@glink
|
|
34
|
+
* {@glink installation/advanced/alternative-setups/predefined-builds Builds}
|
|
35
|
+
* are ready-to-use editors with plugins bundled in. When using the editor from
|
|
34
36
|
* source you need to take care of loading all plugins by yourself
|
|
35
37
|
* (through the {@link module:core/editor/editorconfig~EditorConfig#plugins `config.plugins`} option).
|
|
36
38
|
* Using the editor from source gives much better flexibility and allows easier customization.
|
|
@@ -54,11 +56,22 @@ export default class BalloonEditor extends Editor {
|
|
|
54
56
|
* @param {HTMLElement|String} sourceElementOrData The DOM element that will be the source for the created editor
|
|
55
57
|
* (on which the editor will be initialized) or initial data for the editor. For more information see
|
|
56
58
|
* {@link module:editor-balloon/ballooneditor~BalloonEditor.create `BalloonEditor.create()`}.
|
|
57
|
-
* @param {module:core/editor/editorconfig~EditorConfig} config The editor configuration.
|
|
59
|
+
* @param {module:core/editor/editorconfig~EditorConfig} [config] The editor configuration.
|
|
58
60
|
*/
|
|
59
|
-
constructor( sourceElementOrData, config ) {
|
|
61
|
+
constructor( sourceElementOrData, config = {} ) {
|
|
62
|
+
// If both `config.initialData` is set and initial data is passed as the constructor parameter, then throw.
|
|
63
|
+
if ( !isElement( sourceElementOrData ) && config.initialData !== undefined ) {
|
|
64
|
+
// Documented in core/editor/editorconfig.jsdoc.
|
|
65
|
+
// eslint-disable-next-line ckeditor5-rules/ckeditor-error-message
|
|
66
|
+
throw new CKEditorError( 'editor-create-initial-data', null );
|
|
67
|
+
}
|
|
68
|
+
|
|
60
69
|
super( config );
|
|
61
70
|
|
|
71
|
+
if ( this.config.get( 'initialData' ) === undefined ) {
|
|
72
|
+
this.config.set( 'initialData', getInitialData( sourceElementOrData ) );
|
|
73
|
+
}
|
|
74
|
+
|
|
62
75
|
if ( isElement( sourceElementOrData ) ) {
|
|
63
76
|
this.sourceElement = sourceElementOrData;
|
|
64
77
|
secureSourceElement( this );
|
|
@@ -169,13 +182,13 @@ export default class BalloonEditor extends Editor {
|
|
|
169
182
|
* # Using the editor from source
|
|
170
183
|
*
|
|
171
184
|
* The code samples listed in the previous sections of this documentation assume that you are using an
|
|
172
|
-
* {@glink
|
|
185
|
+
* {@glink installation/advanced/alternative-setups/predefined-builds editor build} (for example – `@ckeditor/ckeditor5-build-balloon`).
|
|
173
186
|
*
|
|
174
187
|
* If you want to use the balloon editor from source (`@ckeditor/ckeditor5-editor-balloon/src/ballooneditor`),
|
|
175
188
|
* you need to define the list of
|
|
176
189
|
* {@link module:core/editor/editorconfig~EditorConfig#plugins plugins to be initialized} and
|
|
177
190
|
* {@link module:core/editor/editorconfig~EditorConfig#toolbar toolbar items}. Read more about using the editor from
|
|
178
|
-
* source in the {@glink
|
|
191
|
+
* source in the {@glink installation/advanced/alternative-setups/integrating-from-source dedicated guide}.
|
|
179
192
|
*
|
|
180
193
|
* @param {HTMLElement|String} sourceElementOrData The DOM element that will be the source for the created editor
|
|
181
194
|
* or the editor's initial data.
|
|
@@ -191,9 +204,7 @@ export default class BalloonEditor extends Editor {
|
|
|
191
204
|
*/
|
|
192
205
|
static create( sourceElementOrData, config = {} ) {
|
|
193
206
|
return new Promise( resolve => {
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
if ( isHTMLElement && sourceElementOrData.tagName === 'TEXTAREA' ) {
|
|
207
|
+
if ( isElement( sourceElementOrData ) && sourceElementOrData.tagName === 'TEXTAREA' ) {
|
|
197
208
|
// Documented in core/editor/editor.js
|
|
198
209
|
// eslint-disable-next-line ckeditor5-rules/ckeditor-error-message
|
|
199
210
|
throw new CKEditorError( 'editor-wrong-element', null );
|
|
@@ -203,20 +214,8 @@ export default class BalloonEditor extends Editor {
|
|
|
203
214
|
|
|
204
215
|
resolve(
|
|
205
216
|
editor.initPlugins()
|
|
206
|
-
.then( () =>
|
|
207
|
-
|
|
208
|
-
} )
|
|
209
|
-
.then( () => {
|
|
210
|
-
if ( !isHTMLElement && config.initialData ) {
|
|
211
|
-
// Documented in core/editor/editorconfig.jdoc.
|
|
212
|
-
// eslint-disable-next-line ckeditor5-rules/ckeditor-error-message
|
|
213
|
-
throw new CKEditorError( 'editor-create-initial-data', null );
|
|
214
|
-
}
|
|
215
|
-
|
|
216
|
-
const initialData = config.initialData !== undefined ? config.initialData : getInitialData( sourceElementOrData );
|
|
217
|
-
|
|
218
|
-
return editor.data.init( initialData );
|
|
219
|
-
} )
|
|
217
|
+
.then( () => editor.ui.init() )
|
|
218
|
+
.then( () => editor.data.init( editor.config.get( 'initialData' ) ) )
|
|
220
219
|
.then( () => editor.fire( 'ready' ) )
|
|
221
220
|
.then( () => editor )
|
|
222
221
|
);
|