0
votes

I've been searching through the documentation for guidance on how to implement a link tooltip to a non standard theme (eg, not snow or bubble) but I'm running into problems.

Reading through the documentation here leads me to think I need to add a handlers object to modules.toolbar when initialising an instance of Quill, like so:

        let editor = new Quill(`#${id}-editor`, {
            bounds: element[0],
            formats:
                without(
                    ctrl.formats() ?
                        ctrl.formats()
                    : formats,
                    'paste',
                    'fullscreen'
                ),
            modules: {
                toolbar: {
                container: `#${id}-toolbar`,
                    handlers: {
                        link: ( value ) => {
                                if (value) {
                                    let href = 'http://www.google.nl';
                                    editor.format('link', href);
                                 } else {
                                    editor.format('link', false);
                                 }
                        }
                    }
                }
            }
        });

In my instance the handler function does get called when pressing the link button in the toolbar, but value is always false. Why?

1

1 Answers

0
votes

The handlers are called when toolbar buttons are clicked. The value parameter passed in is either true or false depending if that format exists over the current selection range. So if the user highlighted an existing link and clicked the link button, value will be false. Otherwise, it will be true. It can be a non-boolean value if the button has a data-value attribute but that is unrelated to your problem.

So in Snow for example, it adds a custom handler to show a link editor tooltip when value is true. When value is true, it simply calls the API to remove the link.