aor-rich-text-input
aor-rich-text-input copied to clipboard
<RichTextInput> component for admin-on-rest, useful for editing HTML code in admin GUIs
Archived Repository This code is no longer maintained. Feel free to fork it, but use it at your own risks. |
<RichTextInput>
for admin-on-rest
For editing HTML with admin-on-rest, use the <RichTextInput>
component. It embarks quill, a popular cross-platform Rich Text Editor.
Installation
npm install aor-rich-text-input --save-dev
Usage
import React from 'react';
import {
DateInput,
Edit,
EditButton,
LongTextInput,
TextInput,
} from 'admin-on-rest/mui';
import RichTextInput from 'aor-rich-text-input';
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 }} />
<RichTextInput source="body" validation={{ required: true }} />
<DateInput label="Publication date" source="published_at" />
</Edit>
);
You can customize the rich text editor toolbar using the toolbar
attribute, as described on the Quill official toolbar documentation.
<RichTextInput source="body" toolbar={[ ['bold', 'italic', 'underline', 'link'] ]} />
License
This library is licensed under the MIT Licence, and sponsored by marmelab.