bae-sh / tiptap-extension-resize-image

tiptap-extension-resize-image
https://www.npmjs.com/package/tiptap-extension-resize-image
MIT License
42 stars 3 forks source link

When inline, image alignment buttons don't work #10

Open mason-os opened 4 weeks ago

mason-os commented 4 weeks ago

Hey again! It sounds like this extension doesn't support inline mode yet, which makes sense given how new it is. I just wanted to flag that the alignment buttons also don't work when inline is enabled on the extension.

I ended up forking the extension to work around this, using the text-align extension's commands for alignment instead, as that works with the paragraph node when the image is inserted inline.

To do this, I ended up swapping out the position controller event handlers to be:

        $leftController.addEventListener("click", () => {
          editor.chain().focus().setTextAlign("left").run();
          dispatchNodeView();
        });
        $centerController.addEventListener("click", () => {
          editor.chain().focus().setTextAlign("center").run();
          dispatchNodeView();
        });
        $rightController.addEventListener("click", () => {
          editor.chain().focus().setTextAlign("right").run();
          dispatchNodeView();
        });

An easier change to support this, if you're interested, would be to expose the paintPositionContoller method as an extension option that can be overridden. If that is a friendly change to you, I'd be happy to make a contribution!

bae-sh commented 3 weeks ago

Hi @mason-os,

First, thank you for your interest in my extension! I've reviewed your issues and tested your code. Your solution is promising, but for this inline case, we need to consider potential side effects.

We are planning to refactor the entire logic to better support this inline feature. I apologize for any inconvenience and let you know when the feature is complete.