Markdown WYSIWYG Editor

Add and customize a Markdown WYSIWYG editor in your React application. Usesshadcn/uilibrary andlexical editorframework.

MarkdownLexicalsupports SSR and can be used in your NextJs application with Server Actions:

ExampleAdd some text to the editor, then click submit and check the result in your developer console.

async function addItem(data: any) {
    'use server'
    console.log(data);
}
return (
    <>
        <form action={addItem} className='w-full' >
            <MarkdownLexical name="markdown">
                <MarkdownLexicalFormatTextPlugin />
            </MarkdownLexical>
            <Button type="submit">Submit</Button>
        </form>
    </>
)