add support for 3rd party modules to quill editor (image drop and resize)

[jamjamg]

[ ] bug report => Search github for a similar issue or PR before submitting
[X] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

The primeng editor component currently does not allow registering 3rd party modules. Especially quill-image-resize-module and quill-image-drop-module are very useful modules.

Please add support for registering 3rd party modules (or at least image resize and drop capabilities).

• related: Allow for inserted pictures in the editor to be resized #2050
• this topic is also discussed over here: https://forum.primefaces.org/viewtopic.php?t=51125

The current initilization code of quill inside editor.ts would need to be enhanced similar to this:

import { ImageResize } from 'quill-image-resize-module';
Quill.register('modules/imageResize', ImageResize);
// ...
var quill = new Quill(editor, {
    modules: {
        ImageResize: {}
    }
});

current snippet from editor.ts:

this.quill = new Quill(editorElement, {
    modules: {
        toolbar: toolbarElement
    },
    placeholder: this.placeholder,
    readOnly: this.readonly,
    theme: 'snow',
    formats: this.formats
});

[vasyl-trs]

Any updates on this?

[salem017]

Any updates ?May be I can modify the editor.js to add it but it is not maintenable.

[cagataycivici]

Handled via;

#5695

It has a new modules property to define your own modules.

[Svancara]

It does not work.

I mean your

It has a new modules property to define your own modules.

This modules property of p-editor is not enough.
Modules have to be registered in Quill.
There is no "quill.register(...)" code in the PrimeNG editor code.
And - attempts to use some module fail.

[rogerex]

It does not work.

I mean your

It has a new modules property to define your own modules.

This modules property of p-editor is not enough.
Modules have to be registered in Quill.
There is no "quill.register(...)" code in the PrimeNG editor code.
And - attempts to use some module fail.

And if you try to register modules before, you can't, because editor.js is importing quill again overwriting your registered modules. [primeng version: 8.0.3]

The unique solution is import the modules in the same component:

import * as ImageResize from 'quill-image-resize-module'; ngOnInit(): void { Quill.register('modules/imageResize', (quill: any, options: any) => { new (ImageResize.default as any)(quill, options); }); }