import {
    RichTextEditorComponent,
    Inject,
    Toolbar,
    HtmlEditor,
    MarkdownEditor,
    SourceCode,
    Link, Image
    } from '@syncfusion/ej2-react-richtexteditor';
import * as React from 'react';

function CampfireToggleEditor(props) {
    const toolbarOptions = {
        items: [
        'Bold', 'Italic', 'Underline', '|',
        'Formats', 'Alignments', 'OrderedList', 'UnorderedList', '|',
        'CreateLink', 'Image', '|',
        'SourceCode',
        'Undo', 'Redo'
        ]
    };

    return (
        <RichTextEditorComponent
            value={props.value}
            change={handleEditorChange}
            editorMode={'Html'} 
            toolbarSettings={toolbarOptions}
            >
            <Inject 
                services={[
                Toolbar, 
                Link, 
                Image, 
                HtmlEditor,
                MarkdownEditor,
                SourceCode 
                ]} 
            />
        </RichTextEditorComponent>
    );
};

export default CampfireToggleEditor;