# ra-tinymce

> component for react-admin, useful for editing HTML in admin GUIs

Latest version **0.0.2** (published 2021-07-21) · MIT license · 0 weekly downloads

## Install

```sh
npm install ra-tinymce
pnpm add ra-tinymce
yarn add ra-tinymce
bun add ra-tinymce
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.2 |
| Published | 2021-07-21 |
| First published | 2021-07-21 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 7 |
| Unpacked size | 139.8 KB |
| Known vulnerabilities | 0 (+7 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 1 |
| Author | anhquoctran |
| Maintainers | anhquoc96 |
| Keywords | reactjs, react, rest, html, editor, tinymce, react-admin |

## Links

- npm: https://www.npmjs.com/package/ra-tinymce
- Repository: https://github.com/anhquoctran/ra-tinymce
- Homepage: https://github.com/anhquoctran/ra-tinymce.git
- Issues: https://github.com/anhquoctran/ra-tinymce/issues
- npm.io page: https://npm.io/package/ra-tinymce

## Dependencies (7)

- [react](https://npm.io/package/react.md) ^17.0.2
- [ra-core](https://npm.io/package/ra-core.md) ^3.17.0
- [tinymce](https://npm.io/package/tinymce.md) ^5.8.2
- [prop-types](https://npm.io/package/prop-types.md) ^15.7.2
- [react-admin](https://npm.io/package/react-admin.md) ^3.17.0
- [react-final-form](https://npm.io/package/react-final-form.md) ^6.5.3
- [@tinymce/tinymce-react](https://npm.io/package/@tinymce/tinymce-react.md) ^3.12.6

## Alternatives

- [@tsparticles/shape-image](https://npm.io/package/@tsparticles/shape-image.md) — 303.7K weekly downloads
- [@tsparticles/shape-line](https://npm.io/package/@tsparticles/shape-line.md) — 233.7K weekly downloads
- [stringify-attributes](https://npm.io/package/stringify-attributes.md) — 58.6K weekly downloads
- [mobile-drag-drop](https://npm.io/package/mobile-drag-drop.md) — 46.3K weekly downloads
- [@comunica/actor-rdf-parse-html](https://npm.io/package/@comunica/actor-rdf-parse-html.md) — 29.2K weekly downloads

## Recent versions

- 0.0.2 (latest) — 2021-07-21
- 0.0.1 — 2021-07-21

## README

# `<TinyMCEEditor />` input component for React-Admin Framework

* All TinyMCE options are fully supported
* TypeScript definitions are supported

Binding of [`<TinyMCEEditor />`](https://github.com/anhquoctran/ra-tinymce-input) for [react-admin](https://marmelab.com/react-admin/).

## Installation

```bash
$ npm install ra-tinymce --save
```

or 

```bash
$ yarn add ra-tinymce
```

## Basic usage

```tsx
import React, { FC } from 'react';
import {
  SimpleForm, 
  Edit,
  TextInput
} from 'react-admin';

import TinyMCEInput, { TinyMCEInputProps } from 'ra-tinymce';

const PostEdit: FC<TinyMCEInputProps> = (props) => {
  return (
    <Edit>
      <SimpleForm>
        <TextInput source="title" />
        <TinyMCEEditor
          source="content"
          init={{
            height: 500,
            menubar: false,
            plugins: [
              'advlist autolink lists link image charmap print preview anchor',
              'searchreplace visualblocks code fullscreen',
              'insertdatetime media table paste code help wordcount'
            ],
            toolbar: 'undo redo | formatselect | ' +
            'bold italic backcolor | alignleft aligncenter ' +
            'alignright alignjustify | bullist numlist outdent indent | ' +
            'removeformat | help',
            content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:14px }'
          }}
        />
      </SimpleForm>
    </Edit>
  );
};

export default PostEdit;
```

## License

This library is licensed under the [MIT Licence](LICENSE).

## Author

This library is maintain by [@anhquoctran](https://github.com/anhquoctran)

---
_Source: https://npm.io/package/ra-tinymce · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
