editorjs-undo - npm Package Compare versions

Comparing version 0.2.0 to 0.3.0

CHANGELOG.md

 # Changelog
 
+## 0.3.0 (21.09.2021)
+* Custom undo/redo keyboard shortcuts allowed.
+* Updated packages with known security breaches.
+
 ## 0.2.0 (09.09.2021)
@@ -4,0 +8,0 @@ * Accept strings in the holder key.

dist/bundle.js

@@ -1,1 +0,1 @@
-!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.Undo=e():t.Undo=e()}(window,(function(){return function(t){var e={};function n(i){if(e[i])return e[i].exports;var o=e[i]={i:i,l:!1,exports:{}};return t[i].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(i,o,function(e){return t[e]}.bind(null,o));return i},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="/",n(n.s=0)}([function(t,e,n){"use strict";function i(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}n.r(e),n.d(e,"default",(function(){return s}));var o=function(){function t(e,n){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.holder=n,this.observer=null,this.debounceTimer=200,this.mutationDebouncer=this.debounce((function(){e()}),this.debounceTimer)}var e,n,o;return e=t,(n=[{key:"setMutationObserver",value:function(){var t=this,e=this.holder;this.observer=new MutationObserver((function(e){t.mutationHandler(e)})),this.observer.observe(e,{childList:!0,attributes:!0,subtree:!0,characterData:!0,characterDataOldValue:!0})}},{key:"mutationHandler",value:function(t){var e=this,n=!1;t.forEach((function(t){switch(t.type){case"childList":t.target===e.holder?e.onDestroy():n=!0;break;case"characterData":n=!0;break;case"attributes":t.target.classList.contains("ce-block")||(n=!0)}})),n&&this.mutationDebouncer()}},{key:"debounce",value:function(t,e){var n,i=this;return function(){for(var o=arguments.length,r=new Array(o),s=0;s<o;s++)r[s]=arguments[s];var a=i;clearTimeout(n),n=setTimeout((function(){return t.apply(a,r)}),e)}}},{key:"onDestroy",value:function(){var t=new CustomEvent("destroy");document.dispatchEvent(t),this.observer.disconnect()}}])&&i(e.prototype,n),o&&i(e,o),t}();function r(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}var s=function(){function t(e){var n=this,i=e.editor,r=e.onUpdate,s=e.maxLength;!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t);var a={maxLength:30,onUpdate:function(){}},u=i.configuration,c=u.holder;this.holder="string"==typeof c?document.getElementById(c):c,this.editor=i,this.shouldSaveHistory=!0,this.readOnly=u.readOnly,this.maxLength=s||a.maxLength,this.onUpdate=r||a.onUpdate,new o((function(){return n.registerChange()}),this.holder).setMutationObserver(),this.setEventListeners(),this.initialItem=null,this.clear()}var e,n,i;return e=t,i=[{key:"isReadOnlySupported",get:function(){return!0}}],(n=[{key:"truncate",value:function(t,e){for(;t.length>e;)t.shift()}},{key:"initialize",value:function(t){var e="blocks"in t?t.blocks:t,n={index:e.length-1,state:e};this.stack[0]=n,this.initialItem=n}},{key:"clear",value:function(){this.stack=this.initialItem?[this.initialItem]:[{index:0,state:[]}],this.position=0,this.onUpdate()}},{key:"registerChange",value:function(){var t=this;this.readOnly||(this.editor&&this.editor.save&&this.shouldSaveHistory&&this.editor.save().then((function(e){t.editorDidUpdate(e.blocks)&&t.save(e.blocks)})),this.shouldSaveHistory=!0)}},{key:"editorDidUpdate",value:function(t){var e=this.stack[this.position].state;return t.length!==e.length||JSON.stringify(e)!==JSON.stringify(t)}},{key:"save",value:function(t){this.position>=this.maxLength&&this.truncate(this.stack,this.maxLength),this.position=Math.min(this.position,this.stack.length-1),this.stack=this.stack.slice(0,this.position+1);var e=this.editor.blocks.getCurrentBlockIndex();this.stack.push({index:e,state:t}),this.position+=1,this.onUpdate()}},{key:"undo",value:function(){var t=this;if(this.canUndo()){this.shouldSaveHistory=!1;var e=this.stack[this.position-=1],n=e.index,i=e.state;this.onUpdate(),this.editor.blocks.render({blocks:i}).then((function(){return t.editor.caret.setToBlock(n,"end")}))}}},{key:"redo",value:function(){var t=this;if(this.canRedo()){this.shouldSaveHistory=!1;var e=this.stack[this.position+=1],n=e.index,i=e.state;this.onUpdate(),this.editor.blocks.render({blocks:i}).then((function(){return t.editor.caret.setToBlock(n,"end")}))}}},{key:"canUndo",value:function(){return!this.readOnly&&this.position>0}},{key:"canRedo",value:function(){return!this.readOnly&&this.position<this.count()}},{key:"count",value:function(){return this.stack.length-1}},{key:"setEventListeners",value:function(){var t=this,e=this.holder,n=/(Mac)/i.test(navigator.platform)?"metaKey":"ctrlKey",i=function(e){e[n]&&"z"===e.key&&(e.preventDefault(),t.undo())},o=function(e){e[n]&&"y"===e.key&&(e.preventDefault(),t.redo())};e.addEventListener("keydown",i),e.addEventListener("keydown",o),e.addEventListener("destroy",(function(){e.removeEventListener("keydown",i),e.removeEventListener("keydown",o)}))}}])&&r(e.prototype,n),i&&r(e,i),t}()}]).default}));
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define([],e):"object"==typeof exports?exports.Undo=e():t.Undo=e()}(window,(function(){return function(t){var e={};function n(i){if(e[i])return e[i].exports;var o=e[i]={i:i,l:!1,exports:{}};return t[i].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(i,o,function(e){return t[e]}.bind(null,o));return i},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="/",n(n.s=0)}([function(t,e,n){"use strict";function i(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}n.r(e),n.d(e,"default",(function(){return s}));var o=function(){function t(e,n){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.holder=n,this.observer=null,this.debounceTimer=200,this.mutationDebouncer=this.debounce((function(){e()}),this.debounceTimer)}var e,n,o;return e=t,(n=[{key:"setMutationObserver",value:function(){var t=this,e=this.holder;this.observer=new MutationObserver((function(e){t.mutationHandler(e)})),this.observer.observe(e,{childList:!0,attributes:!0,subtree:!0,characterData:!0,characterDataOldValue:!0})}},{key:"mutationHandler",value:function(t){var e=this,n=!1;t.forEach((function(t){switch(t.type){case"childList":t.target===e.holder?e.onDestroy():n=!0;break;case"characterData":n=!0;break;case"attributes":t.target.classList.contains("ce-block")||(n=!0)}})),n&&this.mutationDebouncer()}},{key:"debounce",value:function(t,e){var n,i=this;return function(){for(var o=arguments.length,r=new Array(o),s=0;s<o;s++)r[s]=arguments[s];var a=i;clearTimeout(n),n=setTimeout((function(){return t.apply(a,r)}),e)}}},{key:"onDestroy",value:function(){var t=new CustomEvent("destroy");document.dispatchEvent(t),this.observer.disconnect()}}])&&i(e.prototype,n),o&&i(e,o),t}();function r(t,e){for(var n=0;n<e.length;n++){var i=e[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}var s=function(){function t(e){var n=this,i=e.editor,r=e.config,s=void 0===r?{}:r,a=e.onUpdate,u=e.maxLength;!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t);var c={maxLength:30,onUpdate:function(){},config:{shortcuts:{undo:"CMD+Z",redo:"CMD+Y"}}},h=i.configuration,l=h.holder,d=c.config.shortcuts,f=s.shortcuts,v=void 0===f?d:f;this.holder="string"==typeof l?document.getElementById(l):l,this.editor=i,this.shouldSaveHistory=!0,this.readOnly=h.readOnly,this.maxLength=u||c.maxLength,this.onUpdate=a||c.onUpdate,this.config={shortcuts:v},new o((function(){return n.registerChange()}),this.holder).setMutationObserver(),this.setEventListeners(),this.initialItem=null,this.clear()}var e,n,i;return e=t,i=[{key:"isReadOnlySupported",get:function(){return!0}}],(n=[{key:"truncate",value:function(t,e){for(;t.length>e;)t.shift()}},{key:"initialize",value:function(t){var e="blocks"in t?t.blocks:t,n={index:e.length-1,state:e};this.stack[0]=n,this.initialItem=n}},{key:"clear",value:function(){this.stack=this.initialItem?[this.initialItem]:[{index:0,state:[]}],this.position=0,this.onUpdate()}},{key:"registerChange",value:function(){var t=this;this.readOnly||(this.editor&&this.editor.save&&this.shouldSaveHistory&&this.editor.save().then((function(e){t.editorDidUpdate(e.blocks)&&t.save(e.blocks)})),this.shouldSaveHistory=!0)}},{key:"editorDidUpdate",value:function(t){var e=this.stack[this.position].state;return t.length!==e.length||JSON.stringify(e)!==JSON.stringify(t)}},{key:"save",value:function(t){this.position>=this.maxLength&&this.truncate(this.stack,this.maxLength),this.position=Math.min(this.position,this.stack.length-1),this.stack=this.stack.slice(0,this.position+1);var e=this.editor.blocks.getCurrentBlockIndex();this.stack.push({index:e,state:t}),this.position+=1,this.onUpdate()}},{key:"undo",value:function(){var t=this;if(this.canUndo()){this.shouldSaveHistory=!1;var e=this.stack[this.position-=1],n=e.index,i=e.state;this.onUpdate(),this.editor.blocks.render({blocks:i}).then((function(){return t.editor.caret.setToBlock(n,"end")}))}}},{key:"redo",value:function(){var t=this;if(this.canRedo()){this.shouldSaveHistory=!1;var e=this.stack[this.position+=1],n=e.index,i=e.state;this.onUpdate(),this.editor.blocks.render({blocks:i}).then((function(){return t.editor.caret.setToBlock(n,"end")}))}}},{key:"canUndo",value:function(){return!this.readOnly&&this.position>0}},{key:"canRedo",value:function(){return!this.readOnly&&this.position<this.count()}},{key:"count",value:function(){return this.stack.length-1}},{key:"parseKeys",value:function(t){var e={CMD:/(Mac)/i.test(navigator.platform)?"metaKey":"ctrlKey",ALT:"altKey",SHIFT:"shiftKey"},n=t.slice(0,-1).map((function(t){return e[t]})),i=n.includes("shiftKey")?t[t.length-1].toUpperCase():t[t.length-1].toLowerCase();return n.push(i),n}},{key:"setEventListeners",value:function(){var t=this,e=this.holder,n=this.config.shortcuts,i=n.undo,o=n.redo,r=i.replace(/ /g,"").split("+"),s=o.replace(/ /g,"").split("+"),a=this.parseKeys(r),u=this.parseKeys(s),c=function(t,e){return!(2!==e.length||!t[e[0]]||t.key!==e[1])||!(3!==e.length||!t[e[0]]||!t[e[1]]||t.key!==e[2])},h=function(e){c(e,a)&&(e.preventDefault(),t.undo())},l=function(e){c(e,u)&&(e.preventDefault(),t.redo())};e.addEventListener("keydown",h),e.addEventListener("keydown",l),e.addEventListener("destroy",(function(){e.removeEventListener("keydown",h),e.removeEventListener("keydown",l)}))}}])&&r(e.prototype,n),i&&r(e,i),t}()}]).default}));

package.json

 {
   "name": "editorjs-undo",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "keywords": [
@@ -33,3 +33,3 @@ "undo",
     "@babel/preset-env": "^7.10.2",
-    "babel-jest": "^26.0.1",
+    "babel-jest": "^27.2.1",
     "babel-loader": "^8.1.0",
@@ -40,3 +40,3 @@ "eslint": "^7.1.0",
     "eslint-plugin-jest": "^23.13.2",
-    "jest": "^26.0.1",
+    "jest": "^27.2.1",
     "webpack": "^5.52.0",
@@ -43,0 +43,0 @@ "webpack-cli": "^4.6.0"

README.md

@@ -37,4 +37,32 @@ ![](https://badgen.net/badge/Editor.js/v2.0/blue)
 
+### Usage with [react-editor-js](https://github.com/Jungwoo-An/react-editor-js).
 
+If you are using [react-editor-js](https://github.com/Jungwoo-An/react-editor-js), you could create a function to handle the onReady property, the function will store the undo instance and the respective configuration or initialize method if you want to use them (they will be explained below). Then, you must call the function in onReady in the editorJS instance.   
 
+```javascript
+const handleReady = (editor) => {
+  new Undo({ editor });
+};
+
+class ReactEditor extends Component {
+  render() {
+    return (
+      <EditorJs
+        onReady = { handleReady }
+        tools = { ... }
+      />
+    )
+  }
+}
+```
+**Note:** If you are already using [editorjs-drag-drop](https://github.com/kommitters/editorjs-drag-drop) your handleReady function must have the editorjs-drag-drop instance.
+
+```javascript
+const handleReady = (editor) => {
+  new Undo({ editor });
+  new DragDrop(editor);
+};
+
+```
+
 ### Initialize the plugin with data
@@ -55,2 +83,24 @@
 
+### Add a custom shortcut to undo and redo
+
+**Note:** If you do not add any shortcut, the default shortcuts will be set up.
+
+If you want to add custom shortcuts, pass a config object with a shortcut key in the undo instance, the shortcuts must be called `undo` and `redo`.
+
+```javascript
+const config = {
+  shortcuts: {
+    undo: 'CMD+X',
+    redo: 'CMD+ALT+C'
+  }
+}
+const editor = new EditorJS({
+  onReady: () => {
+    const undo = new Undo({ editor, config });
+  },
+});
+```
+
+You can set each shortcut with two or three keys, the available special keys are: CMD, ALT, SHIFT. CMD will be set up automatically as <kbd>Ctrl</kbd> or <kbd>⌘</kbd> depending on your OS.
+
 ### Available Options
@@ -63,3 +113,5 @@
 | onUpdate() | `function` | Callback called when the user performs an undo or redo action. |
+| config     | `object`   | Set up the configuration to editorjs-undo like the shortcuts   |
 
+
 ## Development
@@ -66,0 +118,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

24698

increased by11.1%

Number of lines in readme file

157

increased by49.52%

No dependency changes