Using a third party rich text editor like quill for textBlock

Is there any possibility of using a rich text editor like quill for text inside a shape.

It would be great if we could parse html-like element inside go.ObjectData keys, something like below:-

public diagramNodeData: Array<go.ObjectData> = [

{ key: '<quill-editor>Alpha<quill-editor>', color: 'lightblue', arr: [1, 2] },

{ key: 'Beta', color: 'orange' }]

Yes, you can implement your own custom text editors. Two of them are shown in https://gojs.net/latest/samples/customTextEditingTool.html

I suggest that you use a separate property to indicate which kind of editor to use, rather than mixing the text string with the editor choice in a single property value.

Thanks @walter, but I have already tried the customTextEditingTool but still the editor fails…

Just to confirm from gojs, this is what I have used

go.Diagram {

    const $ = go.GraphObject.make;

    const dia = $(go.Diagram, {
     //assume quillEditor to be already defined
      'textEditingTool.defaultTextEditor': quillEditor,

      'undoManager.isEnabled': true,

and then in the textBlock…

$(go.TextBlock, { margin: 8, editable: true, textEditor:  quillEditor},

            new go.Binding('text', 'key'))

If this is correct, seems like there is a issue with the angular lifecycle in which I have instantiated the editor.

How did you define and then import quillEditor?

@walter In app.component.ts:-

I have imported like this:-

import * as Quill from 'quill';

and then initialized as:

const quillEditor: any = Quill

the error when I try to edit the text inside the textBlock is:

core.js:5845 ERROR TypeError: Cannot read property 'show' of undefined
    at Vg.push../node_modules/gojs/release/go.js.Vg.doActivate (go.js:505)

A text editor in GoJS must be an instance of HTMLInfo. https://gojs.net/latest/intro/HTMLInteraction.html#HTMLInfoClass

Such a text editor could make use of Quill. But only your code would know how to use Quill, which we had never heard of until now.

Okay… so anything else to achieve some rich texting for textBlock inside a node?

If you want to use Quill, go ahead.

But I hope you understand that the point of a TextBlock is to provide a block of text with a single set of attributes. TextBlocks do not render markup.

Yes. Understood! Thanks for these quick replies and support. Really appreciate it! :)