@uiw/react-md-editor 4.0.5 → 4.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/README.md +10 -2
- package/dist/mdeditor.css +107 -107
- package/dist/mdeditor.js +7858 -3897
- package/dist/mdeditor.min.css +1 -1
- package/dist/mdeditor.min.js +1 -1
- package/esm/Context.d.ts +1 -1
- package/esm/Editor.js +5 -5
- package/esm/Editor.nohighlight.js +4 -4
- package/esm/commands/bold.d.ts +1 -1
- package/esm/commands/bold.js +1 -1
- package/esm/commands/code.d.ts +1 -1
- package/esm/commands/code.js +1 -1
- package/esm/commands/comment.d.ts +1 -1
- package/esm/commands/comment.js +1 -1
- package/esm/commands/divider.d.ts +1 -1
- package/esm/commands/fullscreen.d.ts +1 -1
- package/esm/commands/group.d.ts +1 -1
- package/esm/commands/help.d.ts +1 -1
- package/esm/commands/hr.d.ts +1 -1
- package/esm/commands/hr.js +1 -1
- package/esm/commands/image.d.ts +1 -1
- package/esm/commands/image.js +1 -1
- package/esm/commands/index.cn.js +24 -24
- package/esm/commands/index.d.ts +1 -1
- package/esm/commands/index.js +25 -25
- package/esm/commands/issue.d.ts +1 -1
- package/esm/commands/issue.js +1 -1
- package/esm/commands/italic.d.ts +1 -1
- package/esm/commands/italic.js +1 -1
- package/esm/commands/link.d.ts +1 -1
- package/esm/commands/link.js +1 -1
- package/esm/commands/list.d.ts +1 -1
- package/esm/commands/list.js +1 -1
- package/esm/commands/preview.d.ts +1 -1
- package/esm/commands/quote.d.ts +1 -1
- package/esm/commands/quote.js +1 -1
- package/esm/commands/strikeThrough.js +1 -1
- package/esm/commands/table.js +1 -1
- package/esm/commands/title.js +2 -2
- package/esm/commands/title1.js +1 -1
- package/esm/commands/title2.js +1 -1
- package/esm/commands/title3.js +1 -1
- package/esm/commands/title4.js +1 -1
- package/esm/commands/title5.js +1 -1
- package/esm/commands/title6.js +1 -1
- package/esm/components/TextArea/Markdown.js +1 -1
- package/esm/components/TextArea/Textarea.js +4 -4
- package/esm/components/TextArea/handleKeyDown.js +3 -4
- package/esm/components/TextArea/index.d.ts +1 -1
- package/esm/components/TextArea/index.js +5 -5
- package/esm/components/TextArea/index.nohighlight.d.ts +1 -1
- package/esm/components/TextArea/index.nohighlight.js +4 -4
- package/esm/components/TextArea/shortcuts.d.ts +1 -1
- package/esm/components/Toolbar/Child.js +2 -2
- package/esm/components/Toolbar/index.d.ts +1 -1
- package/esm/components/Toolbar/index.js +2 -2
- package/esm/index.css +0 -1
- package/esm/index.d.ts +2 -2
- package/esm/index.js +10 -10
- package/esm/index.nohighlight.d.ts +2 -2
- package/esm/index.nohighlight.js +8 -8
- package/esm/utils/markdownUtils.d.ts +1 -2
- package/lib/Context.d.ts +1 -1
- package/lib/Editor.js +4 -4
- package/lib/Editor.nohighlight.js +3 -3
- package/lib/commands/bold.d.ts +1 -1
- package/lib/commands/code.d.ts +1 -1
- package/lib/commands/comment.d.ts +1 -1
- package/lib/commands/divider.d.ts +1 -1
- package/lib/commands/fullscreen.d.ts +1 -1
- package/lib/commands/group.d.ts +1 -1
- package/lib/commands/help.d.ts +1 -1
- package/lib/commands/hr.d.ts +1 -1
- package/lib/commands/image.d.ts +1 -1
- package/lib/commands/index.d.ts +1 -1
- package/lib/commands/issue.d.ts +1 -1
- package/lib/commands/italic.d.ts +1 -1
- package/lib/commands/link.d.ts +1 -1
- package/lib/commands/list.d.ts +1 -1
- package/lib/commands/preview.d.ts +1 -1
- package/lib/commands/quote.d.ts +1 -1
- package/lib/components/TextArea/Textarea.js +1 -1
- package/lib/components/TextArea/handleKeyDown.js +1 -1
- package/lib/components/TextArea/index.d.ts +1 -1
- package/lib/components/TextArea/index.js +1 -1
- package/lib/components/TextArea/index.nohighlight.d.ts +1 -1
- package/lib/components/TextArea/index.nohighlight.js +1 -1
- package/lib/components/TextArea/shortcuts.d.ts +1 -1
- package/lib/components/Toolbar/index.d.ts +1 -1
- package/lib/index.d.ts +2 -2
- package/lib/index.js +1 -1
- package/lib/index.nohighlight.d.ts +2 -2
- package/lib/index.nohighlight.js +1 -1
- package/lib/utils/markdownUtils.d.ts +1 -2
- package/markdown-editor.css +0 -1
- package/package.json +1 -1
- package/src/Context.tsx +1 -1
- package/src/Editor.nohighlight.tsx +3 -3
- package/src/Editor.tsx +4 -4
- package/src/commands/bold.tsx +1 -1
- package/src/commands/code.tsx +1 -1
- package/src/commands/comment.tsx +1 -1
- package/src/commands/divider.tsx +1 -1
- package/src/commands/fullscreen.tsx +2 -2
- package/src/commands/group.tsx +1 -1
- package/src/commands/help.tsx +1 -1
- package/src/commands/hr.tsx +1 -1
- package/src/commands/image.tsx +1 -1
- package/src/commands/index.ts +1 -1
- package/src/commands/issue.tsx +1 -1
- package/src/commands/italic.tsx +1 -1
- package/src/commands/link.tsx +1 -1
- package/src/commands/list.tsx +1 -1
- package/src/commands/preview.tsx +2 -2
- package/src/commands/quote.tsx +1 -1
- package/src/components/TextArea/Textarea.tsx +1 -1
- package/src/components/TextArea/handleKeyDown.tsx +1 -1
- package/src/components/TextArea/index.nohighlight.tsx +1 -1
- package/src/components/TextArea/index.tsx +1 -1
- package/src/components/TextArea/shortcuts.ts +1 -1
- package/src/components/Toolbar/index.tsx +1 -1
- package/src/index.nohighlight.tsx +2 -2
- package/src/index.tsx +2 -2
- package/src/utils/markdownUtils.ts +1 -2
package/README.md
CHANGED
|
@@ -54,6 +54,12 @@ A simple markdown editor with preview, implemented with React.js and TypeScript.
|
|
|
54
54
|
npm i @uiw/react-md-editor
|
|
55
55
|
```
|
|
56
56
|
|
|
57
|
+
or
|
|
58
|
+
|
|
59
|
+
```bash
|
|
60
|
+
yarn add @uiw/react-md-editor
|
|
61
|
+
```
|
|
62
|
+
|
|
57
63
|
### Using
|
|
58
64
|
|
|
59
65
|
[](https://codesandbox.io/embed/markdown-editor-for-react-izdd6?fontsize=14&hidenavigation=1&theme=dark)
|
|
@@ -932,7 +938,7 @@ Inherit custom color variables by adding [`.wmde-markdown-var`](https://github.c
|
|
|
932
938
|
- `overflow?: boolean=true`: Disable `fullscreen` setting body styles
|
|
933
939
|
- `preview?: 'live' | 'edit' | 'preview'`: Default value `live`, Show markdown preview.
|
|
934
940
|
- `maxHeight?: number=1200`: Maximum drag height. The `visibleDragbar=true` value is valid.
|
|
935
|
-
- `
|
|
941
|
+
- `minHeight?: number=100`: Minimum drag height. The `visibleDragbar=true` value is valid.
|
|
936
942
|
- `tabSize?: number=2`: The number of characters to insert when pressing tab key. Default `2` spaces.
|
|
937
943
|
- `defaultTabEnable?: boolean=false`: If `false`, the `tab` key inserts a tab character into the textarea. If `true`, the `tab` key executes default behavior e.g. focus shifts to next element.
|
|
938
944
|
- `hideToolbar?: boolean=false`: Option to hide the tool bar.
|
|
@@ -981,14 +987,16 @@ As always, thanks to our amazing contributors!
|
|
|
981
987
|
<a href="https://github.com/alpharomercoma" title="Alpha Romer Coma"><img src="https://avatars.githubusercontent.com/u/108984668?v=4" width="42;" alt="Alpha Romer Coma"/></a>
|
|
982
988
|
<a href="https://github.com/RARgames" title="RAR"><img src="https://avatars.githubusercontent.com/u/13639766?v=4" width="42;" alt="RAR"/></a>
|
|
983
989
|
<a href="https://github.com/Exmirai" title="UniqueUlysees"><img src="https://avatars.githubusercontent.com/u/6436703?v=4" width="42;" alt="UniqueUlysees"/></a>
|
|
990
|
+
<a href="https://github.com/sandiiarov" title="Alex Sandiiarov"><img src="https://avatars.githubusercontent.com/u/15861257?v=4" width="42;" alt="Alex Sandiiarov"/></a>
|
|
984
991
|
<a href="https://github.com/nuragic" title="Andrea Puddu"><img src="https://avatars.githubusercontent.com/u/1586378?v=4" width="42;" alt="Andrea Puddu"/></a>
|
|
985
992
|
<a href="https://github.com/AntonR31337" title="Anton"><img src="https://avatars.githubusercontent.com/u/88384647?v=4" width="42;" alt="Anton"/></a>
|
|
986
993
|
<a href="https://github.com/bramus" title="Bramus"><img src="https://avatars.githubusercontent.com/u/213073?v=4" width="42;" alt="Bramus"/></a>
|
|
987
994
|
<a href="https://github.com/CarleneCannon-Conner" title="Carlene Cannon-Conner"><img src="https://avatars.githubusercontent.com/u/1942791?v=4" width="42;" alt="Carlene Cannon-Conner"/></a>
|
|
988
995
|
<a href="https://github.com/MercierCorentin" title="Corentin Mercier"><img src="https://avatars.githubusercontent.com/u/46066895?v=4" width="42;" alt="Corentin Mercier"/></a>
|
|
989
|
-
<a href="https://github.com/dmitriyyan" title="Dmitrii
|
|
996
|
+
<a href="https://github.com/dmitriyyan" title="Dmitrii Yanushkevich"><img src="https://avatars.githubusercontent.com/u/89025862?v=4" width="42;" alt="Dmitrii Yanushkevich"/></a>
|
|
990
997
|
<a href="https://github.com/jnishiyama" title="James Finucane"><img src="https://avatars.githubusercontent.com/u/2048195?v=4" width="42;" alt="James Finucane"/></a>
|
|
991
998
|
<a href="https://github.com/allforabit" title="Kevin Nolan"><img src="https://avatars.githubusercontent.com/u/537189?v=4" width="42;" alt="Kevin Nolan"/></a>
|
|
999
|
+
<a href="https://github.com/liamstamper" title="Liam Stamper"><img src="https://avatars.githubusercontent.com/u/136619788?v=4" width="42;" alt="Liam Stamper"/></a>
|
|
992
1000
|
<a href="https://github.com/kseikyo" title="Lucas Sierota"><img src="https://avatars.githubusercontent.com/u/29212286?v=4" width="42;" alt="Lucas Sierota"/></a>
|
|
993
1001
|
<a href="https://github.com/michaelkramer" title="Michael Kramer"><img src="https://avatars.githubusercontent.com/u/6052223?v=4" width="42;" alt="Michael Kramer"/></a>
|
|
994
1002
|
<a href="https://github.com/peterj" title="Peter Jausovec"><img src="https://avatars.githubusercontent.com/u/11080940?v=4" width="42;" alt="Peter Jausovec"/></a>
|
package/dist/mdeditor.css
CHANGED
|
@@ -1099,6 +1099,113 @@ body[data-color-mode*='light'] {
|
|
|
1099
1099
|
cursor: help;
|
|
1100
1100
|
}
|
|
1101
1101
|
|
|
1102
|
+
.w-md-editor-toolbar-child {
|
|
1103
|
+
position: absolute;
|
|
1104
|
+
border-radius: 3px;
|
|
1105
|
+
box-shadow: 0 0 0 1px var(--md-editor-box-shadow-color), 0 0 0 var(--md-editor-box-shadow-color), 0 1px 1px var(--md-editor-box-shadow-color);
|
|
1106
|
+
background-color: var(--md-editor-background-color);
|
|
1107
|
+
z-index: 1;
|
|
1108
|
+
display: none;
|
|
1109
|
+
}
|
|
1110
|
+
.w-md-editor-toolbar-child.active {
|
|
1111
|
+
display: block;
|
|
1112
|
+
}
|
|
1113
|
+
.w-md-editor-toolbar-child .w-md-editor-toolbar {
|
|
1114
|
+
border-bottom: 0;
|
|
1115
|
+
padding: 3px;
|
|
1116
|
+
border-radius: 3px;
|
|
1117
|
+
}
|
|
1118
|
+
.w-md-editor-toolbar-child .w-md-editor-toolbar ul > li {
|
|
1119
|
+
display: block;
|
|
1120
|
+
}
|
|
1121
|
+
.w-md-editor-toolbar-child .w-md-editor-toolbar ul > li button {
|
|
1122
|
+
width: -webkit-fill-available;
|
|
1123
|
+
height: auto;
|
|
1124
|
+
height: initial;
|
|
1125
|
+
box-sizing: border-box;
|
|
1126
|
+
padding: 3px 4px 2px 4px;
|
|
1127
|
+
margin: 0;
|
|
1128
|
+
}
|
|
1129
|
+
|
|
1130
|
+
.w-md-editor-toolbar {
|
|
1131
|
+
border-bottom: 1px solid var(--md-editor-box-shadow-color);
|
|
1132
|
+
background-color: var(--md-editor-background-color);
|
|
1133
|
+
padding: 3px;
|
|
1134
|
+
display: flex;
|
|
1135
|
+
justify-content: space-between;
|
|
1136
|
+
align-items: center;
|
|
1137
|
+
border-radius: 3px 3px 0 0;
|
|
1138
|
+
-webkit-user-select: none;
|
|
1139
|
+
-moz-user-select: none;
|
|
1140
|
+
user-select: none;
|
|
1141
|
+
flex-wrap: wrap;
|
|
1142
|
+
}
|
|
1143
|
+
.w-md-editor-toolbar.bottom {
|
|
1144
|
+
border-bottom: 0px;
|
|
1145
|
+
border-top: 1px solid var(--md-editor-box-shadow-color);
|
|
1146
|
+
border-radius: 0 0 3px 3px;
|
|
1147
|
+
}
|
|
1148
|
+
.w-md-editor-toolbar ul,
|
|
1149
|
+
.w-md-editor-toolbar li {
|
|
1150
|
+
margin: 0;
|
|
1151
|
+
padding: 0;
|
|
1152
|
+
list-style: none;
|
|
1153
|
+
line-height: normal;
|
|
1154
|
+
line-height: initial;
|
|
1155
|
+
}
|
|
1156
|
+
.w-md-editor-toolbar li {
|
|
1157
|
+
display: inline-block;
|
|
1158
|
+
font-size: 14px;
|
|
1159
|
+
}
|
|
1160
|
+
.w-md-editor-toolbar li + li {
|
|
1161
|
+
margin: 0;
|
|
1162
|
+
}
|
|
1163
|
+
.w-md-editor-toolbar li > button {
|
|
1164
|
+
border: none;
|
|
1165
|
+
height: 20px;
|
|
1166
|
+
line-height: 14px;
|
|
1167
|
+
background: none;
|
|
1168
|
+
padding: 4px;
|
|
1169
|
+
margin: 0 1px;
|
|
1170
|
+
border-radius: 2px;
|
|
1171
|
+
text-transform: none;
|
|
1172
|
+
font-weight: normal;
|
|
1173
|
+
overflow: visible;
|
|
1174
|
+
outline: none;
|
|
1175
|
+
cursor: pointer;
|
|
1176
|
+
transition: all 0.3s;
|
|
1177
|
+
white-space: nowrap;
|
|
1178
|
+
color: var(--color-fg-default);
|
|
1179
|
+
}
|
|
1180
|
+
.w-md-editor-toolbar li > button:hover,
|
|
1181
|
+
.w-md-editor-toolbar li > button:focus {
|
|
1182
|
+
background-color: var(--color-neutral-muted);
|
|
1183
|
+
color: var(--color-accent-fg);
|
|
1184
|
+
}
|
|
1185
|
+
.w-md-editor-toolbar li > button:active {
|
|
1186
|
+
background-color: var(--color-neutral-muted);
|
|
1187
|
+
color: var(--color-danger-fg);
|
|
1188
|
+
}
|
|
1189
|
+
.w-md-editor-toolbar li > button:disabled {
|
|
1190
|
+
color: var(--md-editor-box-shadow-color);
|
|
1191
|
+
cursor: not-allowed;
|
|
1192
|
+
}
|
|
1193
|
+
.w-md-editor-toolbar li > button:disabled:hover {
|
|
1194
|
+
background-color: transparent;
|
|
1195
|
+
color: var(--md-editor-box-shadow-color);
|
|
1196
|
+
}
|
|
1197
|
+
.w-md-editor-toolbar li.active > button {
|
|
1198
|
+
color: var(--color-accent-fg);
|
|
1199
|
+
background-color: var(--color-neutral-muted);
|
|
1200
|
+
}
|
|
1201
|
+
.w-md-editor-toolbar-divider {
|
|
1202
|
+
height: 14px;
|
|
1203
|
+
width: 1px;
|
|
1204
|
+
margin: -3px 3px 0 3px !important;
|
|
1205
|
+
vertical-align: middle;
|
|
1206
|
+
background-color: var(--md-editor-box-shadow-color);
|
|
1207
|
+
}
|
|
1208
|
+
|
|
1102
1209
|
.w-md-editor-area {
|
|
1103
1210
|
overflow: auto;
|
|
1104
1211
|
border-radius: 5px;
|
|
@@ -1238,113 +1345,6 @@ body[data-color-mode*='light'] {
|
|
|
1238
1345
|
color: var(--color-prettylights-syntax-markup-deleted-text, #82071e) !important;
|
|
1239
1346
|
}
|
|
1240
1347
|
|
|
1241
|
-
.w-md-editor-toolbar-child {
|
|
1242
|
-
position: absolute;
|
|
1243
|
-
border-radius: 3px;
|
|
1244
|
-
box-shadow: 0 0 0 1px var(--md-editor-box-shadow-color), 0 0 0 var(--md-editor-box-shadow-color), 0 1px 1px var(--md-editor-box-shadow-color);
|
|
1245
|
-
background-color: var(--md-editor-background-color);
|
|
1246
|
-
z-index: 1;
|
|
1247
|
-
display: none;
|
|
1248
|
-
}
|
|
1249
|
-
.w-md-editor-toolbar-child.active {
|
|
1250
|
-
display: block;
|
|
1251
|
-
}
|
|
1252
|
-
.w-md-editor-toolbar-child .w-md-editor-toolbar {
|
|
1253
|
-
border-bottom: 0;
|
|
1254
|
-
padding: 3px;
|
|
1255
|
-
border-radius: 3px;
|
|
1256
|
-
}
|
|
1257
|
-
.w-md-editor-toolbar-child .w-md-editor-toolbar ul > li {
|
|
1258
|
-
display: block;
|
|
1259
|
-
}
|
|
1260
|
-
.w-md-editor-toolbar-child .w-md-editor-toolbar ul > li button {
|
|
1261
|
-
width: -webkit-fill-available;
|
|
1262
|
-
height: auto;
|
|
1263
|
-
height: initial;
|
|
1264
|
-
box-sizing: border-box;
|
|
1265
|
-
padding: 3px 4px 2px 4px;
|
|
1266
|
-
margin: 0;
|
|
1267
|
-
}
|
|
1268
|
-
|
|
1269
|
-
.w-md-editor-toolbar {
|
|
1270
|
-
border-bottom: 1px solid var(--md-editor-box-shadow-color);
|
|
1271
|
-
background-color: var(--md-editor-background-color);
|
|
1272
|
-
padding: 3px;
|
|
1273
|
-
display: flex;
|
|
1274
|
-
justify-content: space-between;
|
|
1275
|
-
align-items: center;
|
|
1276
|
-
border-radius: 3px 3px 0 0;
|
|
1277
|
-
-webkit-user-select: none;
|
|
1278
|
-
-moz-user-select: none;
|
|
1279
|
-
user-select: none;
|
|
1280
|
-
flex-wrap: wrap;
|
|
1281
|
-
}
|
|
1282
|
-
.w-md-editor-toolbar.bottom {
|
|
1283
|
-
border-bottom: 0px;
|
|
1284
|
-
border-top: 1px solid var(--md-editor-box-shadow-color);
|
|
1285
|
-
border-radius: 0 0 3px 3px;
|
|
1286
|
-
}
|
|
1287
|
-
.w-md-editor-toolbar ul,
|
|
1288
|
-
.w-md-editor-toolbar li {
|
|
1289
|
-
margin: 0;
|
|
1290
|
-
padding: 0;
|
|
1291
|
-
list-style: none;
|
|
1292
|
-
line-height: normal;
|
|
1293
|
-
line-height: initial;
|
|
1294
|
-
}
|
|
1295
|
-
.w-md-editor-toolbar li {
|
|
1296
|
-
display: inline-block;
|
|
1297
|
-
font-size: 14px;
|
|
1298
|
-
}
|
|
1299
|
-
.w-md-editor-toolbar li + li {
|
|
1300
|
-
margin: 0;
|
|
1301
|
-
}
|
|
1302
|
-
.w-md-editor-toolbar li > button {
|
|
1303
|
-
border: none;
|
|
1304
|
-
height: 20px;
|
|
1305
|
-
line-height: 14px;
|
|
1306
|
-
background: none;
|
|
1307
|
-
padding: 4px;
|
|
1308
|
-
margin: 0 1px;
|
|
1309
|
-
border-radius: 2px;
|
|
1310
|
-
text-transform: none;
|
|
1311
|
-
font-weight: normal;
|
|
1312
|
-
overflow: visible;
|
|
1313
|
-
outline: none;
|
|
1314
|
-
cursor: pointer;
|
|
1315
|
-
transition: all 0.3s;
|
|
1316
|
-
white-space: nowrap;
|
|
1317
|
-
color: var(--color-fg-default);
|
|
1318
|
-
}
|
|
1319
|
-
.w-md-editor-toolbar li > button:hover,
|
|
1320
|
-
.w-md-editor-toolbar li > button:focus {
|
|
1321
|
-
background-color: var(--color-neutral-muted);
|
|
1322
|
-
color: var(--color-accent-fg);
|
|
1323
|
-
}
|
|
1324
|
-
.w-md-editor-toolbar li > button:active {
|
|
1325
|
-
background-color: var(--color-neutral-muted);
|
|
1326
|
-
color: var(--color-danger-fg);
|
|
1327
|
-
}
|
|
1328
|
-
.w-md-editor-toolbar li > button:disabled {
|
|
1329
|
-
color: var(--md-editor-box-shadow-color);
|
|
1330
|
-
cursor: not-allowed;
|
|
1331
|
-
}
|
|
1332
|
-
.w-md-editor-toolbar li > button:disabled:hover {
|
|
1333
|
-
background-color: transparent;
|
|
1334
|
-
color: var(--md-editor-box-shadow-color);
|
|
1335
|
-
}
|
|
1336
|
-
.w-md-editor-toolbar li.active > button {
|
|
1337
|
-
color: var(--color-accent-fg);
|
|
1338
|
-
background-color: var(--color-neutral-muted);
|
|
1339
|
-
}
|
|
1340
|
-
.w-md-editor-toolbar-divider {
|
|
1341
|
-
height: 14px;
|
|
1342
|
-
width: 1px;
|
|
1343
|
-
margin: -3px 3px 0 3px !important;
|
|
1344
|
-
vertical-align: middle;
|
|
1345
|
-
background-color: var(--md-editor-box-shadow-color);
|
|
1346
|
-
}
|
|
1347
|
-
|
|
1348
1348
|
.w-md-editor-bar {
|
|
1349
1349
|
position: absolute;
|
|
1350
1350
|
cursor: s-resize;
|