Добавить компонент React в содержимое редактора TinyMCE

Мы создаем редактор и хотели бы использовать для него TimyMCE и React. У нас есть сценарии, в которых по событию мы должны добавить в редактор контент на основе шаблона. Я планирую разработать шаблоны как компонент React.

Итак, с помощью TinyMCE и React, как мне добавить компонент React в редактор TinyMCE.

    export class AppEditor extends React.Component<iEditorProps, iEditorState> {

    innerEditor: React.RefObject<Editor>;

    constructor(props: iEditorProps) {
        super(props);
        this.state = {
            content: ''            
        };
        this.innerEditor = React.createRef();
    }


    handleChangeEvent = (content) => {
        this.setState({ content });
    }

    handleAddContent = (e) => {
        this.setState(prevState => {
            return { content: prevState.content + <TemplateComp>Added Content</TemplateComp> }
        });
    }

    render() {
        return (
            <div>
                <Editor ref = {this.innerEditor} inline onEditorChange = {this.handleChangeEvent} value = {this.state.content} />
            </div>);
    }
}

В приведенном выше коде на «handleAddContent» я пытаюсь добавить <TemplateComp> в редактор, но он отображается как [объект] [Объект]. Я понимаю, что это делает конкатенация строк. Используемый пакет TinyMCE - https://github.com/tinymce/tinymce-react.

Но как мне добавить компонент в редактор?