@ckeditor/ckeditor5-vue - npm Package Compare versions

Comparing version 5.0.0-alpha.1 to 5.0.0-alpha.2

dist/ckeditor.d.ts

@@ -36,3 +36,3 @@ /**
     setUpEditorEvents(): void;
-}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "ready" | "destroy" | "blur" | "focus" | "input")[], "update:modelValue" | "ready" | "destroy" | "blur" | "focus" | "input", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     editor: {
@@ -60,3 +60,10 @@ type: PropType<{
     };
-}>>, {
+}>> & {
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+    onReady?: ((...args: any[]) => any) | undefined;
+    onDestroy?: ((...args: any[]) => any) | undefined;
+    onBlur?: ((...args: any[]) => any) | undefined;
+    onFocus?: ((...args: any[]) => any) | undefined;
+    onInput?: ((...args: any[]) => any) | undefined;
+}, {
     modelValue: string;
@@ -63,0 +70,0 @@ disabled: boolean;

dist/ckeditor.js

@@ -5,3 +5,3 @@ /*!
  */
-!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("vue")):"function"==typeof define&&define.amd?define(["vue"],e):"object"==typeof exports?exports.CKEditor=e(require("vue")):t.CKEditor=e(t.Vue)}(self,t=>(()=>{"use strict";var e={976:e=>{e.exports=t}},n={};function o(t){var i=n[t];if(void 0!==i)return i.exports;var r=n[t]={exports:{}};return e[t](r,r.exports,o),r.exports}o.d=(t,e)=>{for(var n in e)o.o(e,n)&&!o.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},o.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e);var i={};return(()=>{o.d(i,{default:()=>R});var t=o(976);const e=function(t){var e=typeof t;return null!=t&&("object"==e||"function"==e)};const n="object"==typeof global&&global&&global.Object===Object&&global;var r="object"==typeof self&&self&&self.Object===Object&&self;const a=n||r||Function("return this")();const s=function(){return a.Date.now()};var c=/\s/;const u=function(t){for(var e=t.length;e--&&c.test(t.charAt(e)););return e};var l=/^\s+/;const d=function(t){return t?t.slice(0,u(t)+1).replace(l,""):t};const f=a.Symbol;var p=Object.prototype,m=p.hasOwnProperty,v=p.toString,h=f?f.toStringTag:void 0;const b=function(t){var e=m.call(t,h),n=t[h];try{t[h]=void 0;var o=!0}catch(t){}var i=v.call(t);return o&&(e?t[h]=n:delete t[h]),i};var y=Object.prototype.toString;const g=function(t){return y.call(t)};var j=f?f.toStringTag:void 0;const O=function(t){return null==t?void 0===t?"[object Undefined]":"[object Null]":j&&j in Object(t)?b(t):g(t)};const w=function(t){return null!=t&&"object"==typeof t};const E=function(t){return"symbol"==typeof t||w(t)&&"[object Symbol]"==O(t)};var x=/^[-+]0x[0-9a-f]+$/i,S=/^0b[01]+$/i,T=/^0o[0-7]+$/i,V=parseInt;const N=function(t){if("number"==typeof t)return t;if(E(t))return NaN;if(e(t)){var n="function"==typeof t.valueOf?t.valueOf():t;t=e(n)?n+"":n}if("string"!=typeof t)return 0===t?t:+t;t=d(t);var o=S.test(t);return o||T.test(t)?V(t.slice(2),o?2:8):x.test(t)?NaN:+t};var $=Math.max,C=Math.min;const D=function(t,n,o){var i,r,a,c,u,l,d=0,f=!1,p=!1,m=!0;if("function"!=typeof t)throw new TypeError("Expected a function");function v(e){var n=i,o=r;return i=r=void 0,d=e,c=t.apply(o,n)}function h(t){return d=t,u=setTimeout(y,n),f?v(t):c}function b(t){var e=t-l;return void 0===l||e>=n||e<0||p&&t-d>=a}function y(){var t=s();if(b(t))return g(t);u=setTimeout(y,function(t){var e=n-(t-l);return p?C(e,a-(t-d)):e}(t))}function g(t){return u=void 0,m&&i?v(t):(i=r=void 0,c)}function j(){var t=s(),e=b(t);if(i=arguments,r=this,l=t,e){if(void 0===u)return h(l);if(p)return clearTimeout(u),u=setTimeout(y,n),v(l)}return void 0===u&&(u=setTimeout(y,n)),c}return n=N(n)||0,e(o)&&(f=!!o.leading,a=(p="maxWait"in o)?$(N(o.maxWait)||0,n):a,m="trailing"in o?!!o.trailing:m),j.cancel=function(){void 0!==u&&clearTimeout(u),d=0,i=l=r=u=void 0},j.flush=function(){return void 0===u?c:g(s())},j},I=(0,t.defineComponent)({name:"ckeditor",created(){const{CKEDITOR_VERSION:t}=window;if(t){const[e]=t.split(".").map(Number);e<34&&console.warn("The <CKEditor> component requires using CKEditor 5 in version 34 or higher.")}else console.warn('Cannot find the "CKEDITOR_VERSION" in the "window" scope.')},render(){return(0,t.h)(this.tagName)},model:{prop:"modelValue",event:"update:modelValue"},props:{editor:{type:Function,required:!0},config:{type:Object,default:()=>({})},modelValue:{type:String,default:""},tagName:{type:String,default:"div"},disabled:{type:Boolean,default:!1}},data:()=>({instance:null,lastEditorData:null}),mounted(){const e=Object.assign({},this.config);this.modelValue&&(e.initialData=this.modelValue),this.editor.create(this.$el,e).then(n=>{this.instance=(0,t.markRaw)(n),this.setUpEditorEvents(),this.modelValue!==e.initialData&&n.data.set(this.modelValue),this.disabled&&n.enableReadOnlyMode("Integration Sample"),this.$emit("ready",n)}).catch(t=>{console.error(t)})},beforeUnmount(){this.instance&&(this.instance.destroy(),this.instance=null),this.$emit("destroy",this.instance)},watch:{modelValue(t){this.instance&&t!==this.lastEditorData&&this.instance.data.set(t)},disabled(t){t?this.instance.enableReadOnlyMode("Integration Sample"):this.instance.disableReadOnlyMode("Integration Sample")}},methods:{setUpEditorEvents(){const t=this.instance,e=D(e=>{const n=this.lastEditorData=t.data.get();this.$emit("update:modelValue",n,e,t),this.$emit("input",n,e,t)},300,{leading:!0});t.model.document.on("change:data",e),t.editing.view.document.on("focus",e=>{this.$emit("focus",e,t)}),t.editing.view.document.on("blur",e=>{this.$emit("blur",e,t)})}}});if(!t.version||!t.version.startsWith("3."))throw new Error("The CKEditor plugin works only with Vue 3+. For more information, please refer to https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/frameworks/vuejs-v3.html");const R={install(t){t.component("ckeditor",I)},component:I}})(),i=i.default})());
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("vue")):"function"==typeof define&&define.amd?define(["vue"],e):"object"==typeof exports?exports.CKEditor=e(require("vue")):t.CKEditor=e(t.Vue)}(self,t=>(()=>{"use strict";var e={976:e=>{e.exports=t}},n={};function o(t){var i=n[t];if(void 0!==i)return i.exports;var r=n[t]={exports:{}};return e[t](r,r.exports,o),r.exports}o.d=(t,e)=>{for(var n in e)o.o(e,n)&&!o.o(t,n)&&Object.defineProperty(t,n,{enumerable:!0,get:e[n]})},o.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e);var i={};return(()=>{o.d(i,{default:()=>R});var t=o(976);const e=function(t){var e=typeof t;return null!=t&&("object"==e||"function"==e)};const n="object"==typeof global&&global&&global.Object===Object&&global;var r="object"==typeof self&&self&&self.Object===Object&&self;const a=n||r||Function("return this")();const s=function(){return a.Date.now()};var u=/\s/;const c=function(t){for(var e=t.length;e--&&u.test(t.charAt(e)););return e};var l=/^\s+/;const d=function(t){return t?t.slice(0,c(t)+1).replace(l,""):t};const f=a.Symbol;var p=Object.prototype,m=p.hasOwnProperty,v=p.toString,h=f?f.toStringTag:void 0;const b=function(t){var e=m.call(t,h),n=t[h];try{t[h]=void 0;var o=!0}catch(t){}var i=v.call(t);return o&&(e?t[h]=n:delete t[h]),i};var y=Object.prototype.toString;const g=function(t){return y.call(t)};var j=f?f.toStringTag:void 0;const O=function(t){return null==t?void 0===t?"[object Undefined]":"[object Null]":j&&j in Object(t)?b(t):g(t)};const w=function(t){return null!=t&&"object"==typeof t};const E=function(t){return"symbol"==typeof t||w(t)&&"[object Symbol]"==O(t)};var x=/^[-+]0x[0-9a-f]+$/i,V=/^0b[01]+$/i,S=/^0o[0-7]+$/i,T=parseInt;const C=function(t){if("number"==typeof t)return t;if(E(t))return NaN;if(e(t)){var n="function"==typeof t.valueOf?t.valueOf():t;t=e(n)?n+"":n}if("string"!=typeof t)return 0===t?t:+t;t=d(t);var o=V.test(t);return o||S.test(t)?T(t.slice(2),o?2:8):x.test(t)?NaN:+t};var N=Math.max,$=Math.min;const D=function(t,n,o){var i,r,a,u,c,l,d=0,f=!1,p=!1,m=!0;if("function"!=typeof t)throw new TypeError("Expected a function");function v(e){var n=i,o=r;return i=r=void 0,d=e,u=t.apply(o,n)}function h(t){return d=t,c=setTimeout(y,n),f?v(t):u}function b(t){var e=t-l;return void 0===l||e>=n||e<0||p&&t-d>=a}function y(){var t=s();if(b(t))return g(t);c=setTimeout(y,function(t){var e=n-(t-l);return p?$(e,a-(t-d)):e}(t))}function g(t){return c=void 0,m&&i?v(t):(i=r=void 0,u)}function j(){var t=s(),e=b(t);if(i=arguments,r=this,l=t,e){if(void 0===c)return h(l);if(p)return clearTimeout(c),c=setTimeout(y,n),v(l)}return void 0===c&&(c=setTimeout(y,n)),u}return n=C(n)||0,e(o)&&(f=!!o.leading,a=(p="maxWait"in o)?N(C(o.maxWait)||0,n):a,m="trailing"in o?!!o.trailing:m),j.cancel=function(){void 0!==c&&clearTimeout(c),d=0,i=l=r=c=void 0},j.flush=function(){return void 0===c?u:g(s())},j},I=(0,t.defineComponent)({name:"Ckeditor",model:{prop:"modelValue",event:"update:modelValue"},props:{editor:{type:Function,required:!0},config:{type:Object,default:()=>({})},modelValue:{type:String,default:""},tagName:{type:String,default:"div"},disabled:{type:Boolean,default:!1}},emits:["ready","destroy","blur","focus","input","update:modelValue"],data:()=>({instance:null,lastEditorData:null}),watch:{modelValue(t){this.instance&&t!==this.lastEditorData&&this.instance.data.set(t)},disabled(t){t?this.instance.enableReadOnlyMode("Integration Sample"):this.instance.disableReadOnlyMode("Integration Sample")}},created(){const{CKEDITOR_VERSION:t}=window;if(t){const[e]=t.split(".").map(Number);e<37&&console.warn("The <CKEditor> component requires using CKEditor 5 in version 37 or higher.")}else console.warn('Cannot find the "CKEDITOR_VERSION" in the "window" scope.')},mounted(){const e=Object.assign({},this.config);this.modelValue&&(e.initialData=this.modelValue),this.editor.create(this.$el,e).then(n=>{this.instance=(0,t.markRaw)(n),this.setUpEditorEvents(),this.modelValue!==e.initialData&&n.data.set(this.modelValue),this.disabled&&n.enableReadOnlyMode("Integration Sample"),this.$emit("ready",n)}).catch(t=>{console.error(t)})},beforeUnmount(){this.instance&&(this.instance.destroy(),this.instance=null),this.$emit("destroy",this.instance)},methods:{setUpEditorEvents(){const t=this.instance,e=D(e=>{const n=this.lastEditorData=t.data.get();this.$emit("update:modelValue",n,e,t),this.$emit("input",n,e,t)},300,{leading:!0});t.model.document.on("change:data",e),t.editing.view.document.on("focus",e=>{this.$emit("focus",e,t)}),t.editing.view.document.on("blur",e=>{this.$emit("blur",e,t)})}},render(){return(0,t.h)(this.tagName)}});if(!t.version||!t.version.startsWith("3."))throw new Error("The CKEditor plugin works only with Vue 3+. For more information, please refer to https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/frameworks/vuejs-v3.html");const R={install(t){t.component("Ckeditor",I)},component:I}})(),i=i.default})());
 //# sourceMappingURL=ckeditor.js.map

