@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.
Files changed (124) hide show
  1. package/README.md +10 -2
  2. package/dist/mdeditor.css +107 -107
  3. package/dist/mdeditor.js +7858 -3897
  4. package/dist/mdeditor.min.css +1 -1
  5. package/dist/mdeditor.min.js +1 -1
  6. package/esm/Context.d.ts +1 -1
  7. package/esm/Editor.js +5 -5
  8. package/esm/Editor.nohighlight.js +4 -4
  9. package/esm/commands/bold.d.ts +1 -1
  10. package/esm/commands/bold.js +1 -1
  11. package/esm/commands/code.d.ts +1 -1
  12. package/esm/commands/code.js +1 -1
  13. package/esm/commands/comment.d.ts +1 -1
  14. package/esm/commands/comment.js +1 -1
  15. package/esm/commands/divider.d.ts +1 -1
  16. package/esm/commands/fullscreen.d.ts +1 -1
  17. package/esm/commands/group.d.ts +1 -1
  18. package/esm/commands/help.d.ts +1 -1
  19. package/esm/commands/hr.d.ts +1 -1
  20. package/esm/commands/hr.js +1 -1
  21. package/esm/commands/image.d.ts +1 -1
  22. package/esm/commands/image.js +1 -1
  23. package/esm/commands/index.cn.js +24 -24
  24. package/esm/commands/index.d.ts +1 -1
  25. package/esm/commands/index.js +25 -25
  26. package/esm/commands/issue.d.ts +1 -1
  27. package/esm/commands/issue.js +1 -1
  28. package/esm/commands/italic.d.ts +1 -1
  29. package/esm/commands/italic.js +1 -1
  30. package/esm/commands/link.d.ts +1 -1
  31. package/esm/commands/link.js +1 -1
  32. package/esm/commands/list.d.ts +1 -1
  33. package/esm/commands/list.js +1 -1
  34. package/esm/commands/preview.d.ts +1 -1
  35. package/esm/commands/quote.d.ts +1 -1
  36. package/esm/commands/quote.js +1 -1
  37. package/esm/commands/strikeThrough.js +1 -1
  38. package/esm/commands/table.js +1 -1
  39. package/esm/commands/title.js +2 -2
  40. package/esm/commands/title1.js +1 -1
  41. package/esm/commands/title2.js +1 -1
  42. package/esm/commands/title3.js +1 -1
  43. package/esm/commands/title4.js +1 -1
  44. package/esm/commands/title5.js +1 -1
  45. package/esm/commands/title6.js +1 -1
  46. package/esm/components/TextArea/Markdown.js +1 -1
  47. package/esm/components/TextArea/Textarea.js +4 -4
  48. package/esm/components/TextArea/handleKeyDown.js +3 -4
  49. package/esm/components/TextArea/index.d.ts +1 -1
  50. package/esm/components/TextArea/index.js +5 -5
  51. package/esm/components/TextArea/index.nohighlight.d.ts +1 -1
  52. package/esm/components/TextArea/index.nohighlight.js +4 -4
  53. package/esm/components/TextArea/shortcuts.d.ts +1 -1
  54. package/esm/components/Toolbar/Child.js +2 -2
  55. package/esm/components/Toolbar/index.d.ts +1 -1
  56. package/esm/components/Toolbar/index.js +2 -2
  57. package/esm/index.css +0 -1
  58. package/esm/index.d.ts +2 -2
  59. package/esm/index.js +10 -10
  60. package/esm/index.nohighlight.d.ts +2 -2
  61. package/esm/index.nohighlight.js +8 -8
  62. package/esm/utils/markdownUtils.d.ts +1 -2
  63. package/lib/Context.d.ts +1 -1
  64. package/lib/Editor.js +4 -4
  65. package/lib/Editor.nohighlight.js +3 -3
  66. package/lib/commands/bold.d.ts +1 -1
  67. package/lib/commands/code.d.ts +1 -1
  68. package/lib/commands/comment.d.ts +1 -1
  69. package/lib/commands/divider.d.ts +1 -1
  70. package/lib/commands/fullscreen.d.ts +1 -1
  71. package/lib/commands/group.d.ts +1 -1
  72. package/lib/commands/help.d.ts +1 -1
  73. package/lib/commands/hr.d.ts +1 -1
  74. package/lib/commands/image.d.ts +1 -1
  75. package/lib/commands/index.d.ts +1 -1
  76. package/lib/commands/issue.d.ts +1 -1
  77. package/lib/commands/italic.d.ts +1 -1
  78. package/lib/commands/link.d.ts +1 -1
  79. package/lib/commands/list.d.ts +1 -1
  80. package/lib/commands/preview.d.ts +1 -1
  81. package/lib/commands/quote.d.ts +1 -1
  82. package/lib/components/TextArea/Textarea.js +1 -1
  83. package/lib/components/TextArea/handleKeyDown.js +1 -1
  84. package/lib/components/TextArea/index.d.ts +1 -1
  85. package/lib/components/TextArea/index.js +1 -1
  86. package/lib/components/TextArea/index.nohighlight.d.ts +1 -1
  87. package/lib/components/TextArea/index.nohighlight.js +1 -1
  88. package/lib/components/TextArea/shortcuts.d.ts +1 -1
  89. package/lib/components/Toolbar/index.d.ts +1 -1
  90. package/lib/index.d.ts +2 -2
  91. package/lib/index.js +1 -1
  92. package/lib/index.nohighlight.d.ts +2 -2
  93. package/lib/index.nohighlight.js +1 -1
  94. package/lib/utils/markdownUtils.d.ts +1 -2
  95. package/markdown-editor.css +0 -1
  96. package/package.json +1 -1
  97. package/src/Context.tsx +1 -1
  98. package/src/Editor.nohighlight.tsx +3 -3
  99. package/src/Editor.tsx +4 -4
  100. package/src/commands/bold.tsx +1 -1
  101. package/src/commands/code.tsx +1 -1
  102. package/src/commands/comment.tsx +1 -1
  103. package/src/commands/divider.tsx +1 -1
  104. package/src/commands/fullscreen.tsx +2 -2
  105. package/src/commands/group.tsx +1 -1
  106. package/src/commands/help.tsx +1 -1
  107. package/src/commands/hr.tsx +1 -1
  108. package/src/commands/image.tsx +1 -1
  109. package/src/commands/index.ts +1 -1
  110. package/src/commands/issue.tsx +1 -1
  111. package/src/commands/italic.tsx +1 -1
  112. package/src/commands/link.tsx +1 -1
  113. package/src/commands/list.tsx +1 -1
  114. package/src/commands/preview.tsx +2 -2
  115. package/src/commands/quote.tsx +1 -1
  116. package/src/components/TextArea/Textarea.tsx +1 -1
  117. package/src/components/TextArea/handleKeyDown.tsx +1 -1
  118. package/src/components/TextArea/index.nohighlight.tsx +1 -1
  119. package/src/components/TextArea/index.tsx +1 -1
  120. package/src/components/TextArea/shortcuts.ts +1 -1
  121. package/src/components/Toolbar/index.tsx +1 -1
  122. package/src/index.nohighlight.tsx +2 -2
  123. package/src/index.tsx +2 -2
  124. 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
  [![Open in CodeSandbox](https://img.shields.io/badge/Open%20in-CodeSandbox-blue?logo=codesandbox)](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
- - `minHeights?: number=100`: Minimum drag height. The `visibleDragbar=true` value is valid.
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 Ianushkevich"><img src="https://avatars.githubusercontent.com/u/89025862?v=4" width="42;" alt="Dmitrii Ianushkevich"/></a>
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;