ra-input-markdown

For editing Markdown with react-admin, use the <MarkdownInput> component. It uses react-med, a popular React Markdown Editor.

Usage no npm install needed!

<script type="module">
  import raInputMarkdown from 'https://cdn.skypack.dev/ra-input-markdown';
</script>

README

<MarkdownInput> for react-admin

npm npm

For editing Markdown with react-admin, use the <MarkdownInput> component. It uses react-med, a popular React Markdown Editor.

<MarkdownInput> example

Installation

npm install --save ra-input-markdown
# or
yarn add ra-input-markdown

Usage

import React from 'react';
import {
    DateInput,
    Edit,
    EditButton,
    LongTextInput,
    TextInput,
} from 'react-admin';
import MarkdownInput from 'ra-input-markdown';

const PostTitle = ({ record }) => {
    return <span>Post {record ? `"${record.title}"` : ''}</span>;
};

export const PostEdit = (props) => (
    <Edit title={<PostTitle />} {...props}>
        <DisabledInput label="Id" source="id" />
        <TextInput source="title" validation={{ required: true }} />
        <LongTextInput source="teaser" validation={{ required: true }} />
        <MarkdownInput source="body" />
        <DateInput label="Publication date" source="published_at" />
    </Edit>
);