dist/plugin.d.ts

@@ -39,3 +39,3 @@ /**
         setUpEditorEvents(): void;
-    }, Vue.ComponentOptionsMixin, Vue.ComponentOptionsMixin, {}, string, Vue.VNodeProps & Vue.AllowedComponentProps & Vue.ComponentCustomProps, Readonly<Vue.ExtractPropTypes<{
+    }, Vue.ComponentOptionsMixin, Vue.ComponentOptionsMixin, ("update:modelValue" | "ready" | "destroy" | "blur" | "focus" | "input")[], "update:modelValue" | "ready" | "destroy" | "blur" | "focus" | "input", Vue.VNodeProps & Vue.AllowedComponentProps & Vue.ComponentCustomProps, Readonly<Vue.ExtractPropTypes<{
         editor: {
@@ -63,3 +63,10 @@ type: Vue.PropType<{
         };
-    }>>, {
+    }>> & {
+        "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+        onReady?: ((...args: any[]) => any) | undefined;
+        onDestroy?: ((...args: any[]) => any) | undefined;
+        onBlur?: ((...args: any[]) => any) | undefined;
+        onFocus?: ((...args: any[]) => any) | undefined;
+        onInput?: ((...args: any[]) => any) | undefined;
+    }, {
         modelValue: string;
@@ -74,4 +81,4 @@ disabled: boolean;
     interface GlobalComponents {
-        ckeditor: typeof CKEditorComponent;
+        Ckeditor: typeof CKEditorComponent;
     }
 }

package.json

 {
   "name": "@ckeditor/ckeditor5-vue",
-  "version": "5.0.0-alpha.1",
+  "version": "5.0.0-alpha.2",
   "main": "dist/ckeditor.js",
@@ -24,4 +24,4 @@ "types": "dist/plugin.d.ts",
     "@babel/core": "^7.17.7",
-    "@ckeditor/ckeditor5-build-classic": "^37.0.0-alpha.2",
-    "@ckeditor/ckeditor5-core": "^37.0.0-alpha.2",
+    "@ckeditor/ckeditor5-build-classic": "^37.0.0-alpha.3",
+    "@ckeditor/ckeditor5-core": "^37.0.0-alpha.3",
     "@ckeditor/ckeditor5-dev-bump-year": "^35.0.0",
@@ -39,2 +39,3 @@ "@ckeditor/ckeditor5-dev-ci": "^35.0.0",
     "eslint-config-ckeditor5": "^4.0.0",
+    "eslint-plugin-vue": "^9.9.0",
     "husky": "^8.0.2",
@@ -60,2 +61,3 @@ "karma": "^6.3.17",
     "vue": "^3.2.31",
+    "vue-eslint-parser": "^9.1.0",
     "webpack": "^5.73.0",
@@ -65,3 +67,3 @@ "webpack-cli": "^4.10.0"
   "engines": {
-    "node": ">=14.0.0",
+    "node": ">=16.0.0",
     "npm": ">=5.7.1"
@@ -81,3 +83,3 @@ },
     "coverage": "node ./scripts/test.js --coverage",
-    "lint": "eslint --quiet \"**/*.js\""
+    "lint": "eslint --quiet \"src/**/*.{js,ts}\""
   },
