# material-ui-markdown-editor

> React.js Markdown editor component based on material-ui

Latest version **1.0.10** (published 2017-02-20) · ISC license · 0 weekly downloads

## Install

```sh
npm install material-ui-markdown-editor
pnpm add material-ui-markdown-editor
yarn add material-ui-markdown-editor
bun add material-ui-markdown-editor
```

## Health

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

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.10 |
| Published | 2017-02-20 |
| First published | 2017-02-16 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 8 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 27 |
| Author | Lazarev ALexandr |
| Maintainers | diedsmiling |

## Links

- npm: https://www.npmjs.com/package/material-ui-markdown-editor
- Repository: https://github.com/diedsmiling/material-ui-markdown-editor
- Homepage: https://github.com/diedsmiling/material-ui-markdown-editor#readme
- Issues: https://github.com/diedsmiling/material-ui-markdown-editor/issues
- npm.io page: https://npm.io/package/material-ui-markdown-editor

## Dependencies (8)

- [jsdom](https://npm.io/package/jsdom.md) ^9.8.3
- [react](https://npm.io/package/react.md) ^15.3.2
- [lodash](https://npm.io/package/lodash.md) ^4.17.2
- [react-dom](https://npm.io/package/react-dom.md) ^15.3.2
- [codemirror](https://npm.io/package/codemirror.md) ^5.21.0
- [material-ui](https://npm.io/package/material-ui.md) ^0.16.2
- [react-codemirror](https://npm.io/package/react-codemirror.md) ^0.2.6
- [react-tap-event-plugin](https://npm.io/package/react-tap-event-plugin.md) ^2.0.1

## Recent versions

- 1.0.10 (latest) — 2017-02-20
- 1.0.9 — 2017-02-20
- 1.0.8 — 2017-02-20
- 1.0.7 — 2017-02-19
- 1.0.6 — 2017-02-19
- 1.0.5 — 2017-02-19
- 1.0.4 — 2017-02-19
- 1.0.3 — 2017-02-19
- 1.0.2 — 2017-02-18
- 1.0.1 — 2017-02-16
- 1.0.0 — 2017-02-16

## README

# Material-UI Markdown Editor :writing_hand:
This is a [React.js](https://github.com/facebook/react) Markdown editor component based on [material-ui](https://github.com/callemall/material-ui), built with [CodeMirror](https://github.com/codemirror/codemirror).  

**It is alpha version yet**, any feedback is welcome!

# Demo & Example

**Live demo** can be found [here](https://diedsmiling.github.io/material-ui-markdown-editor/).
To build the examples locally, run:
```
npm install
npm start
```

Then open [localhost:3000](http://localhost:3000/) in your browser.

To test application, run:

```
npm test
```

# Installation
Via npm:

```
npm i material-ui-markdown-editor
```

# Usage

*NOTE*: Codemirror styles and their *overrirde* should be included in the project keeping global selectors. In the following example, styles are included with the help of [css modules](https://github.com/css-modules/css-modules). Style's are not isolated by scope due to the reason, that rules generated by [CodeMirror](https://github.com/codemirror/codemirror) are  global. Might be solved in the feature.

```js
import React from 'react'
import ReactDOM from 'react-dom'
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'
import injectTapEventPlugin from 'react-tap-event-plugin'
import MarkdownEditor from 'material-ui-markdown-editor'
import 'codemirror/lib/codemirror.css' // import codemirror styles
import 'material-ui-markdown-editor/dist/MarkdownEditor/codemirrorOverride.css' // import override styles

injectTapEventPlugin()

const Example = () => (
  <MuiThemeProvider>
    <MarkdownEditor
      title="Foo"
      code="# Fancy markdown editor!"
    />
  </MuiThemeProvider>
)

ReactDOM.render(
  <Example />,
  document.getElementById('root')
)
```

*PS*:
This [README.md](https://github.com/diedsmiling/material-ui-markdown-editor/blob/master/README.md) was written with this editor :new_moon_with_face:

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