From 4d36cb04988a24e54659990197b5dc8c8926e22f Mon Sep 17 00:00:00 2001
From: Mohammad Rasim <mohammad.rasim96@gmail.com>
Date: Tue, 25 Apr 2023 16:11:21 +0300
Subject: [PATCH 1/2] Rename image.ts to image.tsx since it contains jsx syntax

---
 src/{image.ts => image.tsx} | 0
 1 file changed, 0 insertions(+), 0 deletions(-)
 rename src/{image.ts => image.tsx} (100%)

diff --git a/src/image.ts b/src/image.tsx
similarity index 100%
rename from src/image.ts
rename to src/image.tsx

From 6dc43ca51182bf857696783cd37f70c48fb8a722 Mon Sep 17 00:00:00 2001
From: Mohammad Rasim <mohammad.rasim96@gmail.com>
Date: Tue, 25 Apr 2023 16:25:48 +0300
Subject: [PATCH 2/2] Fixes and react 18 update

---
 package.json  |  5 +++--
 src/image.tsx | 20 ++------------------
 2 files changed, 5 insertions(+), 20 deletions(-)

diff --git a/package.json b/package.json
index 5c46984..ed49016 100644
--- a/package.json
+++ b/package.json
@@ -10,9 +10,9 @@
   ],
   "peerDependencies": {
     "@tiptap/core": "^2.0.0-beta.1",
-    "@tiptap/react": "^2.0.0-beta.109",
     "@tiptap/extension-image": "^2.0.0-beta.27",
-    "react": "^17.0.2"
+    "@tiptap/react": "^2.0.0-beta.109",
+    "react": "^17.0.2 || ^18"
   },
   "main": "src/index.ts",
   "files": [
@@ -23,5 +23,6 @@
     "url": "https://github.com/breakerh/tiptap-image-resize"
   },
   "dependencies": {
+    "@types/react": "^18.0.38"
   }
 }
diff --git a/src/image.tsx b/src/image.tsx
index 665eea1..06b3e7f 100644
--- a/src/image.tsx
+++ b/src/image.tsx
@@ -1,4 +1,4 @@
-import {Component, FC, ReactElement} from "react";
+import React, {Component, FC, ReactElement} from "react";
 import {mergeAttributes, nodeInputRule, Node} from "@tiptap/core";
 import {ReactNodeViewRenderer} from "@tiptap/react";
 import ImageResizeComponent from "./component/ImageResizeComponent";
@@ -32,6 +32,7 @@ export const ImageResize = Image.extend<ImageOptions>({
   },
   addAttributes() {
     return {
+      ...this.parent?.(),
       width: {
         default: '100%',
         renderHTML: (attributes) => {
@@ -48,25 +49,8 @@ export const ImageResize = Image.extend<ImageOptions>({
           };
         }
       },
-      isDraggable: {
-        default: true,
-        renderHTML: (attributes) => {
-          return {};
-        }
-      }
     };
   },
-  parseHTML() {
-    return [
-      {
-        tag: 'image-resizer',
-      },
-    ]
-  },
-
-  renderHTML({ HTMLAttributes }) {
-    return ['image-resizer', mergeAttributes(this.options.HTMLAttributes,HTMLAttributes)]
-  },
 
   addNodeView() {
     return ReactNodeViewRenderer(ImageResizeComponent)