jpuri / react-draft-wysiwyg

A Wysiwyg editor build on top of ReactJS and DraftJS. https://jpuri.github.io/react-draft-wysiwyg
MIT License
6.4k stars 1.16k forks source link

Feature request: user-friendly removal of images from editor #600

Open tgus opened 6 years ago

tgus commented 6 years ago

It looks like there is no user-friendly way to remove images from the editor after they are uploaded and added to the editor. A user can highlight the image and click delete/backspace and the image will be removed but that does not work consistently as in some cases the image markup/HTML may still persist inside the editor even though it appears to be removed to the user.

Perhaps the remove option could be included along with the existing alignment options?

diff --git a/src/renderer/Image/index.js b/src/renderer/Image/index.js
index f7e7a3d..07c048f 100644
--- a/src/renderer/Image/index.js
+++ b/src/renderer/Image/index.js
@@ -75,6 +75,12 @@ const getImageComponent = config => class Image extends Component {
         >
           R
         </Option>
+        <Option
+          onClick={this.removeEntity}
+          className="rdw-image-remove-option"
+        >
+          Remove
+        </Option>
       </div>
     );
   }
Huespal commented 6 years ago

I've added a pull request with a optional button to remove the image. Thanks to your idea, @tgus. PR: https://github.com/jpuri/react-draft-wysiwyg/pull/629

sahiljaidka224 commented 4 years ago

Please add this feature, will be very useful