@@ -99,6 +101,8 @@ "repository": {
   "eslintIgnore": [
+    "coverage/**",
+    "demo/node_modules/**",
     "dist/**"
   ],
   "lint-staged": {
-    "**/*.js": [
+    "**/*.{js,ts}": [
       "eslint --quiet"
@@ -105,0 +109,0 @@ ]

README.md

@@ -28,3 +28,3 @@ # CKEditor 5 rich text editor component for Vue.js 3+
 ```bash
-npm install
+yarn install
 ```
@@ -35,5 +35,5 @@
 ```bash
-npm run test -- [additional options]
+yarn run test -- [additional options]
 # or
-npm t -- [additional options]
+yarn t -- [additional options]
 ```
@@ -49,3 +49,3 @@
 
-If you are going to change the component (`src/ckeditor.js`) or plugin (`src/plugin.js`) files, remember about rebuilding the package. You can use `npm run develop` in order to do it automatically.
+If you are going to change the component (`src/ckeditor.js`) or plugin (`src/plugin.js`) files, remember about rebuilding the package. You can use `yarn run develop` in order to do it automatically.
 
@@ -57,3 +57,3 @@ ### Building the package
 ```bash
-npm run build
+yarn run build
 ```
@@ -64,3 +64,3 @@
 ```bash
-npm run changelog
+yarn run changelog
 ```
@@ -86,2 +86,15 @@
 
+### Prerequisites
+
+Before releasing a new version, run a demo project to confirm that the integration works in a real-world scenario.
+
+1. Navigate to the `demo` folder.
+2. Reinstall the dependencies.
+3. Run `yarn dev` to see if the integration works as expected.
+4. Run `yarn build` to see if the project with the integration builds without errors.
+
+```Text
+Dependencies in the `demo` project need to be reinstalled after any changes to the integration, because in `package.json` we use `file:` instead of `link:` due to Vite limitations. Unlike `link:`, which creates a symlink to the integration, `file:` copies its contents when `yarn install` is run and never updates after that.
+```
+
 ### Changelog
@@ -92,3 +105,3 @@
 ```bash
-npm run changelog
+yarn run changelog
 ```
@@ -103,3 +116,3 @@
 ```bash
-npm run release:bump-version
+yarn run release:bump-version
 ```
@@ -112,3 +125,3 @@
 ```bash
-npm run release:publish
+yarn run release:publish
 ```
@@ -115,0 +128,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

52606

increased by3.49%

Lines of code

192

increased by9.09%

Number of lines in readme file

125

increased by11.61%

Worsened metrics

Dev dependency count

39

increased by5.41%

No dependency changes