@ckeditor/ckeditor5-font 36.0.1 → 37.0.0-alpha.1

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.
Files changed (56) hide show
  1. package/build/font.js +1 -1
  2. package/package.json +20 -15
  3. package/src/augmentation.d.ts +58 -0
  4. package/src/augmentation.js +5 -0
  5. package/src/documentcolorcollection.d.ts +70 -0
  6. package/src/documentcolorcollection.js +34 -63
  7. package/src/font.d.ts +29 -0
  8. package/src/font.js +12 -19
  9. package/src/fontbackgroundcolor/fontbackgroundcolorcommand.d.ts +26 -0
  10. package/src/fontbackgroundcolor/fontbackgroundcolorcommand.js +9 -15
  11. package/src/fontbackgroundcolor/fontbackgroundcolorediting.d.ts +26 -0
  12. package/src/fontbackgroundcolor/fontbackgroundcolorediting.js +103 -116
  13. package/src/fontbackgroundcolor/fontbackgroundcolorui.d.ts +22 -0
  14. package/src/fontbackgroundcolor/fontbackgroundcolorui.js +18 -25
  15. package/src/fontbackgroundcolor.d.ts +28 -0
  16. package/src/fontbackgroundcolor.js +12 -165
  17. package/src/fontcolor/fontcolorcommand.d.ts +25 -0
  18. package/src/fontcolor/fontcolorcommand.js +9 -15
  19. package/src/fontcolor/fontcolorediting.d.ts +26 -0
  20. package/src/fontcolor/fontcolorediting.js +115 -128
  21. package/src/fontcolor/fontcolorui.d.ts +22 -0
  22. package/src/fontcolor/fontcolorui.js +18 -25
  23. package/src/fontcolor.d.ts +24 -0
  24. package/src/fontcolor.js +12 -168
  25. package/src/fontcommand.d.ts +46 -0
  26. package/src/fontcommand.js +54 -78
  27. package/src/fontconfig.d.ts +367 -0
  28. package/src/fontconfig.js +5 -0
  29. package/src/fontfamily/fontfamilycommand.d.ts +25 -0
  30. package/src/fontfamily/fontfamilycommand.js +9 -15
  31. package/src/fontfamily/fontfamilyediting.d.ts +39 -0
  32. package/src/fontfamily/fontfamilyediting.js +95 -116
  33. package/src/fontfamily/fontfamilyui.d.ts +30 -0
  34. package/src/fontfamily/fontfamilyui.js +90 -122
  35. package/src/fontfamily/utils.d.ts +15 -0
  36. package/src/fontfamily/utils.js +66 -79
  37. package/src/fontfamily.d.ts +24 -0
  38. package/src/fontfamily.js +12 -112
  39. package/src/fontsize/fontsizecommand.d.ts +25 -0
  40. package/src/fontsize/fontsizecommand.js +9 -15
  41. package/src/fontsize/fontsizeediting.d.ts +44 -0
  42. package/src/fontsize/fontsizeediting.js +137 -169
  43. package/src/fontsize/fontsizeui.d.ts +31 -0
  44. package/src/fontsize/fontsizeui.js +98 -130
  45. package/src/fontsize/utils.d.ts +12 -0
  46. package/src/fontsize/utils.js +145 -174
  47. package/src/fontsize.d.ts +35 -0
  48. package/src/fontsize.js +21 -141
  49. package/src/index.d.ts +27 -0
  50. package/src/index.js +1 -2
  51. package/src/ui/colortableview.d.ts +167 -0
  52. package/src/ui/colortableview.js +242 -418
  53. package/src/ui/colorui.d.ts +63 -0
  54. package/src/ui/colorui.js +78 -132
  55. package/src/utils.d.ts +77 -0
  56. package/src/utils.js +42 -72
