@ckeditor/ckeditor5-horizontal-line 35.4.0 → 36.0.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 +1 -1
- package/build/horizontal-line.js +1 -1
- package/package.json +19 -15
- package/src/horizontalline.js +13 -19
- package/src/horizontallinecommand.js +46 -62
- package/src/horizontallineediting.js +48 -69
- package/src/horizontallineui.js +31 -43
- package/src/index.js +1 -3
- package/theme/horizontalline.css +1 -1
package/LICENSE.md
CHANGED
|
@@ -2,7 +2,7 @@ Software License Agreement
|
|
|
2
2
|
==========================
|
|
3
3
|
|
|
4
4
|
**CKEditor 5 horizontal line feature** – https://github.com/ckeditor/ckeditor5-horizontal-line <br>
|
|
5
|
-
Copyright (c) 2003-
|
|
5
|
+
Copyright (c) 2003-2023, [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
|
|
package/build/horizontal-line.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
!function(e){const t=e.en=e.en||{};t.dictionary=Object.assign(t.dictionary||{},{"Horizontal line":"Horizontal line"})}(window.CKEDITOR_TRANSLATIONS||(window.CKEDITOR_TRANSLATIONS={})),
|
|
2
2
|
/*!
|
|
3
|
-
* @license Copyright (c) 2003-
|
|
3
|
+
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
4
4
|
* For licensing, see LICENSE.md.
|
|
5
5
|
*/(()=>{var e={73:(e,t,n)=>{"use strict";n.d(t,{Z:()=>i});var r=n(609),o=n.n(r)()((function(e){return e[1]}));o.push([e.id,".ck-editor__editable .ck-horizontal-line{display:flow-root}.ck-content hr{background:#dedede;border:0;height:4px;margin:15px 0}",""]);const i=o},609:e=>{"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var n=e(t);return t[2]?"@media ".concat(t[2]," {").concat(n,"}"):n})).join("")},t.i=function(e,n,r){"string"==typeof e&&(e=[[null,e,""]]);var o={};if(r)for(var i=0;i<this.length;i++){var a=this[i][0];null!=a&&(o[a]=!0)}for(var s=0;s<e.length;s++){var c=[].concat(e[s]);r&&o[c[0]]||(n&&(c[2]?c[2]="".concat(n," and ").concat(c[2]):c[2]=n),t.push(c))}},t}},62:(e,t,n)=>{"use strict";var r,o=function(){return void 0===r&&(r=Boolean(window&&document&&document.all&&!window.atob)),r},i=function(){var e={};return function(t){if(void 0===e[t]){var n=document.querySelector(t);if(window.HTMLIFrameElement&&n instanceof window.HTMLIFrameElement)try{n=n.contentDocument.head}catch(e){n=null}e[t]=n}return e[t]}}(),a=[];function s(e){for(var t=-1,n=0;n<a.length;n++)if(a[n].identifier===e){t=n;break}return t}function c(e,t){for(var n={},r=[],o=0;o<e.length;o++){var i=e[o],c=t.base?i[0]+t.base:i[0],l=n[c]||0,d="".concat(c," ").concat(l);n[c]=l+1;var u=s(d),f={css:i[1],media:i[2],sourceMap:i[3]};-1!==u?(a[u].references++,a[u].updater(f)):a.push({identifier:d,updater:v(f,t),references:1}),r.push(d)}return r}function l(e){var t=document.createElement("style"),r=e.attributes||{};if(void 0===r.nonce){var o=n.nc;o&&(r.nonce=o)}if(Object.keys(r).forEach((function(e){t.setAttribute(e,r[e])})),"function"==typeof e.insert)e.insert(t);else{var a=i(e.insert||"head");if(!a)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");a.appendChild(t)}return t}var d,u=(d=[],function(e,t){return d[e]=t,d.filter(Boolean).join("\n")});function f(e,t,n,r){var o=n?"":r.media?"@media ".concat(r.media," {").concat(r.css,"}"):r.css;if(e.styleSheet)e.styleSheet.cssText=u(t,o);else{var i=document.createTextNode(o),a=e.childNodes;a[t]&&e.removeChild(a[t]),a.length?e.insertBefore(i,a[t]):e.appendChild(i)}}function h(e,t,n){var r=n.css,o=n.media,i=n.sourceMap;if(o?e.setAttribute("media",o):e.removeAttribute("media"),i&&"undefined"!=typeof btoa&&(r+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(i))))," */")),e.styleSheet)e.styleSheet.cssText=r;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(r))}}var m=null,p=0;function v(e,t){var n,r,o;if(t.singleton){var i=p++;n=m||(m=l(t)),r=f.bind(null,n,i,!1),o=f.bind(null,n,i,!0)}else n=l(t),r=h.bind(null,n,t),o=function(){!function(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e)}(n)};return r(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap)return;r(e=t)}else o()}}e.exports=function(e,t){(t=t||{}).singleton||"boolean"==typeof t.singleton||(t.singleton=o());var n=c(e=e||[],t);return function(e){if(e=e||[],"[object Array]"===Object.prototype.toString.call(e)){for(var r=0;r<n.length;r++){var o=s(n[r]);a[o].references--}for(var i=c(e,t),l=0;l<n.length;l++){var d=s(n[l]);0===a[d].references&&(a[d].updater(),a.splice(d,1))}n=i}}}},704:(e,t,n)=>{e.exports=n(79)("./src/core.js")},273:(e,t,n)=>{e.exports=n(79)("./src/ui.js")},995:(e,t,n)=>{e.exports=n(79)("./src/widget.js")},79:e=>{"use strict";e.exports=CKEditor5.dll}},t={};function n(r){var o=t[r];if(void 0!==o)return o.exports;var i=t[r]={id:r,exports:{}};return e[r](i,i.exports,n),i.exports}n.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return n.d(t,{a:t}),t},n.d=(e,t)=>{for(var r in t)n.o(t,r)&&!n.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:t[r]})},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),n.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.nc=void 0;var r={};(()=>{"use strict";n.r(r),n.d(r,{HorizontalLine:()=>f,HorizontalLineEditing:()=>l,HorizontalLineUI:()=>u});var e=n(704),t=n(995);class o extends e.Command{refresh(){const e=this.editor.model,n=e.schema,r=e.document.selection;this.isEnabled=function(e,n,r){const o=function(e,n){const r=(0,t.findOptimalInsertionRange)(e,n),o=r.start.parent;if(o.isEmpty&&!o.is("element","$root"))return o.parent;return o}(e,r);return n.checkChild(o,"horizontalLine")}(r,n,e)}execute(){const e=this.editor.model;e.change((t=>{const n=t.createElement("horizontalLine");e.insertObject(n,null,null,{setSelection:"after"})}))}}var i=n(62),a=n.n(i),s=n(73),c={injectType:"singletonStyleTag",attributes:{"data-cke":!0},insert:"head",singleton:!0};a()(s.Z,c);s.Z.locals;class l extends e.Plugin{static get pluginName(){return"HorizontalLineEditing"}init(){const e=this.editor,n=e.model.schema,r=e.t,i=e.conversion;n.register("horizontalLine",{inheritAllFrom:"$blockObject"}),i.for("dataDowncast").elementToElement({model:"horizontalLine",view:(e,{writer:t})=>t.createEmptyElement("hr")}),i.for("editingDowncast").elementToStructure({model:"horizontalLine",view:(e,{writer:n})=>{const o=r("Horizontal line"),i=n.createContainerElement("div",null,n.createEmptyElement("hr"));return n.addClass("ck-horizontal-line",i),n.setCustomProperty("hr",!0,i),function(e,n,r){return n.setCustomProperty("horizontalLine",!0,e),(0,t.toWidget)(e,n,{label:r})}(i,n,o)}}),i.for("upcast").elementToElement({view:"hr",model:"horizontalLine"}),e.commands.add("horizontalLine",new o(e))}}var d=n(273);class u extends e.Plugin{static get pluginName(){return"HorizontalLineUI"}init(){const e=this.editor,t=e.t;e.ui.componentFactory.add("horizontalLine",(n=>{const r=e.commands.get("horizontalLine"),o=new d.ButtonView(n);return o.set({label:t("Horizontal line"),icon:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M2 9h16v2H2z"/></svg>',tooltip:!0}),o.bind("isEnabled").to(r,"isEnabled"),this.listenTo(o,"execute",(()=>{e.execute("horizontalLine"),e.editing.view.focus()})),o}))}}class f extends e.Plugin{static get requires(){return[l,u,t.Widget]}static get pluginName(){return"HorizontalLine"}}})(),(window.CKEditor5=window.CKEditor5||{}).horizontalLine=r})();
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ckeditor/ckeditor5-horizontal-line",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "36.0.0",
|
|
4
4
|
"description": "Horizontal line feature for CKEditor 5.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"ckeditor",
|
|
@@ -12,20 +12,21 @@
|
|
|
12
12
|
],
|
|
13
13
|
"main": "src/index.js",
|
|
14
14
|
"dependencies": {
|
|
15
|
-
"ckeditor5": "^
|
|
15
|
+
"ckeditor5": "^36.0.0"
|
|
16
16
|
},
|
|
17
17
|
"devDependencies": {
|
|
18
|
-
"@ckeditor/ckeditor5-cloud-services": "^
|
|
19
|
-
"@ckeditor/ckeditor5-core": "^
|
|
20
|
-
"@ckeditor/ckeditor5-dev-utils": "^
|
|
21
|
-
"@ckeditor/ckeditor5-easy-image": "^
|
|
22
|
-
"@ckeditor/ckeditor5-editor-classic": "^
|
|
23
|
-
"@ckeditor/ckeditor5-engine": "^
|
|
24
|
-
"@ckeditor/ckeditor5-image": "^
|
|
25
|
-
"@ckeditor/ckeditor5-paragraph": "^
|
|
26
|
-
"@ckeditor/ckeditor5-theme-lark": "^
|
|
27
|
-
"@ckeditor/ckeditor5-ui": "^
|
|
28
|
-
"@ckeditor/ckeditor5-widget": "^
|
|
18
|
+
"@ckeditor/ckeditor5-cloud-services": "^36.0.0",
|
|
19
|
+
"@ckeditor/ckeditor5-core": "^36.0.0",
|
|
20
|
+
"@ckeditor/ckeditor5-dev-utils": "^32.0.0",
|
|
21
|
+
"@ckeditor/ckeditor5-easy-image": "^36.0.0",
|
|
22
|
+
"@ckeditor/ckeditor5-editor-classic": "^36.0.0",
|
|
23
|
+
"@ckeditor/ckeditor5-engine": "^36.0.0",
|
|
24
|
+
"@ckeditor/ckeditor5-image": "^36.0.0",
|
|
25
|
+
"@ckeditor/ckeditor5-paragraph": "^36.0.0",
|
|
26
|
+
"@ckeditor/ckeditor5-theme-lark": "^36.0.0",
|
|
27
|
+
"@ckeditor/ckeditor5-ui": "^36.0.0",
|
|
28
|
+
"@ckeditor/ckeditor5-widget": "^36.0.0",
|
|
29
|
+
"typescript": "^4.8.4",
|
|
29
30
|
"webpack": "^5.58.1",
|
|
30
31
|
"webpack-cli": "^4.9.0"
|
|
31
32
|
},
|
|
@@ -44,13 +45,16 @@
|
|
|
44
45
|
},
|
|
45
46
|
"files": [
|
|
46
47
|
"lang",
|
|
47
|
-
"src",
|
|
48
|
+
"src/**/*.js",
|
|
49
|
+
"src/**/*.d.ts",
|
|
48
50
|
"theme",
|
|
49
51
|
"build",
|
|
50
52
|
"ckeditor5-metadata.json",
|
|
51
53
|
"CHANGELOG.md"
|
|
52
54
|
],
|
|
53
55
|
"scripts": {
|
|
54
|
-
"dll:build": "webpack"
|
|
56
|
+
"dll:build": "webpack",
|
|
57
|
+
"build": "tsc -p ./tsconfig.release.json",
|
|
58
|
+
"postversion": "npm run build"
|
|
55
59
|
}
|
|
56
60
|
}
|
package/src/horizontalline.js
CHANGED
|
@@ -1,38 +1,32 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @license Copyright (c) 2003-
|
|
2
|
+
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
3
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
4
|
*/
|
|
5
|
-
|
|
6
5
|
/**
|
|
7
6
|
* @module horizontal-line/horizontalline
|
|
8
7
|
*/
|
|
9
|
-
|
|
10
8
|
import { Plugin } from 'ckeditor5/src/core';
|
|
11
9
|
import { Widget } from 'ckeditor5/src/widget';
|
|
12
10
|
import HorizontalLineEditing from './horizontallineediting';
|
|
13
11
|
import HorizontalLineUI from './horizontallineui';
|
|
14
|
-
|
|
15
12
|
/**
|
|
16
13
|
* The horizontal line feature.
|
|
17
14
|
*
|
|
18
15
|
* It provides the possibility to insert a horizontal line into the rich-text editor.
|
|
19
16
|
*
|
|
20
17
|
* For a detailed overview, check the {@glink features/horizontal-line Horizontal line feature} documentation.
|
|
21
|
-
*
|
|
22
|
-
* @extends module:core/plugin~Plugin
|
|
23
18
|
*/
|
|
24
19
|
export default class HorizontalLine extends Plugin {
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
}
|
|
20
|
+
/**
|
|
21
|
+
* @inheritDoc
|
|
22
|
+
*/
|
|
23
|
+
static get requires() {
|
|
24
|
+
return [HorizontalLineEditing, HorizontalLineUI, Widget];
|
|
25
|
+
}
|
|
26
|
+
/**
|
|
27
|
+
* @inheritDoc
|
|
28
|
+
*/
|
|
29
|
+
static get pluginName() {
|
|
30
|
+
return 'HorizontalLine';
|
|
31
|
+
}
|
|
38
32
|
}
|
|
@@ -1,15 +1,9 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @license Copyright (c) 2003-
|
|
2
|
+
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
3
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
4
|
*/
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* @module horizontal-line/horizontallinecommand
|
|
8
|
-
*/
|
|
9
|
-
|
|
10
5
|
import { Command } from 'ckeditor5/src/core';
|
|
11
6
|
import { findOptimalInsertionRange } from 'ckeditor5/src/widget';
|
|
12
|
-
|
|
13
7
|
/**
|
|
14
8
|
* The horizontal line command.
|
|
15
9
|
*
|
|
@@ -17,63 +11,53 @@ import { findOptimalInsertionRange } from 'ckeditor5/src/widget';
|
|
|
17
11
|
*
|
|
18
12
|
* To insert a horizontal line at the current selection, execute the command:
|
|
19
13
|
*
|
|
20
|
-
*
|
|
21
|
-
*
|
|
22
|
-
*
|
|
14
|
+
* ```ts
|
|
15
|
+
* editor.execute( 'horizontalLine' );
|
|
16
|
+
* ```
|
|
23
17
|
*/
|
|
24
18
|
export default class HorizontalLineCommand extends Command {
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
model.insertObject( horizontalElement, null, null, { setSelection: 'after' } );
|
|
48
|
-
} );
|
|
49
|
-
}
|
|
19
|
+
/**
|
|
20
|
+
* @inheritDoc
|
|
21
|
+
*/
|
|
22
|
+
refresh() {
|
|
23
|
+
const model = this.editor.model;
|
|
24
|
+
const schema = model.schema;
|
|
25
|
+
const selection = model.document.selection;
|
|
26
|
+
this.isEnabled = isHorizontalLineAllowedInParent(selection, schema, model);
|
|
27
|
+
}
|
|
28
|
+
/**
|
|
29
|
+
* Executes the command.
|
|
30
|
+
*
|
|
31
|
+
* @fires execute
|
|
32
|
+
*/
|
|
33
|
+
execute() {
|
|
34
|
+
const model = this.editor.model;
|
|
35
|
+
model.change(writer => {
|
|
36
|
+
const horizontalElement = writer.createElement('horizontalLine');
|
|
37
|
+
model.insertObject(horizontalElement, null, null, { setSelection: 'after' });
|
|
38
|
+
});
|
|
39
|
+
}
|
|
50
40
|
}
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
const parent = getInsertHorizontalLineParent( selection, model );
|
|
60
|
-
|
|
61
|
-
return schema.checkChild( parent, 'horizontalLine' );
|
|
41
|
+
/**
|
|
42
|
+
* Checks if a horizontal line is allowed by the schema in the optimal insertion parent.
|
|
43
|
+
*
|
|
44
|
+
* @param model Model instance.
|
|
45
|
+
*/
|
|
46
|
+
function isHorizontalLineAllowedInParent(selection, schema, model) {
|
|
47
|
+
const parent = getInsertHorizontalLineParent(selection, model);
|
|
48
|
+
return schema.checkChild(parent, 'horizontalLine');
|
|
62
49
|
}
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
return parent;
|
|
50
|
+
/**
|
|
51
|
+
* Returns a node that will be used to insert a horizontal line with `model.insertContent` to check if the horizontal line can be
|
|
52
|
+
* placed there.
|
|
53
|
+
*
|
|
54
|
+
* @param model Model instance.
|
|
55
|
+
*/
|
|
56
|
+
function getInsertHorizontalLineParent(selection, model) {
|
|
57
|
+
const insertionRange = findOptimalInsertionRange(selection, model);
|
|
58
|
+
const parent = insertionRange.start.parent;
|
|
59
|
+
if (parent.isEmpty && !parent.is('element', '$root')) {
|
|
60
|
+
return parent.parent;
|
|
61
|
+
}
|
|
62
|
+
return parent;
|
|
79
63
|
}
|
|
@@ -1,85 +1,64 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @license Copyright (c) 2003-
|
|
2
|
+
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
3
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
4
|
*/
|
|
5
|
-
|
|
6
5
|
/**
|
|
7
6
|
* @module horizontal-line/horizontallineediting
|
|
8
7
|
*/
|
|
9
|
-
|
|
10
8
|
import { Plugin } from 'ckeditor5/src/core';
|
|
11
9
|
import { toWidget } from 'ckeditor5/src/widget';
|
|
12
|
-
|
|
13
10
|
import HorizontalLineCommand from './horizontallinecommand';
|
|
14
|
-
|
|
15
11
|
import '../theme/horizontalline.css';
|
|
16
|
-
|
|
17
12
|
/**
|
|
18
13
|
* The horizontal line editing feature.
|
|
19
|
-
*
|
|
20
|
-
* @extends module:core/plugin~Plugin
|
|
21
14
|
*/
|
|
22
15
|
export default class HorizontalLineEditing extends Plugin {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
writer.addClass( 'ck-horizontal-line', viewWrapper );
|
|
60
|
-
writer.setCustomProperty( 'hr', true, viewWrapper );
|
|
61
|
-
|
|
62
|
-
return toHorizontalLineWidget( viewWrapper, writer, label );
|
|
63
|
-
}
|
|
64
|
-
} );
|
|
65
|
-
|
|
66
|
-
conversion.for( 'upcast' ).elementToElement( { view: 'hr', model: 'horizontalLine' } );
|
|
67
|
-
|
|
68
|
-
editor.commands.add( 'horizontalLine', new HorizontalLineCommand( editor ) );
|
|
69
|
-
}
|
|
16
|
+
/**
|
|
17
|
+
* @inheritDoc
|
|
18
|
+
*/
|
|
19
|
+
static get pluginName() {
|
|
20
|
+
return 'HorizontalLineEditing';
|
|
21
|
+
}
|
|
22
|
+
/**
|
|
23
|
+
* @inheritDoc
|
|
24
|
+
*/
|
|
25
|
+
init() {
|
|
26
|
+
const editor = this.editor;
|
|
27
|
+
const schema = editor.model.schema;
|
|
28
|
+
const t = editor.t;
|
|
29
|
+
const conversion = editor.conversion;
|
|
30
|
+
schema.register('horizontalLine', {
|
|
31
|
+
inheritAllFrom: '$blockObject'
|
|
32
|
+
});
|
|
33
|
+
conversion.for('dataDowncast').elementToElement({
|
|
34
|
+
model: 'horizontalLine',
|
|
35
|
+
view: (modelElement, { writer }) => {
|
|
36
|
+
return writer.createEmptyElement('hr');
|
|
37
|
+
}
|
|
38
|
+
});
|
|
39
|
+
conversion.for('editingDowncast').elementToStructure({
|
|
40
|
+
model: 'horizontalLine',
|
|
41
|
+
view: (modelElement, { writer }) => {
|
|
42
|
+
const label = t('Horizontal line');
|
|
43
|
+
const viewWrapper = writer.createContainerElement('div', null, writer.createEmptyElement('hr'));
|
|
44
|
+
writer.addClass('ck-horizontal-line', viewWrapper);
|
|
45
|
+
writer.setCustomProperty('hr', true, viewWrapper);
|
|
46
|
+
return toHorizontalLineWidget(viewWrapper, writer, label);
|
|
47
|
+
}
|
|
48
|
+
});
|
|
49
|
+
conversion.for('upcast').elementToElement({ view: 'hr', model: 'horizontalLine' });
|
|
50
|
+
editor.commands.add('horizontalLine', new HorizontalLineCommand(editor));
|
|
51
|
+
}
|
|
70
52
|
}
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
writer.setCustomProperty( 'horizontalLine', true, viewElement );
|
|
83
|
-
|
|
84
|
-
return toWidget( viewElement, writer, { label } );
|
|
53
|
+
/**
|
|
54
|
+
* Converts a given {@link module:engine/view/element~Element} to a horizontal line widget:
|
|
55
|
+
* * Adds a {@link module:engine/view/element~Element#_setCustomProperty custom property} allowing to
|
|
56
|
+
* recognize the horizontal line widget element.
|
|
57
|
+
* * Calls the {@link module:widget/utils~toWidget} function with the proper element's label creator.
|
|
58
|
+
*
|
|
59
|
+
* @param writer An instance of the view writer.
|
|
60
|
+
*/
|
|
61
|
+
function toHorizontalLineWidget(viewElement, writer, label) {
|
|
62
|
+
writer.setCustomProperty('horizontalLine', true, viewElement);
|
|
63
|
+
return toWidget(viewElement, writer, { label });
|
|
85
64
|
}
|
package/src/horizontallineui.js
CHANGED
|
@@ -1,57 +1,45 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @license Copyright (c) 2003-
|
|
2
|
+
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
3
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
4
|
*/
|
|
5
|
-
|
|
6
5
|
/**
|
|
7
6
|
* @module horizontal-line/horizontallineui
|
|
8
7
|
*/
|
|
9
|
-
|
|
10
8
|
import { Plugin } from 'ckeditor5/src/core';
|
|
11
9
|
import { ButtonView } from 'ckeditor5/src/ui';
|
|
12
|
-
|
|
13
10
|
import horizontalLineIcon from '../theme/icons/horizontalline.svg';
|
|
14
|
-
|
|
15
11
|
/**
|
|
16
12
|
* The horizontal line UI plugin.
|
|
17
|
-
*
|
|
18
|
-
* @extends module:core/plugin~Plugin
|
|
19
13
|
*/
|
|
20
14
|
export default class HorizontalLineUI extends Plugin {
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
editor.editing.view.focus();
|
|
52
|
-
} );
|
|
53
|
-
|
|
54
|
-
return view;
|
|
55
|
-
} );
|
|
56
|
-
}
|
|
15
|
+
/**
|
|
16
|
+
* @inheritDoc
|
|
17
|
+
*/
|
|
18
|
+
static get pluginName() {
|
|
19
|
+
return 'HorizontalLineUI';
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* @inheritDoc
|
|
23
|
+
*/
|
|
24
|
+
init() {
|
|
25
|
+
const editor = this.editor;
|
|
26
|
+
const t = editor.t;
|
|
27
|
+
// Add the `horizontalLine` button to feature components.
|
|
28
|
+
editor.ui.componentFactory.add('horizontalLine', locale => {
|
|
29
|
+
const command = editor.commands.get('horizontalLine');
|
|
30
|
+
const view = new ButtonView(locale);
|
|
31
|
+
view.set({
|
|
32
|
+
label: t('Horizontal line'),
|
|
33
|
+
icon: horizontalLineIcon,
|
|
34
|
+
tooltip: true
|
|
35
|
+
});
|
|
36
|
+
view.bind('isEnabled').to(command, 'isEnabled');
|
|
37
|
+
// Execute the command.
|
|
38
|
+
this.listenTo(view, 'execute', () => {
|
|
39
|
+
editor.execute('horizontalLine');
|
|
40
|
+
editor.editing.view.focus();
|
|
41
|
+
});
|
|
42
|
+
return view;
|
|
43
|
+
});
|
|
44
|
+
}
|
|
57
45
|
}
|
package/src/index.js
CHANGED
|
@@ -1,12 +1,10 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* @license Copyright (c) 2003-
|
|
2
|
+
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
3
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
4
|
*/
|
|
5
|
-
|
|
6
5
|
/**
|
|
7
6
|
* @module horizontal-line
|
|
8
7
|
*/
|
|
9
|
-
|
|
10
8
|
export { default as HorizontalLine } from './horizontalline';
|
|
11
9
|
export { default as HorizontalLineEditing } from './horizontallineediting';
|
|
12
10
|
export { default as HorizontalLineUI } from './horizontallineui';
|
package/theme/horizontalline.css
CHANGED