Add markdown to text area

[S3882476]

I found something here

this requires install the markdown from react

npm install marked

then this works on my react example program

import React, { useState } from 'react'; import { marked } from 'marked';

const MarkdownEditor = () => { const [markdown, setMarkdown] = useState('');

const handleChange = (event) => {
    setMarkdown(event.target.value);
};

// Convert markdown to HTML  
const getMarkdownText = () => {
    const rawMarkup = marked(markdown, { sanitize: true }); 
    return { __html: rawMarkup };
};

return (
    <div>
        <h1>Markdown Editor</h1>  
        <textarea        
            rows="10"
            cols="50"
            value={markdown}            <--!  this is text area input from template -->
            onChange={handleChange}
            placeholder="Type your markdown here..."
        />
        <h2>Output</h2>
        <div dangerouslySetInnerHTML={getMarkdownText()} />
    </div>
);

};

export default MarkdownEditor;