editorjs-drag-drop - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

CHANGELOG.md

 # Changelog
 
+## 1.0.2 (18.01.2022)
+
+* Added react-editor-js support
+
 ## 1.0.1 (10.12.2021)
@@ -4,0 +8,0 @@

package.json

 {
   "name": "editorjs-drag-drop",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "keywords": [
@@ -5,0 +5,0 @@ "drag",

README.md

@@ -47,5 +47,5 @@ ![](https://badgen.net/badge/Editor.js/v2.0/blue)
 ```
-### Usage with [react-editor-js](https://github.com/Jungwoo-An/react-editor-js).
+### Usage with React.
 
-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 DragDrop instance. Then, you must call the function in onReady in the editorJS instance.   
+If you are using React, you could create a function to handle the onReady property, the function will store the DragDrop instance. Then, you must call the function in onReady in the editorJS instance.   
 
@@ -77,3 +77,33 @@ ```javascript
 ```
+### 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 should use the 'onInitialize' prop in the ReactEditorJS component to obtain the abstract editorjs as follow:
+
+```javascript
+........
+export const ReactEditor = () => {
+  const editorCore = React.useRef(null)
+    
+  const handleInitialize = React.useCallback((instance) => {
+    editorCore.current = instance
+  }, [])
+    
+  const handleReady = () => {
+    const editor = editorCore.current._editorJS; 
+    new Undo({ editor })
+    new DragDrop(editor);
+  };
+      
+  const ReactEditorJS = createReactEditorJS()
+  return(
+  <ReactEditorJS 
+    onInitialize={handleInitialize}
+    onReady = {handleReady}
+    tools={....} 
+    defaultValue={....}
+  />
+  )
+}
+```
+
 ## Development
@@ -80,0 +110,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

26263

increased by3.01%

Number of lines in readme file

150

increased by25%

No dependency changes