@uiw/react-md-editor 3.20.3 → 3.20.5
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/dist/mdeditor.css +2 -2
- package/dist/mdeditor.js +19 -20
- package/dist/mdeditor.min.css +1 -1
- package/dist/mdeditor.min.js +1 -1
- package/esm/commands/bold.js +7 -5
- package/esm/commands/bold.js.map +7 -5
- package/esm/commands/hr.js +1 -1
- package/esm/commands/hr.js.map +4 -3
- package/esm/commands/image.js +10 -5
- package/esm/commands/image.js.map +6 -2
- package/esm/commands/index.d.ts +4 -1
- package/esm/commands/index.js +4 -1
- package/esm/commands/index.js.map +2 -2
- package/esm/commands/italic.js +9 -6
- package/esm/commands/italic.js.map +7 -5
- package/esm/commands/link.js +7 -4
- package/esm/commands/link.js.map +7 -5
- package/esm/commands/strikeThrough.js +9 -6
- package/esm/commands/strikeThrough.js.map +7 -5
- package/esm/components/TextArea/index.css +2 -2
- package/esm/components/TextArea/index.less +2 -2
- package/lib/commands/bold.js +7 -5
- package/lib/commands/bold.js.map +7 -5
- package/lib/commands/hr.js +1 -1
- package/lib/commands/hr.js.map +4 -3
- package/lib/commands/image.js +10 -5
- package/lib/commands/image.js.map +6 -2
- package/lib/commands/index.d.ts +4 -1
- package/lib/commands/index.js +4 -1
- package/lib/commands/index.js.map +2 -2
- package/lib/commands/italic.js +9 -6
- package/lib/commands/italic.js.map +7 -5
- package/lib/commands/link.js +7 -4
- package/lib/commands/link.js.map +7 -5
- package/lib/commands/strikeThrough.js +9 -6
- package/lib/commands/strikeThrough.js.map +7 -5
- package/lib/components/TextArea/index.less +2 -2
- package/markdown-editor.css +2 -2
- package/package.json +1 -1
- package/src/commands/bold.tsx +9 -8
- package/src/commands/hr.tsx +3 -3
- package/src/commands/image.tsx +12 -9
- package/src/commands/index.ts +5 -2
- package/src/commands/italic.tsx +11 -10
- package/src/commands/link.tsx +8 -8
- package/src/commands/strikeThrough.tsx +11 -10
- package/src/components/TextArea/index.less +2 -2
package/src/commands/link.tsx
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { ICommand,
|
|
2
|
+
import { ICommand, ExecuteState, TextAreaTextApi } from './';
|
|
3
3
|
import { selectWord } from '../utils/markdownUtils';
|
|
4
4
|
|
|
5
5
|
export const link: ICommand = {
|
|
6
6
|
name: 'link',
|
|
7
7
|
keyCommand: 'link',
|
|
8
8
|
shortcuts: 'ctrlcmd+l',
|
|
9
|
-
value: '[](
|
|
9
|
+
value: '[{{text}}](URL Here)',
|
|
10
10
|
buttonProps: { 'aria-label': 'Add a link (ctrl + l)', title: 'Add a link (ctrl + l)' },
|
|
11
11
|
icon: (
|
|
12
12
|
<svg data-name="italic" width="12" height="12" role="img" viewBox="0 0 520 520">
|
|
@@ -16,16 +16,16 @@ export const link: ICommand = {
|
|
|
16
16
|
/>
|
|
17
17
|
</svg>
|
|
18
18
|
),
|
|
19
|
-
execute: (state:
|
|
19
|
+
execute: (state: ExecuteState, api: TextAreaTextApi) => {
|
|
20
20
|
// Adjust the selection to encompass the whole word if the caret is inside one
|
|
21
21
|
const newSelectionRange = selectWord({ text: state.text, selection: state.selection });
|
|
22
22
|
const state1 = api.setSelectionRange(newSelectionRange);
|
|
23
|
+
const val = state.command.value || '';
|
|
23
24
|
// Replaces the current selection with the bold mark up
|
|
24
|
-
|
|
25
|
+
api.replaceSelection(val.replace(/({{text}})/gi, state1.selectedText));
|
|
26
|
+
const start = state1.selection.start + val.indexOf('{{text}}');
|
|
27
|
+
const end = state1.selection.start + val.indexOf('{{text}}') + (state1.selection.end - state1.selection.start);
|
|
25
28
|
// Adjust the selection to not contain the **
|
|
26
|
-
api.setSelectionRange({
|
|
27
|
-
start: state2.selection.end - 6 - state1.selectedText.length,
|
|
28
|
-
end: state2.selection.end - 6,
|
|
29
|
-
});
|
|
29
|
+
api.setSelectionRange({ start, end });
|
|
30
30
|
},
|
|
31
31
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { ICommand,
|
|
2
|
+
import { ICommand, ExecuteState, TextAreaTextApi } from './';
|
|
3
3
|
import { selectWord } from '../utils/markdownUtils';
|
|
4
4
|
|
|
5
5
|
export const strikethrough: ICommand = {
|
|
@@ -10,7 +10,7 @@ export const strikethrough: ICommand = {
|
|
|
10
10
|
'aria-label': 'Add strikethrough text (ctrl + shift + x)',
|
|
11
11
|
title: 'Add strikethrough text (ctrl + shift + x)',
|
|
12
12
|
},
|
|
13
|
-
value: '~~',
|
|
13
|
+
value: '~~{{text}}~~',
|
|
14
14
|
icon: (
|
|
15
15
|
<svg data-name="strikethrough" width="12" height="12" role="img" viewBox="0 0 512 512">
|
|
16
16
|
<path
|
|
@@ -19,16 +19,17 @@ export const strikethrough: ICommand = {
|
|
|
19
19
|
/>
|
|
20
20
|
</svg>
|
|
21
21
|
),
|
|
22
|
-
execute: (state:
|
|
22
|
+
execute: (state: ExecuteState, api: TextAreaTextApi) => {
|
|
23
23
|
// Adjust the selection to encompass the whole word if the caret is inside one
|
|
24
24
|
const newSelectionRange = selectWord({ text: state.text, selection: state.selection });
|
|
25
25
|
const state1 = api.setSelectionRange(newSelectionRange);
|
|
26
|
-
// Replaces the current selection with the
|
|
27
|
-
const
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
26
|
+
// Replaces the current selection with the bold mark up
|
|
27
|
+
const val = state.command.value || '';
|
|
28
|
+
api.replaceSelection(val.replace(/({{text}})/gi, state1.selectedText));
|
|
29
|
+
|
|
30
|
+
const start = state1.selection.start + val.indexOf('{{text}}');
|
|
31
|
+
const end = state1.selection.start + val.indexOf('{{text}}') + (state1.selection.end - state1.selection.start);
|
|
32
|
+
// Adjust the selection to not contain the **
|
|
33
|
+
api.setSelectionRange({ start, end });
|
|
33
34
|
},
|
|
34
35
|
};
|