Insert Text at cursor position inside text

Hi,

We are evaluating GrapesJS for one of requirement. As part of the evaluation i am creating custom command 'insert placeholder', what it does is ( what i am planning to do ) is when a select Text and when i click this command , it should insert text at the selected cursor position.

Initially i had done this 

   var existingData = selectedComponent.view.el.firstChild.data;
           
          var placeHolderData = '[[1# PlaceHolder Name]]';
          existingData = existingData + " "+placeHolderData;

            console.log("existingData ",existingData); 
        
          selectedComponent.set('content', existingData);

this is only appending text.  My requirement is insert at given cursor position. It will be great anybody can quickly come up with a solution for this ?

Thanks in Advance
Sarath K S