package/build/font.js CHANGED
@@ -2,4 +2,4 @@
2
2
  /*!
3
3
  * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
4
4
  * For licensing, see LICENSE.md.
5
- */(()=>{var e={159:(e,t,o)=>{"use strict";o.d(t,{Z:()=>s});var n=o(609),r=o.n(n)()((function(e){return e[1]}));r.push([e.id,".ck .ck-button.ck-color-table__remove-color{align-items:center;display:flex;width:100%}label.ck.ck-color-grid__label{font-weight:unset}.ck .ck-button.ck-color-table__remove-color{border-bottom-left-radius:0;border-bottom-right-radius:0;padding:calc(var(--ck-spacing-standard)/2) var(--ck-spacing-standard)}.ck .ck-button.ck-color-table__remove-color:not(:focus){border-bottom:1px solid var(--ck-color-base-border)}[dir=ltr] .ck .ck-button.ck-color-table__remove-color .ck.ck-icon{margin-right:var(--ck-spacing-standard)}[dir=rtl] .ck .ck-button.ck-color-table__remove-color .ck.ck-icon{margin-left:var(--ck-spacing-standard)}",""]);const s=r},222:(e,t,o)=>{"use strict";o.d(t,{Z:()=>s});var n=o(609),r=o.n(n)()((function(e){return e[1]}));r.push([e.id,".ck-content .text-tiny{font-size:.7em}.ck-content .text-small{font-size:.85em}.ck-content .text-big{font-size:1.4em}.ck-content .text-huge{font-size:1.8em}",""]);const s=r},609:e=>{"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var o=e(t);return t[2]?"@media ".concat(t[2]," {").concat(o,"}"):o})).join("")},t.i=function(e,o,n){"string"==typeof e&&(e=[[null,e,""]]);var r={};if(n)for(var s=0;s<this.length;s++){var i=this[s][0];null!=i&&(r[i]=!0)}for(var l=0;l<e.length;l++){var a=[].concat(e[l]);n&&r[a[0]]||(o&&(a[2]?a[2]="".concat(o," and ").concat(a[2]):a[2]=o),t.push(a))}},t}},62:(e,t,o)=>{"use strict";var n,r=function(){return void 0===n&&(n=Boolean(window&&document&&document.all&&!window.atob)),n},s=function(){var e={};return function(t){if(void 0===e[t]){var o=document.querySelector(t);if(window.HTMLIFrameElement&&o instanceof window.HTMLIFrameElement)try{o=o.contentDocument.head}catch(e){o=null}e[t]=o}return e[t]}}(),i=[];function l(e){for(var t=-1,o=0;o<i.length;o++)if(i[o].identifier===e){t=o;break}return t}function a(e,t){for(var o={},n=[],r=0;r<e.length;r++){var s=e[r],a=t.base?s[0]+t.base:s[0],c=o[a]||0,u="".concat(a," ").concat(c);o[a]=c+1;var d=l(u),m={css:s[1],media:s[2],sourceMap:s[3]};-1!==d?(i[d].references++,i[d].updater(m)):i.push({identifier:u,updater:g(m,t),references:1}),n.push(u)}return n}function c(e){var t=document.createElement("style"),n=e.attributes||{};if(void 0===n.nonce){var r=o.nc;r&&(n.nonce=r)}if(Object.keys(n).forEach((function(e){t.setAttribute(e,n[e])})),"function"==typeof e.insert)e.insert(t);else{var i=s(e.insert||"head");if(!i)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");i.appendChild(t)}return t}var u,d=(u=[],function(e,t){return u[e]=t,u.filter(Boolean).join("\n")});function m(e,t,o,n){var r=o?"":n.media?"@media ".concat(n.media," {").concat(n.css,"}"):n.css;if(e.styleSheet)e.styleSheet.cssText=d(t,r);else{var s=document.createTextNode(r),i=e.childNodes;i[t]&&e.removeChild(i[t]),i.length?e.insertBefore(s,i[t]):e.appendChild(s)}}function h(e,t,o){var n=o.css,r=o.media,s=o.sourceMap;if(r?e.setAttribute("media",r):e.removeAttribute("media"),s&&"undefined"!=typeof btoa&&(n+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(s))))," */")),e.styleSheet)e.styleSheet.cssText=n;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(n))}}var p=null,f=0;function g(e,t){var o,n,r;if(t.singleton){var s=f++;o=p||(p=c(t)),n=m.bind(null,o,s,!1),r=m.bind(null,o,s,!0)}else o=c(t),n=h.bind(null,o,t),r=function(){!function(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e)}(o)};return n(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap)return;n(e=t)}else r()}}e.exports=function(e,t){(t=t||{}).singleton||"boolean"==typeof t.singleton||(t.singleton=r());var o=a(e=e||[],t);return function(e){if(e=e||[],"[object Array]"===Object.prototype.toString.call(e)){for(var n=0;n<o.length;n++){var r=l(o[n]);i[r].references--}for(var s=a(e,t),c=0;c<o.length;c++){var u=l(o[c]);0===i[u].references&&(i[u].updater(),i.splice(u,1))}o=s}}}},704:(e,t,o)=>{e.exports=o(79)("./src/core.js")},492:(e,t,o)=>{e.exports=o(79)("./src/engine.js")},273:(e,t,o)=>{e.exports=o(79)("./src/ui.js")},209:(e,t,o)=>{e.exports=o(79)("./src/utils.js")},79:e=>{"use strict";e.exports=CKEditor5.dll}},t={};function o(n){var r=t[n];if(void 0!==r)return r.exports;var s=t[n]={id:n,exports:{}};return e[n](s,s.exports,o),s.exports}o.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return o.d(t,{a:t}),t},o.d=(e,t)=>{for(var n in t)o.o(t,n)&&!o.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.nc=void 0;var n={};(()=>{"use strict";o.r(n),o.d(n,{Font:()=>U,FontBackgroundColor:()=>K,FontBackgroundColorEditing:()=>R,FontBackgroundColorUI:()=>$,FontColor:()=>M,FontColorEditing:()=>G,FontColorUI:()=>H,FontFamily:()=>F,FontFamilyEditing:()=>k,FontFamilyUI:()=>T,FontSize:()=>D,FontSizeEditing:()=>E,FontSizeUI:()=>V});var e=o(704);class t extends e.Command{constructor(e,t){super(e),this.attributeKey=t}refresh(){const e=this.editor.model,t=e.document;this.value=t.selection.getAttribute(this.attributeKey),this.isEnabled=e.schema.checkAttributeInSelection(t.selection,this.attributeKey)}execute(e={}){const t=this.editor.model,o=t.document.selection,n=e.value;t.change((e=>{if(o.isCollapsed)n?e.setSelectionAttribute(this.attributeKey,n):e.removeSelectionAttribute(this.attributeKey);else{const r=t.schema.getValidRanges(o.getRanges(),this.attributeKey);for(const t of r)n?e.setAttribute(this.attributeKey,n,t):e.removeAttribute(this.attributeKey,t)}}))}}var r=o(273),s=o(209);class i extends s.Collection{constructor(e){super(e),this.set("isEmpty",!0),this.on("change",(()=>{this.set("isEmpty",0===this.length)}))}add(e,t){this.find((t=>t.color===e.color))||super.add(e,t)}hasColor(e){return!!this.find((t=>t.color===e))}}(0,s.mix)(i,s.ObservableMixin);var l=o(62),a=o.n(l),c=o(159),u={injectType:"singletonStyleTag",attributes:{"data-cke":!0},insert:"head",singleton:!0};a()(c.Z,u);c.Z.locals;class d extends r.View{constructor(e,{colors:t,columns:o,removeButtonLabel:n,documentColorsLabel:l,documentColorsCount:a}){super(e),this.items=this.createCollection(),this.colorDefinitions=t,this.focusTracker=new s.FocusTracker,this.keystrokes=new s.KeystrokeHandler,this.set("selectedColor"),this.removeButtonLabel=n,this.columns=o,this.documentColors=new i,this.documentColorsCount=a,this._focusables=new r.ViewCollection,this._focusCycler=new r.FocusCycler({focusables:this._focusables,focusTracker:this.focusTracker,keystrokeHandler:this.keystrokes,actions:{focusPrevious:"shift + tab",focusNext:"tab"}}),this._documentColorsLabel=l,this.setTemplate({tag:"div",attributes:{class:["ck","ck-color-table"]},children:this.items}),this.items.add(this._createRemoveColorButton())}updateDocumentColors(e,t){const o=e.document,n=this.documentColorsCount;this.documentColors.clear();for(const r of o.getRootNames()){const s=o.getRoot(r),i=e.createRangeIn(s);for(const e of i.getItems())if(e.is("$textProxy")&&e.hasAttribute(t)&&(this._addColorToDocumentColors(e.getAttribute(t)),this.documentColors.length>=n))return}}updateSelectedColors(){const e=this.documentColorsGrid,t=this.staticColorsGrid,o=this.selectedColor;t.selectedColor=o,e&&(e.selectedColor=o)}render(){super.render(),this.keystrokes.listenTo(this.element)}destroy(){super.destroy(),this.focusTracker.destroy(),this.keystrokes.destroy()}appendGrids(){if(!this.staticColorsGrid&&(this.staticColorsGrid=this._createStaticColorsGrid(),this.items.add(this.staticColorsGrid),this.focusTracker.add(this.staticColorsGrid.element),this._focusables.add(this.staticColorsGrid),this.documentColorsCount)){const e=r.Template.bind(this.documentColors,this.documentColors),t=new r.LabelView(this.locale);t.text=this._documentColorsLabel,t.extendTemplate({attributes:{class:["ck","ck-color-grid__label",e.if("isEmpty","ck-hidden")]}}),this.items.add(t),this.documentColorsGrid=this._createDocumentColorsGrid(),this.items.add(this.documentColorsGrid),this.focusTracker.add(this.documentColorsGrid.element),this._focusables.add(this.documentColorsGrid)}}focus(){this._focusCycler.focusFirst()}focusLast(){this._focusCycler.focusLast()}_createRemoveColorButton(){const t=new r.ButtonView;return t.set({withText:!0,icon:e.icons.eraser,label:this.removeButtonLabel}),t.class="ck-color-table__remove-color",t.on("execute",(()=>{this.fire("execute",{value:null})})),t.render(),this.focusTracker.add(t.element),this._focusables.add(t),t}_createStaticColorsGrid(){const e=new r.ColorGridView(this.locale,{colorDefinitions:this.colorDefinitions,columns:this.columns});return e.delegate("execute").to(this),e}_createDocumentColorsGrid(){const e=r.Template.bind(this.documentColors,this.documentColors),t=new r.ColorGridView(this.locale,{columns:this.columns});return t.delegate("execute").to(this),t.extendTemplate({attributes:{class:e.if("isEmpty","ck-hidden")}}),t.items.bindTo(this.documentColors).using((e=>{const t=new r.ColorTileView;return t.set({color:e.color,hasBorder:e.options&&e.options.hasBorder}),e.label&&t.set({label:e.label,tooltip:!0}),t.on("execute",(()=>{this.fire("execute",{value:e.color})})),t})),this.documentColors.on("change:isEmpty",((e,o,n)=>{n&&(t.selectedColor=null)})),t}_addColorToDocumentColors(e){const t=this.colorDefinitions.find((t=>t.color===e));t?this.documentColors.add(Object.assign({},t)):this.documentColors.add({color:e,label:e,options:{hasBorder:!1}})}}const m="fontSize",h="fontFamily",p="fontColor",f="fontBackgroundColor";function g(e,t){const o={model:{key:e,values:[]},view:{},upcastAlso:{}};for(const e of t)o.model.values.push(e.model),o.view[e.model]=e.view,e.upcastAlso&&(o.upcastAlso[e.model]=e.upcastAlso);return o}function b(e){return t=>t.getStyle(e).replace(/\s/g,"")}function v(e){return(t,{writer:o})=>o.createAttributeElement("span",{style:`${e}:${t}`},{priority:7})}class w extends t{constructor(e){super(e,h)}}function y(e){return e.map(C).filter((e=>!!e))}function C(e){return"object"==typeof e?e:"default"===e?{title:"Default",model:void 0}:"string"==typeof e?function(e){const t=e.replace(/"|'/g,"").split(","),o=t[0],n=t.map(x).join(", ");return{title:o,model:n,view:{name:"span",styles:{"font-family":n},priority:7}}}(e):void 0}function x(e){return(e=e.trim()).indexOf(" ")>0&&(e=`'${e}'`),e}class k extends e.Plugin{static get pluginName(){return"FontFamilyEditing"}constructor(e){super(e),e.config.define(h,{options:["default","Arial, Helvetica, sans-serif","Courier New, Courier, monospace","Georgia, serif","Lucida Sans Unicode, Lucida Grande, sans-serif","Tahoma, Geneva, sans-serif","Times New Roman, Times, serif","Trebuchet MS, Helvetica, sans-serif","Verdana, Geneva, sans-serif"],supportAllValues:!1})}init(){const e=this.editor;e.model.schema.extend("$text",{allowAttributes:h}),e.model.schema.setAttributeProperties(h,{isFormatting:!0,copyOnEnter:!0});const t=y(e.config.get("fontFamily.options")).filter((e=>e.model)),o=g(h,t);e.config.get("fontFamily.supportAllValues")?(this._prepareAnyValueConverters(),this._prepareCompatibilityConverter()):e.conversion.attributeToElement(o),e.commands.add(h,new w(e))}_prepareAnyValueConverters(){const e=this.editor;e.conversion.for("downcast").attributeToElement({model:h,view:(e,{writer:t})=>t.createAttributeElement("span",{style:"font-family:"+e},{priority:7})}),e.conversion.for("upcast").elementToAttribute({model:{key:h,value:e=>e.getStyle("font-family")},view:{name:"span",styles:{"font-family":/.*/}}})}_prepareCompatibilityConverter(){this.editor.conversion.for("upcast").elementToAttribute({view:{name:"font",attributes:{face:/.*/}},model:{key:h,value:e=>e.getAttribute("face")}})}}class T extends e.Plugin{static get pluginName(){return"FontFamilyUI"}init(){const e=this.editor,t=e.t,o=this._getLocalizedOptions(),n=e.commands.get(h);e.ui.componentFactory.add(h,(i=>{const l=(0,r.createDropdown)(i);return(0,r.addListToDropdown)(l,(()=>function(e,t){const o=new s.Collection;for(const n of e){const e={type:"button",model:new r.Model({commandName:h,commandParam:n.model,label:n.title,withText:!0})};e.model.bind("isOn").to(t,"value",(e=>e===n.model||!(!e||!n.model)&&e.split(",")[0].replace(/'/g,"").toLowerCase()===n.model.toLowerCase())),n.view&&n.view.styles&&e.model.set("labelStyle",`font-family: ${n.view.styles["font-family"]}`),o.add(e)}return o}(o,n))),l.buttonView.set({label:t("Font Family"),icon:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M11.03 3h6.149a.75.75 0 1 1 0 1.5h-5.514L11.03 3zm1.27 3h4.879a.75.75 0 1 1 0 1.5h-4.244L12.3 6zm1.27 3h3.609a.75.75 0 1 1 0 1.5h-2.973L13.57 9zm-2.754 2.5L8.038 4.785 5.261 11.5h5.555zm.62 1.5H4.641l-1.666 4.028H1.312l5.789-14h1.875l5.789 14h-1.663L11.436 13z"/></svg>',tooltip:!0}),l.extendTemplate({attributes:{class:"ck-font-family-dropdown"}}),l.bind("isEnabled").to(n),this.listenTo(l,"execute",(t=>{e.execute(t.source.commandName,{value:t.source.commandParam}),e.editing.view.focus()})),l}))}_getLocalizedOptions(){const e=this.editor,t=e.t;return y(e.config.get(h).options).map((e=>("Default"===e.title&&(e.title=t("Default")),e)))}}class F extends e.Plugin{static get requires(){return[k,T]}static get pluginName(){return"FontFamily"}}var S=o(492);class L extends t{constructor(e){super(e,m)}}function A(e){return e.map((e=>function(e){if(t=e,"object"==typeof t&&t.title&&t.model&&t.view)return z(e);var t;const o=function(e){return _[e]||_[e.model]}(e);if(o)return z(o);if("default"===e)return{model:void 0,title:"Default"};if(function(e){let t;if("object"==typeof e){if(!e.model)throw new s.CKEditorError("font-size-invalid-definition",null,e);t=parseFloat(e.model)}else t=parseFloat(e);return isNaN(t)}(e))return;return function(e){"number"!=typeof e&&"string"!=typeof e||(e={title:String(e),model:`${parseFloat(e)}px`});return e.view={name:"span",styles:{"font-size":e.model}},z(e)}(e)}(e))).filter((e=>!!e))}const _={get tiny(){return{title:"Tiny",model:"tiny",view:{name:"span",classes:"text-tiny",priority:7}}},get small(){return{title:"Small",model:"small",view:{name:"span",classes:"text-small",priority:7}}},get big(){return{title:"Big",model:"big",view:{name:"span",classes:"text-big",priority:7}}},get huge(){return{title:"Huge",model:"huge",view:{name:"span",classes:"text-huge",priority:7}}}};function z(e){return e.view.priority||(e.view.priority=7),e}const N=["x-small","x-small","small","medium","large","x-large","xx-large","xxx-large"];class E extends e.Plugin{static get pluginName(){return"FontSizeEditing"}constructor(e){super(e),e.config.define(m,{options:["tiny","small","default","big","huge"],supportAllValues:!1})}init(){const e=this.editor;e.model.schema.extend("$text",{allowAttributes:m}),e.model.schema.setAttributeProperties(m,{isFormatting:!0,copyOnEnter:!0});const t=e.config.get("fontSize.supportAllValues"),o=A(this.editor.config.get("fontSize.options")).filter((e=>e.model)),n=g(m,o);t?(this._prepareAnyValueConverters(n),this._prepareCompatibilityConverter()):e.conversion.attributeToElement(n),e.commands.add(m,new L(e))}_prepareAnyValueConverters(e){const t=this.editor,o=e.model.values.filter((e=>!(0,S.isLength)(String(e))&&!(0,S.isPercentage)(String(e))));if(o.length)throw new s.CKEditorError("font-size-invalid-use-of-named-presets",null,{presets:o});t.conversion.for("downcast").attributeToElement({model:m,view:(e,{writer:t})=>{if(e)return t.createAttributeElement("span",{style:"font-size:"+e},{priority:7})}}),t.conversion.for("upcast").elementToAttribute({model:{key:m,value:e=>e.getStyle("font-size")},view:{name:"span",styles:{"font-size":/.*/}}})}_prepareCompatibilityConverter(){this.editor.conversion.for("upcast").elementToAttribute({view:{name:"font",attributes:{size:/^[+-]?\d{1,3}$/}},model:{key:m,value:e=>{const t=e.getAttribute("size"),o="-"===t[0]||"+"===t[0];let n=parseInt(t,10);o&&(n=3+n);const r=N.length-1,s=Math.min(Math.max(n,0),r);return N[s]}}})}}var B=o(222),O={injectType:"singletonStyleTag",attributes:{"data-cke":!0},insert:"head",singleton:!0};a()(B.Z,O);B.Z.locals;class V extends e.Plugin{static get pluginName(){return"FontSizeUI"}init(){const e=this.editor,t=e.t,o=this._getLocalizedOptions(),n=e.commands.get(m);e.ui.componentFactory.add(m,(i=>{const l=(0,r.createDropdown)(i);return(0,r.addListToDropdown)(l,(()=>function(e,t){const o=new s.Collection;for(const n of e){const e={type:"button",model:new r.Model({commandName:m,commandParam:n.model,label:n.title,class:"ck-fontsize-option",withText:!0})};n.view&&n.view.styles&&e.model.set("labelStyle",`font-size:${n.view.styles["font-size"]}`),n.view&&n.view.classes&&e.model.set("class",`${e.model.class} ${n.view.classes}`),e.model.bind("isOn").to(t,"value",(e=>e===n.model)),o.add(e)}return o}(o,n))),l.buttonView.set({label:t("Font Size"),icon:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M9.816 11.5 7.038 4.785 4.261 11.5h5.555zm.62 1.5H3.641l-1.666 4.028H.312l5.789-14h1.875l5.789 14h-1.663L10.436 13zm7.55 2.279.779-.779.707.707-2.265 2.265-2.193-2.265.707-.707.765.765V4.825c0-.042 0-.083.002-.123l-.77.77-.707-.707L17.207 2.5l2.265 2.265-.707.707-.782-.782c.002.043.003.089.003.135v10.454z"/></svg>',tooltip:!0}),l.extendTemplate({attributes:{class:["ck-font-size-dropdown"]}}),l.bind("isEnabled").to(n),this.listenTo(l,"execute",(t=>{e.execute(t.source.commandName,{value:t.source.commandParam}),e.editing.view.focus()})),l}))}_getLocalizedOptions(){const e=this.editor,t=e.t,o={Default:t("Default"),Tiny:t("Tiny"),Small:t("Small"),Big:t("Big"),Huge:t("Huge")};return A(e.config.get(m).options).map((e=>{const t=o[e.title];return t&&t!=e.title&&(e=Object.assign({},e,{title:t})),e}))}}class D extends e.Plugin{static get requires(){return[E,V]}static get pluginName(){return"FontSize"}normalizeSizeOptions(e){return A(e)}}class P extends t{constructor(e){super(e,p)}}class G extends e.Plugin{static get pluginName(){return"FontColorEditing"}constructor(e){super(e),e.config.define(p,{colors:[{color:"hsl(0, 0%, 0%)",label:"Black"},{color:"hsl(0, 0%, 30%)",label:"Dim grey"},{color:"hsl(0, 0%, 60%)",label:"Grey"},{color:"hsl(0, 0%, 90%)",label:"Light grey"},{color:"hsl(0, 0%, 100%)",label:"White",hasBorder:!0},{color:"hsl(0, 75%, 60%)",label:"Red"},{color:"hsl(30, 75%, 60%)",label:"Orange"},{color:"hsl(60, 75%, 60%)",label:"Yellow"},{color:"hsl(90, 75%, 60%)",label:"Light green"},{color:"hsl(120, 75%, 60%)",label:"Green"},{color:"hsl(150, 75%, 60%)",label:"Aquamarine"},{color:"hsl(180, 75%, 60%)",label:"Turquoise"},{color:"hsl(210, 75%, 60%)",label:"Light blue"},{color:"hsl(240, 75%, 60%)",label:"Blue"},{color:"hsl(270, 75%, 60%)",label:"Purple"}],columns:5}),e.conversion.for("upcast").elementToAttribute({view:{name:"span",styles:{color:/[\s\S]+/}},model:{key:p,value:b("color")}}),e.conversion.for("upcast").elementToAttribute({view:{name:"font",attributes:{color:/^#?\w+$/}},model:{key:p,value:e=>e.getAttribute("color")}}),e.conversion.for("downcast").attributeToElement({model:p,view:v("color")}),e.commands.add(p,new P(e)),e.model.schema.extend("$text",{allowAttributes:p}),e.model.schema.setAttributeProperties(p,{isFormatting:!0,copyOnEnter:!0})}}class j extends e.Plugin{constructor(e,{commandName:t,icon:o,componentName:n,dropdownLabel:r}){super(e),this.commandName=t,this.componentName=n,this.icon=o,this.dropdownLabel=r,this.columns=e.config.get(`${this.componentName}.columns`),this.colorTableView=void 0}init(){const e=this.editor,t=e.locale,o=t.t,n=e.commands.get(this.commandName),s=(0,r.normalizeColorOptions)(e.config.get(this.componentName).colors),i=(0,r.getLocalizedColorOptions)(t,s),l=e.config.get(`${this.componentName}.documentColors`);e.ui.componentFactory.add(this.componentName,(t=>{const s=(0,r.createDropdown)(t);return this.colorTableView=function({dropdownView:e,colors:t,columns:o,removeButtonLabel:n,documentColorsLabel:r,documentColorsCount:s}){const i=e.locale,l=new d(i,{colors:t,columns:o,removeButtonLabel:n,documentColorsLabel:r,documentColorsCount:s});return e.colorTableView=l,e.panelView.children.add(l),l.delegate("execute").to(e,"execute"),l}({dropdownView:s,colors:i.map((e=>({label:e.label,color:e.model,options:{hasBorder:e.hasBorder}}))),columns:this.columns,removeButtonLabel:o("Remove color"),documentColorsLabel:0!==l?o("Document colors"):void 0,documentColorsCount:void 0===l?this.columns:l}),this.colorTableView.bind("selectedColor").to(n,"value"),s.buttonView.set({label:this.dropdownLabel,icon:this.icon,tooltip:!0}),s.extendTemplate({attributes:{class:"ck-color-ui-dropdown"}}),s.bind("isEnabled").to(n),s.on("execute",((t,o)=>{e.execute(this.commandName,o),e.editing.view.focus()})),s.on("change:isOpen",((t,o,n)=>{s.colorTableView.appendGrids(),n&&(0!==l&&this.colorTableView.updateDocumentColors(e.model,this.componentName),this.colorTableView.updateSelectedColors())})),(0,r.focusChildOnDropdownOpen)(s,(()=>s.colorTableView.staticColorsGrid.items.find((e=>e.isOn)))),s}))}}class H extends j{constructor(e){const t=e.locale.t;super(e,{commandName:p,componentName:p,icon:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12.4 10.3 10 4.5l-2.4 5.8h4.8zm.5 1.2H7.1L5.7 15H4.2l5-12h1.6l5 12h-1.5L13 11.5zm3.1 7H4a1 1 0 0 1 0-2h12a1 1 0 0 1 0 2z"/></svg>',dropdownLabel:t("Font Color")})}static get pluginName(){return"FontColorUI"}}class M extends e.Plugin{static get requires(){return[G,H]}static get pluginName(){return"FontColor"}}class I extends t{constructor(e){super(e,f)}}class R extends e.Plugin{static get pluginName(){return"FontBackgroundColorEditing"}constructor(e){super(e),e.config.define(f,{colors:[{color:"hsl(0, 0%, 0%)",label:"Black"},{color:"hsl(0, 0%, 30%)",label:"Dim grey"},{color:"hsl(0, 0%, 60%)",label:"Grey"},{color:"hsl(0, 0%, 90%)",label:"Light grey"},{color:"hsl(0, 0%, 100%)",label:"White",hasBorder:!0},{color:"hsl(0, 75%, 60%)",label:"Red"},{color:"hsl(30, 75%, 60%)",label:"Orange"},{color:"hsl(60, 75%, 60%)",label:"Yellow"},{color:"hsl(90, 75%, 60%)",label:"Light green"},{color:"hsl(120, 75%, 60%)",label:"Green"},{color:"hsl(150, 75%, 60%)",label:"Aquamarine"},{color:"hsl(180, 75%, 60%)",label:"Turquoise"},{color:"hsl(210, 75%, 60%)",label:"Light blue"},{color:"hsl(240, 75%, 60%)",label:"Blue"},{color:"hsl(270, 75%, 60%)",label:"Purple"}],columns:5}),e.data.addStyleProcessorRules(S.addBackgroundRules),e.conversion.for("upcast").elementToAttribute({view:{name:"span",styles:{"background-color":/[\s\S]+/}},model:{key:f,value:b("background-color")}}),e.conversion.for("downcast").attributeToElement({model:f,view:v("background-color")}),e.commands.add(f,new I(e)),e.model.schema.extend("$text",{allowAttributes:f}),e.model.schema.setAttributeProperties(f,{isFormatting:!0,copyOnEnter:!0})}}class $ extends j{constructor(e){const t=e.locale.t;super(e,{commandName:f,componentName:f,icon:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M4 2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2zm8.38 9.262H7.62L10 5.506l2.38 5.756zm.532 1.285L14.34 16h1.426L10.804 4H9.196L4.234 16H5.66l1.428-3.453h5.824z"/></svg>',dropdownLabel:t("Font Background Color")})}static get pluginName(){return"FontBackgroundColorUI"}}class K extends e.Plugin{static get requires(){return[R,$]}static get pluginName(){return"FontBackgroundColor"}}class U extends e.Plugin{static get requires(){return[F,D,M,K]}static get pluginName(){return"Font"}}})(),(window.CKEditor5=window.CKEditor5||{}).font=n})();
5
+ */(()=>{var e={159:(e,t,o)=>{"use strict";o.d(t,{Z:()=>s});var n=o(609),r=o.n(n)()((function(e){return e[1]}));r.push([e.id,".ck .ck-button.ck-color-table__remove-color{align-items:center;display:flex;width:100%}label.ck.ck-color-grid__label{font-weight:unset}.ck .ck-button.ck-color-table__remove-color{border-bottom-left-radius:0;border-bottom-right-radius:0;padding:calc(var(--ck-spacing-standard)/2) var(--ck-spacing-standard)}.ck .ck-button.ck-color-table__remove-color:not(:focus){border-bottom:1px solid var(--ck-color-base-border)}[dir=ltr] .ck .ck-button.ck-color-table__remove-color .ck.ck-icon{margin-right:var(--ck-spacing-standard)}[dir=rtl] .ck .ck-button.ck-color-table__remove-color .ck.ck-icon{margin-left:var(--ck-spacing-standard)}",""]);const s=r},222:(e,t,o)=>{"use strict";o.d(t,{Z:()=>s});var n=o(609),r=o.n(n)()((function(e){return e[1]}));r.push([e.id,".ck-content .text-tiny{font-size:.7em}.ck-content .text-small{font-size:.85em}.ck-content .text-big{font-size:1.4em}.ck-content .text-huge{font-size:1.8em}",""]);const s=r},609:e=>{"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var o=e(t);return t[2]?"@media ".concat(t[2]," {").concat(o,"}"):o})).join("")},t.i=function(e,o,n){"string"==typeof e&&(e=[[null,e,""]]);var r={};if(n)for(var s=0;s<this.length;s++){var i=this[s][0];null!=i&&(r[i]=!0)}for(var l=0;l<e.length;l++){var a=[].concat(e[l]);n&&r[a[0]]||(o&&(a[2]?a[2]="".concat(o," and ").concat(a[2]):a[2]=o),t.push(a))}},t}},62:(e,t,o)=>{"use strict";var n,r=function(){return void 0===n&&(n=Boolean(window&&document&&document.all&&!window.atob)),n},s=function(){var e={};return function(t){if(void 0===e[t]){var o=document.querySelector(t);if(window.HTMLIFrameElement&&o instanceof window.HTMLIFrameElement)try{o=o.contentDocument.head}catch(e){o=null}e[t]=o}return e[t]}}(),i=[];function l(e){for(var t=-1,o=0;o<i.length;o++)if(i[o].identifier===e){t=o;break}return t}function a(e,t){for(var o={},n=[],r=0;r<e.length;r++){var s=e[r],a=t.base?s[0]+t.base:s[0],c=o[a]||0,u="".concat(a," ").concat(c);o[a]=c+1;var d=l(u),m={css:s[1],media:s[2],sourceMap:s[3]};-1!==d?(i[d].references++,i[d].updater(m)):i.push({identifier:u,updater:g(m,t),references:1}),n.push(u)}return n}function c(e){var t=document.createElement("style"),n=e.attributes||{};if(void 0===n.nonce){var r=o.nc;r&&(n.nonce=r)}if(Object.keys(n).forEach((function(e){t.setAttribute(e,n[e])})),"function"==typeof e.insert)e.insert(t);else{var i=s(e.insert||"head");if(!i)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");i.appendChild(t)}return t}var u,d=(u=[],function(e,t){return u[e]=t,u.filter(Boolean).join("\n")});function m(e,t,o,n){var r=o?"":n.media?"@media ".concat(n.media," {").concat(n.css,"}"):n.css;if(e.styleSheet)e.styleSheet.cssText=d(t,r);else{var s=document.createTextNode(r),i=e.childNodes;i[t]&&e.removeChild(i[t]),i.length?e.insertBefore(s,i[t]):e.appendChild(s)}}function h(e,t,o){var n=o.css,r=o.media,s=o.sourceMap;if(r?e.setAttribute("media",r):e.removeAttribute("media"),s&&"undefined"!=typeof btoa&&(n+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(s))))," */")),e.styleSheet)e.styleSheet.cssText=n;else{for(;e.firstChild;)e.removeChild(e.firstChild);e.appendChild(document.createTextNode(n))}}var p=null,f=0;function g(e,t){var o,n,r;if(t.singleton){var s=f++;o=p||(p=c(t)),n=m.bind(null,o,s,!1),r=m.bind(null,o,s,!0)}else o=c(t),n=h.bind(null,o,t),r=function(){!function(e){if(null===e.parentNode)return!1;e.parentNode.removeChild(e)}(o)};return n(e),function(t){if(t){if(t.css===e.css&&t.media===e.media&&t.sourceMap===e.sourceMap)return;n(e=t)}else r()}}e.exports=function(e,t){(t=t||{}).singleton||"boolean"==typeof t.singleton||(t.singleton=r());var o=a(e=e||[],t);return function(e){if(e=e||[],"[object Array]"===Object.prototype.toString.call(e)){for(var n=0;n<o.length;n++){var r=l(o[n]);i[r].references--}for(var s=a(e,t),c=0;c<o.length;c++){var u=l(o[c]);0===i[u].references&&(i[u].updater(),i.splice(u,1))}o=s}}}},704:(e,t,o)=>{e.exports=o(79)("./src/core.js")},492:(e,t,o)=>{e.exports=o(79)("./src/engine.js")},273:(e,t,o)=>{e.exports=o(79)("./src/ui.js")},209:(e,t,o)=>{e.exports=o(79)("./src/utils.js")},79:e=>{"use strict";e.exports=CKEditor5.dll}},t={};function o(n){var r=t[n];if(void 0!==r)return r.exports;var s=t[n]={id:n,exports:{}};return e[n](s,s.exports,o),s.exports}o.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return o.d(t,{a:t}),t},o.d=(e,t)=>{for(var n in t)o.o(t,n)&&!o.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:t[n]})},o.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.nc=void 0;var n={};(()=>{"use strict";o.r(n),o.d(n,{Font:()=>U,FontBackgroundColor:()=>K,FontBackgroundColorEditing:()=>R,FontBackgroundColorUI:()=>$,FontColor:()=>M,FontColorEditing:()=>G,FontColorUI:()=>H,FontFamily:()=>F,FontFamilyEditing:()=>k,FontFamilyUI:()=>T,FontSize:()=>D,FontSizeEditing:()=>E,FontSizeUI:()=>V});var e=o(704);class t extends e.Command{constructor(e,t){super(e),this.attributeKey=t}refresh(){const e=this.editor.model,t=e.document;this.value=t.selection.getAttribute(this.attributeKey),this.isEnabled=e.schema.checkAttributeInSelection(t.selection,this.attributeKey)}execute(e={}){const t=this.editor.model,o=t.document.selection,n=e.value;t.change((e=>{if(o.isCollapsed)n?e.setSelectionAttribute(this.attributeKey,n):e.removeSelectionAttribute(this.attributeKey);else{const r=t.schema.getValidRanges(o.getRanges(),this.attributeKey);for(const t of r)n?e.setAttribute(this.attributeKey,n,t):e.removeAttribute(this.attributeKey,t)}}))}}var r=o(273),s=o(209);class i extends((0,s.ObservableMixin)(s.Collection)){constructor(e){super(e),this.set("isEmpty",!0),this.on("change",(()=>{this.set("isEmpty",0===this.length)}))}add(e,t){return this.find((t=>t.color===e.color))?this:super.add(e,t)}hasColor(e){return!!this.find((t=>t.color===e))}}var l=o(62),a=o.n(l),c=o(159),u={injectType:"singletonStyleTag",attributes:{"data-cke":!0},insert:"head",singleton:!0};a()(c.Z,u);c.Z.locals;class d extends r.View{constructor(e,{colors:t,columns:o,removeButtonLabel:n,documentColorsLabel:l,documentColorsCount:a}){super(e),this.items=this.createCollection(),this.colorDefinitions=t,this.focusTracker=new s.FocusTracker,this.keystrokes=new s.KeystrokeHandler,this.set("selectedColor",void 0),this.removeButtonLabel=n,this.columns=o,this.documentColors=new i,this.documentColorsCount=a,this._focusables=new r.ViewCollection,this._focusCycler=new r.FocusCycler({focusables:this._focusables,focusTracker:this.focusTracker,keystrokeHandler:this.keystrokes,actions:{focusPrevious:"shift + tab",focusNext:"tab"}}),this._documentColorsLabel=l,this.setTemplate({tag:"div",attributes:{class:["ck","ck-color-table"]},children:this.items}),this.items.add(this._createRemoveColorButton())}updateDocumentColors(e,t){const o=e.document,n=this.documentColorsCount;this.documentColors.clear();for(const r of o.getRootNames()){const s=o.getRoot(r),i=e.createRangeIn(s);for(const e of i.getItems())if(e.is("$textProxy")&&e.hasAttribute(t)&&(this._addColorToDocumentColors(e.getAttribute(t)),this.documentColors.length>=n))return}}updateSelectedColors(){const e=this.documentColorsGrid,t=this.staticColorsGrid,o=this.selectedColor;t.selectedColor=o,e&&(e.selectedColor=o)}render(){super.render(),this.keystrokes.listenTo(this.element)}destroy(){super.destroy(),this.focusTracker.destroy(),this.keystrokes.destroy()}appendGrids(){if(!this.staticColorsGrid&&(this.staticColorsGrid=this._createStaticColorsGrid(),this.items.add(this.staticColorsGrid),this.focusTracker.add(this.staticColorsGrid.element),this._focusables.add(this.staticColorsGrid),this.documentColorsCount)){const e=r.Template.bind(this.documentColors,this.documentColors),t=new r.LabelView(this.locale);t.text=this._documentColorsLabel,t.extendTemplate({attributes:{class:["ck","ck-color-grid__label",e.if("isEmpty","ck-hidden")]}}),this.items.add(t),this.documentColorsGrid=this._createDocumentColorsGrid(),this.items.add(this.documentColorsGrid),this.focusTracker.add(this.documentColorsGrid.element),this._focusables.add(this.documentColorsGrid)}}focus(){this._focusCycler.focusFirst()}focusLast(){this._focusCycler.focusLast()}_createRemoveColorButton(){const t=new r.ButtonView;return t.set({withText:!0,icon:e.icons.eraser,label:this.removeButtonLabel}),t.class="ck-color-table__remove-color",t.on("execute",(()=>{this.fire("execute",{value:null})})),t.render(),this.focusTracker.add(t.element),this._focusables.add(t),t}_createStaticColorsGrid(){const e=new r.ColorGridView(this.locale,{colorDefinitions:this.colorDefinitions,columns:this.columns});return e.delegate("execute").to(this),e}_createDocumentColorsGrid(){const e=r.Template.bind(this.documentColors,this.documentColors),t=new r.ColorGridView(this.locale,{columns:this.columns});return t.delegate("execute").to(this),t.extendTemplate({attributes:{class:e.if("isEmpty","ck-hidden")}}),t.items.bindTo(this.documentColors).using((e=>{const t=new r.ColorTileView;return t.set({color:e.color,hasBorder:e.options&&e.options.hasBorder}),e.label&&t.set({label:e.label,tooltip:!0}),t.on("execute",(()=>{this.fire("execute",{value:e.color})})),t})),this.documentColors.on("change:isEmpty",((e,o,n)=>{n&&(t.selectedColor=null)})),t}_addColorToDocumentColors(e){const t=this.colorDefinitions.find((t=>t.color===e));t?this.documentColors.add(Object.assign({},t)):this.documentColors.add({color:e,label:e,options:{hasBorder:!1}})}}const m="fontSize",h="fontFamily",p="fontColor",f="fontBackgroundColor";function g(e,t){const o={model:{key:e,values:[]},view:{},upcastAlso:{}};for(const e of t)o.model.values.push(e.model),o.view[e.model]=e.view,e.upcastAlso&&(o.upcastAlso[e.model]=e.upcastAlso);return o}function b(e){return t=>t.getStyle(e).replace(/\s/g,"")}function v(e){return(t,{writer:o})=>o.createAttributeElement("span",{style:`${e}:${t}`},{priority:7})}class w extends t{constructor(e){super(e,h)}}function y(e){return e.map(C).filter((e=>void 0!==e))}function C(e){return"object"==typeof e?e:"default"===e?{title:"Default",model:void 0}:"string"==typeof e?function(e){const t=e.replace(/"|'/g,"").split(","),o=t[0],n=t.map(x).join(", ");return{title:o,model:n,view:{name:"span",styles:{"font-family":n},priority:7}}}(e):void 0}function x(e){return(e=e.trim()).indexOf(" ")>0&&(e=`'${e}'`),e}class k extends e.Plugin{static get pluginName(){return"FontFamilyEditing"}constructor(e){super(e),e.config.define(h,{options:["default","Arial, Helvetica, sans-serif","Courier New, Courier, monospace","Georgia, serif","Lucida Sans Unicode, Lucida Grande, sans-serif","Tahoma, Geneva, sans-serif","Times New Roman, Times, serif","Trebuchet MS, Helvetica, sans-serif","Verdana, Geneva, sans-serif"],supportAllValues:!1})}init(){const e=this.editor;e.model.schema.extend("$text",{allowAttributes:h}),e.model.schema.setAttributeProperties(h,{isFormatting:!0,copyOnEnter:!0});const t=y(e.config.get("fontFamily.options")).filter((e=>e.model)),o=g(h,t);e.config.get("fontFamily.supportAllValues")?(this._prepareAnyValueConverters(),this._prepareCompatibilityConverter()):e.conversion.attributeToElement(o),e.commands.add(h,new w(e))}_prepareAnyValueConverters(){const e=this.editor;e.conversion.for("downcast").attributeToElement({model:h,view:(e,{writer:t})=>t.createAttributeElement("span",{style:"font-family:"+e},{priority:7})}),e.conversion.for("upcast").elementToAttribute({model:{key:h,value:e=>e.getStyle("font-family")},view:{name:"span",styles:{"font-family":/.*/}}})}_prepareCompatibilityConverter(){this.editor.conversion.for("upcast").elementToAttribute({view:{name:"font",attributes:{face:/.*/}},model:{key:h,value:e=>e.getAttribute("face")}})}}class T extends e.Plugin{static get pluginName(){return"FontFamilyUI"}init(){const e=this.editor,t=e.t,o=this._getLocalizedOptions(),n=e.commands.get(h);e.ui.componentFactory.add(h,(i=>{const l=(0,r.createDropdown)(i);return(0,r.addListToDropdown)(l,(()=>function(e,t){const o=new s.Collection;for(const n of e){const e={type:"button",model:new r.Model({commandName:h,commandParam:n.model,label:n.title,withText:!0})};e.model.bind("isOn").to(t,"value",(e=>e===n.model||!(!e||!n.model)&&e.split(",")[0].replace(/'/g,"").toLowerCase()===n.model.toLowerCase())),n.view&&"string"!=typeof n.view&&n.view.styles&&e.model.set("labelStyle",`font-family: ${n.view.styles["font-family"]}`),o.add(e)}return o}(o,n))),l.buttonView.set({label:t("Font Family"),icon:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M11.03 3h6.149a.75.75 0 1 1 0 1.5h-5.514L11.03 3zm1.27 3h4.879a.75.75 0 1 1 0 1.5h-4.244L12.3 6zm1.27 3h3.609a.75.75 0 1 1 0 1.5h-2.973L13.57 9zm-2.754 2.5L8.038 4.785 5.261 11.5h5.555zm.62 1.5H4.641l-1.666 4.028H1.312l5.789-14h1.875l5.789 14h-1.663L11.436 13z"/></svg>',tooltip:!0}),l.extendTemplate({attributes:{class:"ck-font-family-dropdown"}}),l.bind("isEnabled").to(n),this.listenTo(l,"execute",(t=>{e.execute(t.source.commandName,{value:t.source.commandParam}),e.editing.view.focus()})),l}))}_getLocalizedOptions(){const e=this.editor,t=e.t;return y(e.config.get(h).options).map((e=>("Default"===e.title&&(e.title=t("Default")),e)))}}class F extends e.Plugin{static get requires(){return[k,T]}static get pluginName(){return"FontFamily"}}var S=o(492);class L extends t{constructor(e){super(e,m)}}function A(e){return e.map((e=>function(e){"number"==typeof e&&(e=String(e));if("object"==typeof e&&(t=e,t.title&&t.model&&t.view))return z(e);var t;const o=function(e){return"string"==typeof e?_[e]:_[e.model]}(e);if(o)return z(o);if("default"===e)return{model:void 0,title:"Default"};if(function(e){let t;if("object"==typeof e){if(!e.model)throw new s.CKEditorError("font-size-invalid-definition",null,e);t=parseFloat(e.model)}else t=parseFloat(e);return isNaN(t)}(e))return;return function(e){"string"==typeof e&&(e={title:e,model:`${parseFloat(e)}px`});return e.view={name:"span",styles:{"font-size":e.model}},z(e)}(e)}(e))).filter((e=>void 0!==e))}const _={get tiny(){return{title:"Tiny",model:"tiny",view:{name:"span",classes:"text-tiny",priority:7}}},get small(){return{title:"Small",model:"small",view:{name:"span",classes:"text-small",priority:7}}},get big(){return{title:"Big",model:"big",view:{name:"span",classes:"text-big",priority:7}}},get huge(){return{title:"Huge",model:"huge",view:{name:"span",classes:"text-huge",priority:7}}}};function z(e){return e.view&&"string"!=typeof e.view&&!e.view.priority&&(e.view.priority=7),e}const N=["x-small","x-small","small","medium","large","x-large","xx-large","xxx-large"];class E extends e.Plugin{static get pluginName(){return"FontSizeEditing"}constructor(e){super(e),e.config.define(m,{options:["tiny","small","default","big","huge"],supportAllValues:!1})}init(){const e=this.editor;e.model.schema.extend("$text",{allowAttributes:m}),e.model.schema.setAttributeProperties(m,{isFormatting:!0,copyOnEnter:!0});const t=e.config.get("fontSize.supportAllValues"),o=A(this.editor.config.get("fontSize.options")).filter((e=>e.model)),n=g(m,o);t?(this._prepareAnyValueConverters(n),this._prepareCompatibilityConverter()):e.conversion.attributeToElement(n),e.commands.add(m,new L(e))}_prepareAnyValueConverters(e){const t=this.editor,o=e.model.values.filter((e=>!(0,S.isLength)(String(e))&&!(0,S.isPercentage)(String(e))));if(o.length)throw new s.CKEditorError("font-size-invalid-use-of-named-presets",null,{presets:o});t.conversion.for("downcast").attributeToElement({model:m,view:(e,{writer:t})=>{if(e)return t.createAttributeElement("span",{style:"font-size:"+e},{priority:7})}}),t.conversion.for("upcast").elementToAttribute({model:{key:m,value:e=>e.getStyle("font-size")},view:{name:"span",styles:{"font-size":/.*/}}})}_prepareCompatibilityConverter(){this.editor.conversion.for("upcast").elementToAttribute({view:{name:"font",attributes:{size:/^[+-]?\d{1,3}$/}},model:{key:m,value:e=>{const t=e.getAttribute("size"),o="-"===t[0]||"+"===t[0];let n=parseInt(t,10);o&&(n=3+n);const r=N.length-1,s=Math.min(Math.max(n,0),r);return N[s]}}})}}var B=o(222),O={injectType:"singletonStyleTag",attributes:{"data-cke":!0},insert:"head",singleton:!0};a()(B.Z,O);B.Z.locals;class V extends e.Plugin{static get pluginName(){return"FontSizeUI"}init(){const e=this.editor,t=e.t,o=this._getLocalizedOptions(),n=e.commands.get(m);e.ui.componentFactory.add(m,(i=>{const l=(0,r.createDropdown)(i);return(0,r.addListToDropdown)(l,(()=>function(e,t){const o=new s.Collection;for(const n of e){const e={type:"button",model:new r.Model({commandName:m,commandParam:n.model,label:n.title,class:"ck-fontsize-option",withText:!0})};n.view&&"string"!=typeof n.view&&(n.view.styles&&e.model.set("labelStyle",`font-size:${n.view.styles["font-size"]}`),n.view.classes&&e.model.set("class",`${e.model.class} ${n.view.classes}`)),e.model.bind("isOn").to(t,"value",(e=>e===n.model)),o.add(e)}return o}(o,n))),l.buttonView.set({label:t("Font Size"),icon:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M9.816 11.5 7.038 4.785 4.261 11.5h5.555zm.62 1.5H3.641l-1.666 4.028H.312l5.789-14h1.875l5.789 14h-1.663L10.436 13zm7.55 2.279.779-.779.707.707-2.265 2.265-2.193-2.265.707-.707.765.765V4.825c0-.042 0-.083.002-.123l-.77.77-.707-.707L17.207 2.5l2.265 2.265-.707.707-.782-.782c.002.043.003.089.003.135v10.454z"/></svg>',tooltip:!0}),l.extendTemplate({attributes:{class:["ck-font-size-dropdown"]}}),l.bind("isEnabled").to(n),this.listenTo(l,"execute",(t=>{e.execute(t.source.commandName,{value:t.source.commandParam}),e.editing.view.focus()})),l}))}_getLocalizedOptions(){const e=this.editor,t=e.t,o={Default:t("Default"),Tiny:t("Tiny"),Small:t("Small"),Big:t("Big"),Huge:t("Huge")};return A(e.config.get(m).options).map((e=>{const t=o[e.title];return t&&t!=e.title&&(e=Object.assign({},e,{title:t})),e}))}}class D extends e.Plugin{static get requires(){return[E,V]}static get pluginName(){return"FontSize"}normalizeSizeOptions(e){return A(e)}}class P extends t{constructor(e){super(e,p)}}class G extends e.Plugin{static get pluginName(){return"FontColorEditing"}constructor(e){super(e),e.config.define(p,{colors:[{color:"hsl(0, 0%, 0%)",label:"Black"},{color:"hsl(0, 0%, 30%)",label:"Dim grey"},{color:"hsl(0, 0%, 60%)",label:"Grey"},{color:"hsl(0, 0%, 90%)",label:"Light grey"},{color:"hsl(0, 0%, 100%)",label:"White",hasBorder:!0},{color:"hsl(0, 75%, 60%)",label:"Red"},{color:"hsl(30, 75%, 60%)",label:"Orange"},{color:"hsl(60, 75%, 60%)",label:"Yellow"},{color:"hsl(90, 75%, 60%)",label:"Light green"},{color:"hsl(120, 75%, 60%)",label:"Green"},{color:"hsl(150, 75%, 60%)",label:"Aquamarine"},{color:"hsl(180, 75%, 60%)",label:"Turquoise"},{color:"hsl(210, 75%, 60%)",label:"Light blue"},{color:"hsl(240, 75%, 60%)",label:"Blue"},{color:"hsl(270, 75%, 60%)",label:"Purple"}],columns:5}),e.conversion.for("upcast").elementToAttribute({view:{name:"span",styles:{color:/[\s\S]+/}},model:{key:p,value:b("color")}}),e.conversion.for("upcast").elementToAttribute({view:{name:"font",attributes:{color:/^#?\w+$/}},model:{key:p,value:e=>e.getAttribute("color")}}),e.conversion.for("downcast").attributeToElement({model:p,view:v("color")}),e.commands.add(p,new P(e)),e.model.schema.extend("$text",{allowAttributes:p}),e.model.schema.setAttributeProperties(p,{isFormatting:!0,copyOnEnter:!0})}}class j extends e.Plugin{constructor(e,{commandName:t,componentName:o,icon:n,dropdownLabel:r}){super(e),this.commandName=t,this.componentName=o,this.icon=n,this.dropdownLabel=r,this.columns=e.config.get(`${this.componentName}.columns`),this.colorTableView=void 0}init(){const e=this.editor,t=e.locale,o=t.t,n=e.commands.get(this.commandName),s=(0,r.normalizeColorOptions)(e.config.get(this.componentName).colors),i=(0,r.getLocalizedColorOptions)(t,s),l=e.config.get(`${this.componentName}.documentColors`);e.ui.componentFactory.add(this.componentName,(t=>{const s=(0,r.createDropdown)(t);return this.colorTableView=function({dropdownView:e,colors:t,columns:o,removeButtonLabel:n,documentColorsLabel:r,documentColorsCount:s}){const i=e.locale,l=new d(i,{colors:t,columns:o,removeButtonLabel:n,documentColorsLabel:r,documentColorsCount:s});return e.colorTableView=l,e.panelView.children.add(l),l.delegate("execute").to(e,"execute"),l}({dropdownView:s,colors:i.map((e=>({label:e.label,color:e.model,options:{hasBorder:e.hasBorder}}))),columns:this.columns,removeButtonLabel:o("Remove color"),documentColorsLabel:0!==l?o("Document colors"):"",documentColorsCount:void 0===l?this.columns:l}),this.colorTableView.bind("selectedColor").to(n,"value"),s.buttonView.set({label:this.dropdownLabel,icon:this.icon,tooltip:!0}),s.extendTemplate({attributes:{class:"ck-color-ui-dropdown"}}),s.bind("isEnabled").to(n),s.on("execute",((t,o)=>{e.execute(this.commandName,o),e.editing.view.focus()})),s.on("change:isOpen",((t,o,n)=>{s.colorTableView.appendGrids(),n&&(0!==l&&this.colorTableView.updateDocumentColors(e.model,this.componentName),this.colorTableView.updateSelectedColors())})),(0,r.focusChildOnDropdownOpen)(s,(()=>s.colorTableView.staticColorsGrid.items.find((e=>e.isOn)))),s}))}}class H extends j{constructor(e){const t=e.locale.t;super(e,{commandName:p,componentName:p,icon:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12.4 10.3 10 4.5l-2.4 5.8h4.8zm.5 1.2H7.1L5.7 15H4.2l5-12h1.6l5 12h-1.5L13 11.5zm3.1 7H4a1 1 0 0 1 0-2h12a1 1 0 0 1 0 2z"/></svg>',dropdownLabel:t("Font Color")})}static get pluginName(){return"FontColorUI"}}class M extends e.Plugin{static get requires(){return[G,H]}static get pluginName(){return"FontColor"}}class I extends t{constructor(e){super(e,f)}}class R extends e.Plugin{static get pluginName(){return"FontBackgroundColorEditing"}constructor(e){super(e),e.config.define(f,{colors:[{color:"hsl(0, 0%, 0%)",label:"Black"},{color:"hsl(0, 0%, 30%)",label:"Dim grey"},{color:"hsl(0, 0%, 60%)",label:"Grey"},{color:"hsl(0, 0%, 90%)",label:"Light grey"},{color:"hsl(0, 0%, 100%)",label:"White",hasBorder:!0},{color:"hsl(0, 75%, 60%)",label:"Red"},{color:"hsl(30, 75%, 60%)",label:"Orange"},{color:"hsl(60, 75%, 60%)",label:"Yellow"},{color:"hsl(90, 75%, 60%)",label:"Light green"},{color:"hsl(120, 75%, 60%)",label:"Green"},{color:"hsl(150, 75%, 60%)",label:"Aquamarine"},{color:"hsl(180, 75%, 60%)",label:"Turquoise"},{color:"hsl(210, 75%, 60%)",label:"Light blue"},{color:"hsl(240, 75%, 60%)",label:"Blue"},{color:"hsl(270, 75%, 60%)",label:"Purple"}],columns:5}),e.data.addStyleProcessorRules(S.addBackgroundRules),e.conversion.for("upcast").elementToAttribute({view:{name:"span",styles:{"background-color":/[\s\S]+/}},model:{key:f,value:b("background-color")}}),e.conversion.for("downcast").attributeToElement({model:f,view:v("background-color")}),e.commands.add(f,new I(e)),e.model.schema.extend("$text",{allowAttributes:f}),e.model.schema.setAttributeProperties(f,{isFormatting:!0,copyOnEnter:!0})}}class $ extends j{constructor(e){const t=e.locale.t;super(e,{commandName:f,componentName:f,icon:'<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M4 2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2zm8.38 9.262H7.62L10 5.506l2.38 5.756zm.532 1.285L14.34 16h1.426L10.804 4H9.196L4.234 16H5.66l1.428-3.453h5.824z"/></svg>',dropdownLabel:t("Font Background Color")})}static get pluginName(){return"FontBackgroundColorUI"}}class K extends e.Plugin{static get requires(){return[R,$]}static get pluginName(){return"FontBackgroundColor"}}class U extends e.Plugin{static get requires(){return[F,D,M,K]}static get pluginName(){return"Font"}}})(),(window.CKEditor5=window.CKEditor5||{}).font=n})();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ckeditor/ckeditor5-font",
3
- "version": "36.0.1",
3
+ "version": "37.0.0-alpha.1",
4
4
  "description": "Font feature for CKEditor 5.",
5
5
  "keywords": [
6
6
  "ckeditor",
@@ -12,19 +12,20 @@
12
12
  ],
13
13
  "main": "src/index.js",
14
14
  "dependencies": {
15
- "ckeditor5": "^36.0.1"
15
+ "ckeditor5": "^37.0.0-alpha.1"
16
16
  },
17
17
  "devDependencies": {
18
- "@ckeditor/ckeditor5-core": "^36.0.1",
19
- "@ckeditor/ckeditor5-dev-utils": "^32.0.0",
20
- "@ckeditor/ckeditor5-editor-classic": "^36.0.1",
21
- "@ckeditor/ckeditor5-engine": "^36.0.1",
22
- "@ckeditor/ckeditor5-highlight": "^36.0.1",
23
- "@ckeditor/ckeditor5-paragraph": "^36.0.1",
24
- "@ckeditor/ckeditor5-table": "^36.0.1",
25
- "@ckeditor/ckeditor5-theme-lark": "^36.0.1",
26
- "@ckeditor/ckeditor5-ui": "^36.0.1",
27
- "@ckeditor/ckeditor5-utils": "^36.0.1",
18
+ "@ckeditor/ckeditor5-core": "^37.0.0-alpha.1",
19
+ "@ckeditor/ckeditor5-dev-utils": "^35.0.0",
20
+ "@ckeditor/ckeditor5-editor-classic": "^37.0.0-alpha.1",
21
+ "@ckeditor/ckeditor5-engine": "^37.0.0-alpha.1",
22
+ "@ckeditor/ckeditor5-highlight": "^37.0.0-alpha.1",
23
+ "@ckeditor/ckeditor5-paragraph": "^37.0.0-alpha.1",
24
+ "@ckeditor/ckeditor5-table": "^37.0.0-alpha.1",
25
+ "@ckeditor/ckeditor5-theme-lark": "^37.0.0-alpha.1",
26
+ "@ckeditor/ckeditor5-ui": "^37.0.0-alpha.1",
27
+ "@ckeditor/ckeditor5-utils": "^37.0.0-alpha.1",
28
+ "typescript": "^4.8.4",
28
29
  "webpack": "^5.58.1",
29
30
  "webpack-cli": "^4.9.0"
30
31
  },
@@ -43,13 +44,17 @@
43
44
  },
44
45
  "files": [
45
46
  "lang",
46
- "src",
47
+ "src/**/*.js",
48
+ "src/**/*.d.ts",
47
49
  "theme",
48
50
  "build",
49
51
  "ckeditor5-metadata.json",
50
52
  "CHANGELOG.md"
51
53
  ],
52
54
  "scripts": {
53
- "dll:build": "webpack"
54
- }
55
+ "dll:build": "webpack",
56
+ "build": "tsc -p ./tsconfig.json",
57
+ "postversion": "npm run build"
58
+ },
59
+ "types": "src/index.d.ts"
55
60
  }
@@ -0,0 +1,58 @@
1
+ /**
2
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+ import type { Font, FontBackgroundColor, FontBackgroundColorEditing, FontBackgroundColorUI, FontBackgroundColorCommand, FontColor, FontColorEditing, FontColorUI, FontColorCommand, FontColorConfig, FontFamily, FontFamilyEditing, FontFamilyUI, FontFamilyCommand, FontFamilyConfig, FontSize, FontSizeEditing, FontSizeUI, FontSizeCommand, FontSizeConfig, FONT_BACKGROUND_COLOR, FONT_COLOR, FONT_FAMILY, FONT_SIZE } from './index';
6
+ declare module '@ckeditor/ckeditor5-core' {
7
+ interface EditorConfig {
8
+ /**
9
+ * The configuration of the font background color feature.
10
+ * It is introduced by the {@link module:font/fontbackgroundcolor/fontbackgroundcolorediting~FontBackgroundColorEditing} feature.
11
+ *
12
+ * Read more in {@link module:font/fontconfig~FontColorConfig}.
13
+ */
14
+ fontBackgroundColor?: FontColorConfig;
15
+ /**
16
+ * The configuration of the font color feature.
17
+ * It is introduced by the {@link module:font/fontcolor/fontcolorediting~FontColorEditing} feature.
18
+ *
19
+ * Read more in {@link module:font/fontconfig~FontColorConfig}.
20
+ */
21
+ fontColor?: FontColorConfig;
22
+ /**
23
+ * The configuration of the font family feature.
24
+ * It is introduced by the {@link module:font/fontfamily/fontfamilyediting~FontFamilyEditing} feature.
25
+ *
26
+ * Read more in {@link module:font/fontconfig~FontFamilyConfig}.
27
+ */
28
+ fontFamily?: FontFamilyConfig;
29
+ /**
30
+ * The configuration of the font size feature.
31
+ * It is introduced by the {@link module:font/fontsize/fontsizeediting~FontSizeEditing} feature.
32
+ *
33
+ * Read more in {@link module:font/fontconfig~FontSizeConfig}.
34
+ */
35
+ fontSize?: FontSizeConfig;
36
+ }
37
+ interface PluginsMap {
38
+ [Font.pluginName]: Font;
39
+ [FontBackgroundColor.pluginName]: FontBackgroundColor;
40
+ [FontBackgroundColorEditing.pluginName]: FontBackgroundColorEditing;
41
+ [FontBackgroundColorUI.pluginName]: FontBackgroundColorUI;
42
+ [FontColor.pluginName]: FontColor;
43
+ [FontColorEditing.pluginName]: FontColorEditing;
44
+ [FontColorUI.pluginName]: FontColorUI;
45
+ [FontFamily.pluginName]: FontFamily;
46
+ [FontFamilyEditing.pluginName]: FontFamilyEditing;
47
+ [FontFamilyUI.pluginName]: FontFamilyUI;
48
+ [FontSize.pluginName]: FontSize;
49
+ [FontSizeEditing.pluginName]: FontSizeEditing;
50
+ [FontSizeUI.pluginName]: FontSizeUI;
51
+ }
52
+ interface CommandsMap {
53
+ [FONT_SIZE]: FontSizeCommand;
54
+ [FONT_FAMILY]: FontFamilyCommand;
55
+ [FONT_COLOR]: FontColorCommand;
56
+ [FONT_BACKGROUND_COLOR]: FontBackgroundColorCommand;
57
+ }
58
+ }
@@ -0,0 +1,5 @@
1
+ /**
2
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+ export {};
@@ -0,0 +1,70 @@
1
+ /**
2
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+ /**
6
+ * @module font/documentcolorcollection
7
+ */
8
+ import type { ColorDefinition } from 'ckeditor5/src/ui';
9
+ import { Collection, type CollectionAddEvent, type CollectionRemoveEvent, type CollectionChangeEvent } from 'ckeditor5/src/utils';
10
+ declare const DocumentColorCollection_base: import("ckeditor5/src/utils").Mixed<{
11
+ new (options?: {
12
+ readonly idProperty?: string | undefined;
13
+ } | undefined): Collection<ColorDefinition>;
14
+ new (initialItems: Iterable<ColorDefinition>, options?: {
15
+ readonly idProperty?: string | undefined;
16
+ } | undefined): Collection<ColorDefinition>;
17
+ }, import("ckeditor5/src/utils").Observable>;
18
+ /**
19
+ * A collection to store document colors. It enforces colors to be unique.
20
+ */
21
+ export default class DocumentColorCollection extends DocumentColorCollection_base {
22
+ /**
23
+ * Indicates whether the document color collection is empty.
24
+ *
25
+ * @observable
26
+ */
27
+ readonly isEmpty: boolean;
28
+ constructor(options?: any);
29
+ /**
30
+ * Adds a color to the document color collection.
31
+ *
32
+ * This method ensures that no color duplicates are inserted (compared using
33
+ * the color value of the {@link module:ui/colorgrid/colorgridview~ColorDefinition}).
34
+ *
35
+ * If the item does not have an ID, it will be automatically generated and set on the item.
36
+ *
37
+ * @param index The position of the item in the collection. The item is pushed to the collection when `index` is not specified.
38
+ * @fires add
39
+ * @fires change
40
+ */
41
+ add(item: ColorDefinition, index?: number): this;
42
+ /**
43
+ * Checks if an object with given colors is present in the document color collection.
44
+ */
45
+ hasColor(color: string): boolean;
46
+ }
47
+ /**
48
+ * Fired when the collection was changed due to adding or removing items.
49
+ *
50
+ * @eventName ~DocumentColorCollection#change
51
+ * @param data Changed items.
52
+ */
53
+ export type DocumentColorCollectionChangeEvent = CollectionChangeEvent;
54
+ /**
55
+ * Fired when an item is added to the collection.
56
+ *
57
+ * @eventName ~DocumentColorCollection#add
58
+ * @param item The added item.
59
+ * @param index An index where the addition occurred.
60
+ */
61
+ export type DocumentColorCollectionAddEvent = CollectionAddEvent;
62
+ /**
63
+ * Fired when an item is removed from the collection.
64
+ *
65
+ * @eventName ~DocumentColorCollection#remove
66
+ * @param item The removed item.
67
+ * @param index Index from which item was removed.
68
+ */
69
+ export type DocumentColorCollectionRemoveEvent = CollectionRemoveEvent;
70
+ export {};
@@ -2,70 +2,41 @@
2
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 font/documentcolorcollection
8
- */
9
-
10
- import { Collection, ObservableMixin, mix } from 'ckeditor5/src/utils';
11
-
5
+ import { Collection, ObservableMixin } from 'ckeditor5/src/utils';
12
6
  /**
13
7
  * A collection to store document colors. It enforces colors to be unique.
14
- *
15
- * @mixes module:utils/observablemixin~ObservableMixin
16
- * @extends module:utils/collection~Collection
17
8
  */
18
- export default class DocumentColorCollection extends Collection {
19
- constructor( options ) {
20
- super( options );
21
-
22
- /**
23
- * Indicates whether the document color collection is empty.
24
- *
25
- * @observable
26
- * @readonly
27
- * @member {Boolean} #isEmpty
28
- */
29
- this.set( 'isEmpty', true );
30
-
31
- this.on( 'change', () => {
32
- this.set( 'isEmpty', this.length === 0 );
33
- } );
34
- }
35
-
36
- /**
37
- * Adds a color to the document color collection.
38
- *
39
- * This method ensures that no color duplicates are inserted (compared using
40
- * the color value of the {@link module:ui/colorgrid/colorgrid~ColorDefinition}).
41
- *
42
- * If the item does not have an ID, it will be automatically generated and set on the item.
43
- *
44
- * @chainable
45
- * @param {module:ui/colorgrid/colorgrid~ColorDefinition} item
46
- * @param {Number} [index] The position of the item in the collection. The item
47
- * is pushed to the collection when `index` is not specified.
48
- * @fires add
49
- * @fires change
50
- */
51
- add( item, index ) {
52
- if ( this.find( element => element.color === item.color ) ) {
53
- // No duplicates are allowed.
54
- return;
55
- }
56
-
57
- super.add( item, index );
58
- }
59
-
60
- /**
61
- * Checks if an object with given colors is present in the document color collection.
62
- *
63
- * @param {String} color
64
- * @returns {Boolean}
65
- */
66
- hasColor( color ) {
67
- return !!this.find( item => item.color === color );
68
- }
9
+ export default class DocumentColorCollection extends ObservableMixin((Collection)) {
10
+ constructor(options) {
11
+ super(options);
12
+ this.set('isEmpty', true);
13
+ this.on('change', () => {
14
+ this.set('isEmpty', this.length === 0);
15
+ });
16
+ }
17
+ /**
18
+ * Adds a color to the document color collection.
19
+ *
20
+ * This method ensures that no color duplicates are inserted (compared using
21
+ * the color value of the {@link module:ui/colorgrid/colorgridview~ColorDefinition}).
22
+ *
23
+ * If the item does not have an ID, it will be automatically generated and set on the item.
24
+ *
25
+ * @param index The position of the item in the collection. The item is pushed to the collection when `index` is not specified.
26
+ * @fires add
27
+ * @fires change
28
+ */
29
+ add(item, index) {
30
+ if (this.find(element => element.color === item.color)) {
31
+ // No duplicates are allowed.
32
+ return this;
33
+ }
34
+ return super.add(item, index);
35
+ }
36
+ /**
37
+ * Checks if an object with given colors is present in the document color collection.
38
+ */
39
+ hasColor(color) {
40
+ return !!this.find(item => item.color === color);
41
+ }
69
42
  }
70
-
71
- mix( DocumentColorCollection, ObservableMixin );
package/src/font.d.ts ADDED
@@ -0,0 +1,29 @@
1
+ /**
2
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+ /**
6
+ * @module font/font
7
+ */
8
+ import { Plugin, type PluginDependencies } from 'ckeditor5/src/core';
9
+ /**
10
+ * A plugin that enables a set of text styling features:
11
+ *
12
+ * * {@link module:font/fontsize~FontSize},
13
+ * * {@link module:font/fontfamily~FontFamily}.
14
+ * * {@link module:font/fontcolor~FontColor},
15
+ * * {@link module:font/fontbackgroundcolor~FontBackgroundColor}.
16
+ *
17
+ * For a detailed overview, check the {@glink features/font Font feature} documentation
18
+ * and the {@glink api/font package page}.
19
+ */
20
+ export default class Font extends Plugin {
21
+ /**
22
+ * @inheritDoc
23
+ */
24
+ static get requires(): PluginDependencies;
25
+ /**
26
+ * @inheritDoc
27
+ */
28
+ static get pluginName(): 'Font';
29
+ }
package/src/font.js CHANGED
@@ -2,18 +2,14 @@
2
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 font/font
8
7
  */
9
-
10
8
  import { Plugin } from 'ckeditor5/src/core';
11
-
12
9
  import FontFamily from './fontfamily';
13
10
  import FontSize from './fontsize';
14
11
  import FontColor from './fontcolor';
15
12
  import FontBackgroundColor from './fontbackgroundcolor';
16
-
17
13
  /**
18
14
  * A plugin that enables a set of text styling features:
19
15
  *
@@ -24,21 +20,18 @@ import FontBackgroundColor from './fontbackgroundcolor';
24
20
  *
25
21
  * For a detailed overview, check the {@glink features/font Font feature} documentation
26
22
  * and the {@glink api/font package page}.
27
- *
28
- * @extends module:core/plugin~Plugin
29
23
  */
30
24
  export default class Font extends Plugin {
31
- /**
32
- * @inheritDoc
33
- */
34
- static get requires() {
35
- return [ FontFamily, FontSize, FontColor, FontBackgroundColor ];
36
- }
37
-
38
- /**
39
- * @inheritDoc
40
- */
41
- static get pluginName() {
42
- return 'Font';
43
- }
25
+ /**
26
+ * @inheritDoc
27
+ */
28
+ static get requires() {
29
+ return [FontFamily, FontSize, FontColor, FontBackgroundColor];
30
+ }
31
+ /**
32
+ * @inheritDoc
33
+ */
34
+ static get pluginName() {
35
+ return 'Font';
36
+ }
44
37
  }
@@ -0,0 +1,26 @@
1
+ /**
2
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+ /**
6
+ * @module font/fontbackgroundcolor/fontbackgroundcolorcommand
7
+ */
8
+ import type { Editor } from 'ckeditor5/src/core';
9
+ import FontCommand from '../fontcommand';
10
+ /**
11
+ * The font background color command. It is used by
12
+ * {@link module:font/fontbackgroundcolor/fontbackgroundcolorediting~FontBackgroundColorEditing}
13
+ * to apply the font background color.
14
+ *
15
+ * ```ts
16
+ * editor.execute( 'fontBackgroundColor', { value: 'rgb(250, 20, 20)' } );
17
+ * ```
18
+ *
19
+ * **Note**: Executing the command with the `null` value removes the attribute from the model.
20
+ */
21
+ export default class FontBackgroundColorCommand extends FontCommand {
22
+ /**
23
+ * @inheritDoc
24
+ */
25
+ constructor(editor: Editor);
26
+ }
@@ -2,30 +2,24 @@
2
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 font/fontbackgroundcolor/fontbackgroundcolorcommand
8
- */
9
-
10
5
  import FontCommand from '../fontcommand';
11
6
  import { FONT_BACKGROUND_COLOR } from '../utils';
12
-
13
7
  /**
14
8
  * The font background color command. It is used by
15
9
  * {@link module:font/fontbackgroundcolor/fontbackgroundcolorediting~FontBackgroundColorEditing}
16
10
  * to apply the font background color.
17
11
  *
18
- * editor.execute( 'fontBackgroundColor', { value: 'rgb(250, 20, 20)' } );
12
+ * ```ts
13
+ * editor.execute( 'fontBackgroundColor', { value: 'rgb(250, 20, 20)' } );
14
+ * ```
19
15
  *
20
16
  * **Note**: Executing the command with the `null` value removes the attribute from the model.
21
- *
22
- * @extends module:font/fontcommand~FontCommand
23
17
  */
24
18
  export default class FontBackgroundColorCommand extends FontCommand {
25
- /**
26
- * @inheritDoc
27
- */
28
- constructor( editor ) {
29
- super( editor, FONT_BACKGROUND_COLOR );
30
- }
19
+ /**
20
+ * @inheritDoc
21
+ */
22
+ constructor(editor) {
23
+ super(editor, FONT_BACKGROUND_COLOR);
24
+ }
31
25
  }
@@ -0,0 +1,26 @@
1
+ /**
2
+ * @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
3
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
4
+ */
5
+ /**
6
+ * @module font/fontbackgroundcolor/fontbackgroundcolorediting
7
+ */
8
+ import { Plugin, type Editor } from 'ckeditor5/src/core';
9
+ /**
10
+ * The font background color editing feature.
11
+ *
12
+ * It introduces the {@link module:font/fontbackgroundcolor/fontbackgroundcolorcommand~FontBackgroundColorCommand command} and
13
+ * the `fontBackgroundColor` attribute in the {@link module:engine/model/model~Model model} which renders
14
+ * in the {@link module:engine/view/view view} as a `<span>` element (`<span style="background-color: ...">`),
15
+ * depending on the {@link module:font/fontconfig~FontColorConfig configuration}.
16
+ */
17
+ export default class FontBackgroundColorEditing extends Plugin {
18
+ /**
19
+ * @inheritDoc
20
+ */
21
+ static get pluginName(): 'FontBackgroundColorEditing';
22
+ /**
23
+ * @inheritDoc
24
+ */
25
+ constructor(editor: Editor);
26
+ }