react-headless-mde 0.0.4 → 0.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.github/workflows/npm-publish.yml +2 -1
- package/package.json +1 -1
- package/readme.md +12 -31
package/package.json
CHANGED
package/readme.md
CHANGED
|
@@ -1,12 +1,7 @@
|
|
|
1
1
|
Introduction
|
|
2
2
|
===
|
|
3
|
-
This repository is fork from original repo of [andrerpena](https://github.com/andrerpena/react-mde).
|
|
4
|
-
Unfortunately the original repo is archived, so I decided to make a fork project to develop the headless version of mde,
|
|
5
|
-
because I believe this is the best mde editor for today.
|
|
6
|
-
|
|
7
|
-
|
|
8
3
|
A simple yet powerful and extensible **React Markdown Editor** that aims to have feature parity with the Github Markdown editor.
|
|
9
|
-
React-mde has no 3rd party dependencies.
|
|
4
|
+
React-mde-headless has no 3rd party dependencies.
|
|
10
5
|
|
|
11
6
|
## [Demo](https://codesandbox.io/s/charming-marco-9m4z93?file=/src/index.tsx)
|
|
12
7
|
|
|
@@ -22,7 +17,7 @@ import {
|
|
|
22
17
|
italicCommand,
|
|
23
18
|
linkCommand,
|
|
24
19
|
useTextAreaMarkdownEditor,
|
|
25
|
-
} from 'react-mde';
|
|
20
|
+
} from 'react-mde-headless';
|
|
26
21
|
|
|
27
22
|
export const MarkdownEditor = () => {
|
|
28
23
|
const { ref, commandController } = useTextAreaMarkdownEditor({
|
|
@@ -48,43 +43,29 @@ export const MarkdownEditor = () => {
|
|
|
48
43
|
);
|
|
49
44
|
};
|
|
50
45
|
```
|
|
46
|
+
## Todo
|
|
47
|
+
|
|
48
|
+
### Third party
|
|
49
|
+
- https://github.com/grassator/insert-text-at-cursor by https://twitter.com/d_kubyshkin
|
|
51
50
|
|
|
52
|
-
|
|
51
|
+
### XSS concerns
|
|
53
52
|
|
|
54
|
-
React-mde does not automatically sanitize the HTML preview. If your using Showdown,
|
|
53
|
+
React-mde-headless does not automatically sanitize the HTML preview. If your using Showdown,
|
|
55
54
|
this has been taken from [their documentation](https://github.com/showdownjs/showdown/wiki/Markdown's-XSS-Vulnerability-(and-how-to-mitigate-it)):
|
|
56
55
|
|
|
57
56
|
> Cross-side scripting is a well known technique to gain access to private information of the users
|
|
58
57
|
of a website. The attacker injects spurious HTML content (a script) on the web page which will read
|
|
59
58
|
the user’s cookies and do something bad with it (like steal credentials). As a countermeasure,
|
|
60
|
-
|
|
61
|
-
|
|
59
|
+
you should filter any suspicious content coming from user input. Showdown doesn’t include an
|
|
60
|
+
XSS filter, so you must provide your own. But be careful in how you do it…
|
|
62
61
|
|
|
63
62
|
You might want to take a look at [showdown-xss-filter](https://github.com/VisionistInc/showdown-xss-filter).
|
|
64
63
|
|
|
65
|
-
It is also possible to return a Promise to a React Element from `generateMarkdownPreview`, which makes
|
|
66
|
-
it possible to use [ReactMarkdown](https://github.com/rexxars/react-markdown) as a preview. [View issue](https://github.com/andrerpena/react-mde/issues/161).
|
|
67
|
-
ReactMarkdown has built-in XSS protection.
|
|
68
|
-
|
|
69
|
-
Please refer to the [commands source code](https://github.com/andrerpena/react-mde/tree/master/src/commands) to understand how they
|
|
70
|
-
should be implemented.
|
|
71
|
-
|
|
72
|
-
## Change log / Migrating from older versions
|
|
73
|
-
|
|
74
|
-
[Instructions here](https://github.com/andrerpena/react-mde/blob/master/docs-md/ChangeLogMigrating.md).
|
|
75
|
-
|
|
76
64
|
## Licence
|
|
77
65
|
|
|
78
|
-
React-mde is [MIT licensed](https://github.com/andrerpena/react-mde/blob/master/LICENSE).
|
|
79
|
-
|
|
80
|
-
## Third party
|
|
81
|
-
|
|
82
|
-
In order to make React-mde zero deps, I've embedded two small libraries:
|
|
83
|
-
- https://github.com/grassator/insert-text-at-cursor by https://twitter.com/d_kubyshkin
|
|
84
|
-
- https://github.com/JedWatson/classnames by https://twitter.com/JedWatson
|
|
66
|
+
React-mde-headless is [MIT licensed](https://github.com/andrerpena/react-mde/blob/master/LICENSE).
|
|
85
67
|
|
|
86
68
|
## About the author
|
|
87
69
|
|
|
88
|
-
Made with :heart: by André Pena and [other awesome contributors](https://github.com/andrerpena
|
|
70
|
+
Made with :heart: by André Pena and [other awesome contributors](https://github.com/andrerpena).
|
|
89
71
|
|
|
90
|
-
[](https://twitter.com/andrerpena)
|