I want to add custom button to Trix editor that would allow a user to enter url of video (YouTube, Vimeo) and then new element will be inserted at current cursor position. The video ID would be encrypted.

I managed to add a button but I have troubles to use .insertString()

Trix.config.textAttributes.zzVideo = {
//    style: { color: "red" },
    parser: function(element) {
    
    var tEditor = document.querySelector("trix-editor")
    
    console.log(tEditor)
    console.log(tEditor.editor)
    console.log(element)
    console.log(element.editor)
    
    //tEditor.insertString("Hello")
 //   element.insertString("Hellow")
    
        return //element.style.color === "red"
    },
    inheritable: true
}

https://jsfiddle.net/radek/aL8ochdm/19/

If you also could guide me how to open a modal upon menu button click so user can enter the url it would be great.