x-star-editor 0.2.3 → 0.2.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/components/Toolbar.d.ts +3 -3
- package/dist/components/Toolbar.js +91 -91
- package/dist/icons/EditOnly.d.ts +4 -0
- package/dist/icons/EditOnly.js +15 -0
- package/dist/icons/Help.d.ts +4 -0
- package/dist/icons/Help.js +26 -0
- package/dist/icons/Mermaid.d.ts +4 -0
- package/dist/icons/Mermaid.js +15 -0
- package/dist/icons/TaskList.d.ts +4 -0
- package/dist/icons/TaskList.js +24 -0
- package/dist/icons/ViewOnly.d.ts +4 -0
- package/dist/icons/ViewOnly.js +15 -0
- package/dist/index.d.ts +2 -1
- package/dist/locales/en_US.d.ts +5 -0
- package/dist/locales/en_US.js +6 -1
- package/dist/locales/index.d.ts +20 -0
- package/dist/locales/zh_CN.d.ts +5 -0
- package/dist/locales/zh_CN.js +6 -1
- package/dist/utils/container.js +14 -14
- package/dist/utils/history.d.ts +3 -1
- package/dist/utils/history.js +17 -13
- package/dist/utils/markdown.d.ts +6 -14
- package/dist/utils/markdown.js +72 -137
- package/dist/utils/rehype/rehype-line.d.ts +6 -0
- package/dist/utils/rehype/rehype-line.js +17 -0
- package/dist/utils/rehype/rehype-math.d.ts +13 -0
- package/dist/utils/rehype/rehype-math.js +167 -0
- package/dist/utils/rehype/rehype-raw-positions.d.ts +6 -0
- package/dist/utils/rehype/rehype-raw-positions.js +30 -0
- package/dist/x-star-md-editor/index.js +2 -5
- package/dist/x-star-md-viewer/index.js +8 -22
- package/package.json +4 -2
package/dist/locales/zh_CN.d.ts
CHANGED
|
@@ -11,24 +11,29 @@ declare const _default: {
|
|
|
11
11
|
readonly blockquote: "引用";
|
|
12
12
|
readonly code: "代码块";
|
|
13
13
|
readonly delete: "删除线";
|
|
14
|
+
readonly editOnly: "仅编辑";
|
|
14
15
|
readonly emphasis: "斜体";
|
|
15
16
|
readonly enterFullscreen: "进入全屏";
|
|
16
17
|
readonly exitFullscreen: "退出全屏";
|
|
17
18
|
readonly heading: "标题";
|
|
19
|
+
readonly help: "帮助";
|
|
18
20
|
readonly image: "图片";
|
|
19
21
|
readonly inlineCode: "行内代码";
|
|
20
22
|
readonly inlineMath: "行内公式";
|
|
21
23
|
readonly link: "链接";
|
|
22
24
|
readonly math: "公式块";
|
|
25
|
+
readonly mermaid: "Mermaid";
|
|
23
26
|
readonly orderedList: "有序列表";
|
|
24
27
|
readonly redo: "恢复";
|
|
25
28
|
readonly strong: "粗体";
|
|
26
29
|
readonly table: "表格";
|
|
30
|
+
readonly taskList: "任务列表";
|
|
27
31
|
readonly thematicBreak: "分隔线";
|
|
28
32
|
readonly toHTML: "转成 HTML";
|
|
29
33
|
readonly toMarkdown: "转成 Markdown";
|
|
30
34
|
readonly undo: "撤销";
|
|
31
35
|
readonly unorderedList: "无序列表";
|
|
36
|
+
readonly viewOnly: "仅查看";
|
|
32
37
|
};
|
|
33
38
|
};
|
|
34
39
|
export default _default;
|
package/dist/locales/zh_CN.js
CHANGED
|
@@ -11,23 +11,28 @@ export default {
|
|
|
11
11
|
blockquote: '引用',
|
|
12
12
|
code: '代码块',
|
|
13
13
|
delete: '删除线',
|
|
14
|
+
editOnly: '仅编辑',
|
|
14
15
|
emphasis: '斜体',
|
|
15
16
|
enterFullscreen: '进入全屏',
|
|
16
17
|
exitFullscreen: '退出全屏',
|
|
17
18
|
heading: '标题',
|
|
19
|
+
help: '帮助',
|
|
18
20
|
image: '图片',
|
|
19
21
|
inlineCode: '行内代码',
|
|
20
22
|
inlineMath: '行内公式',
|
|
21
23
|
link: '链接',
|
|
22
24
|
math: '公式块',
|
|
25
|
+
mermaid: 'Mermaid',
|
|
23
26
|
orderedList: '有序列表',
|
|
24
27
|
redo: '恢复',
|
|
25
28
|
strong: '粗体',
|
|
26
29
|
table: '表格',
|
|
30
|
+
taskList: '任务列表',
|
|
27
31
|
thematicBreak: '分隔线',
|
|
28
32
|
toHTML: '转成 HTML',
|
|
29
33
|
toMarkdown: '转成 Markdown',
|
|
30
34
|
undo: '撤销',
|
|
31
|
-
unorderedList: '无序列表'
|
|
35
|
+
unorderedList: '无序列表',
|
|
36
|
+
viewOnly: '仅查看'
|
|
32
37
|
}
|
|
33
38
|
};
|
package/dist/utils/container.js
CHANGED
|
@@ -141,28 +141,28 @@ export var useContainer = function useContainer(ref) {
|
|
|
141
141
|
/**
|
|
142
142
|
* 将一棵 DOM 树更新为另一棵 DOM 树
|
|
143
143
|
*
|
|
144
|
-
* @param newNode 新节点
|
|
145
144
|
* @param oldNode 旧节点
|
|
145
|
+
* @param newNode 新节点
|
|
146
146
|
*/
|
|
147
|
-
var diff = function diff(
|
|
148
|
-
var newChild = newNode.firstChild;
|
|
147
|
+
var diff = function diff(oldNode, newNode) {
|
|
149
148
|
var oldChild = oldNode.firstChild;
|
|
149
|
+
var newChild = newNode.firstChild;
|
|
150
150
|
|
|
151
151
|
// 依次更新子节点
|
|
152
|
-
for (;
|
|
153
|
-
var newNext = newChild.nextSibling;
|
|
152
|
+
for (; oldChild && newChild;) {
|
|
154
153
|
var oldNext = oldChild.nextSibling;
|
|
155
|
-
|
|
154
|
+
var newNext = newChild.nextSibling;
|
|
155
|
+
if (oldChild.nodeName !== newChild.nodeName) {
|
|
156
156
|
// 节点名称不同,直接替换
|
|
157
157
|
oldChild.replaceWith(newChild);
|
|
158
|
-
} else if (
|
|
158
|
+
} else if (oldChild.nodeType === Node.TEXT_NODE) {
|
|
159
159
|
// 节点均为文本类型,更新文本内容
|
|
160
|
-
if (
|
|
160
|
+
if (oldChild.nodeValue !== newChild.nodeValue) {
|
|
161
161
|
oldChild.nodeValue = newChild.nodeValue;
|
|
162
162
|
}
|
|
163
163
|
} else {
|
|
164
164
|
// 节点名称相同,更新属性和子节点
|
|
165
|
-
if (
|
|
165
|
+
if (oldChild instanceof HTMLElement && newChild instanceof HTMLElement) {
|
|
166
166
|
var _iterator = _createForOfIteratorHelper(oldChild.getAttributeNames()),
|
|
167
167
|
_step;
|
|
168
168
|
try {
|
|
@@ -183,9 +183,9 @@ export var useContainer = function useContainer(ref) {
|
|
|
183
183
|
try {
|
|
184
184
|
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
|
|
185
185
|
var newAttrName = _step2.value;
|
|
186
|
-
var newAttrValue = newChild.getAttribute(newAttrName);
|
|
187
186
|
var oldAttrValue = oldChild.getAttribute(newAttrName);
|
|
188
|
-
|
|
187
|
+
var newAttrValue = newChild.getAttribute(newAttrName);
|
|
188
|
+
if (oldAttrValue !== newAttrValue && newAttrValue !== null) {
|
|
189
189
|
oldChild.setAttribute(newAttrName, newAttrValue);
|
|
190
190
|
}
|
|
191
191
|
}
|
|
@@ -195,10 +195,10 @@ export var useContainer = function useContainer(ref) {
|
|
|
195
195
|
_iterator2.f();
|
|
196
196
|
}
|
|
197
197
|
}
|
|
198
|
-
diff(
|
|
198
|
+
diff(oldChild, newChild);
|
|
199
199
|
}
|
|
200
|
-
newChild = newNext;
|
|
201
200
|
oldChild = oldNext;
|
|
201
|
+
newChild = newNext;
|
|
202
202
|
}
|
|
203
203
|
|
|
204
204
|
// 移除节点
|
|
@@ -215,7 +215,7 @@ export var useContainer = function useContainer(ref) {
|
|
|
215
215
|
newChild = _newNext;
|
|
216
216
|
}
|
|
217
217
|
};
|
|
218
|
-
diff(editorRender(text)
|
|
218
|
+
diff(ref.current, editorRender(text));
|
|
219
219
|
};
|
|
220
220
|
|
|
221
221
|
/**
|
package/dist/utils/history.d.ts
CHANGED
|
@@ -28,7 +28,9 @@ export interface ToggleAction {
|
|
|
28
28
|
type: 'blockquote' | 'delete' | 'emphasis' | 'inlineCode' | 'inlineMath' | 'math' | 'strong' | 'thematicBreak';
|
|
29
29
|
} | {
|
|
30
30
|
type: 'code';
|
|
31
|
-
|
|
31
|
+
lang: string;
|
|
32
|
+
value: string;
|
|
33
|
+
showLineNumbers: boolean;
|
|
32
34
|
} | {
|
|
33
35
|
type: 'heading';
|
|
34
36
|
depth: 1 | 2 | 3 | 4 | 5 | 6;
|
package/dist/utils/history.js
CHANGED
|
@@ -97,10 +97,14 @@ var stateReducer = function stateReducer(_ref, action) {
|
|
|
97
97
|
}
|
|
98
98
|
case 'code':
|
|
99
99
|
{
|
|
100
|
-
var
|
|
100
|
+
var _action$payload2 = action.payload,
|
|
101
|
+
lang = _action$payload2.lang,
|
|
102
|
+
value = _action$payload2.value,
|
|
103
|
+
showLineNumbers = _action$payload2.showLineNumbers;
|
|
104
|
+
var _startOffset = lineEndOffset + lang.length + (showLineNumbers ? 21 : 5);
|
|
101
105
|
return {
|
|
102
|
-
sourceCode: "".concat(sourceCode.slice(0, lineEndOffset), "\n```").concat(
|
|
103
|
-
selection: createSelection(
|
|
106
|
+
sourceCode: "".concat(sourceCode.slice(0, lineEndOffset), "\n```").concat(lang).concat(showLineNumbers ? ' showLineNumbers' : '', "\n").concat(value, "\n```\n").concat(lineAfter),
|
|
107
|
+
selection: createSelection(_startOffset, _startOffset + value.length)
|
|
104
108
|
};
|
|
105
109
|
}
|
|
106
110
|
case 'delete':
|
|
@@ -139,9 +143,9 @@ var stateReducer = function stateReducer(_ref, action) {
|
|
|
139
143
|
});
|
|
140
144
|
});
|
|
141
145
|
for (var _i3 = 0; _i3 < _values.length; _i3++) {
|
|
142
|
-
var
|
|
143
|
-
if (
|
|
144
|
-
_lines[_i3] = _lines[_i3].replace(new RegExp("^ {0,3}#{".concat(
|
|
146
|
+
var _value = _values[_i3];
|
|
147
|
+
if (_value) {
|
|
148
|
+
_lines[_i3] = _lines[_i3].replace(new RegExp("^ {0,3}#{".concat(_value, "} +")), '');
|
|
145
149
|
}
|
|
146
150
|
}
|
|
147
151
|
if (_values.some(function (value) {
|
|
@@ -160,10 +164,10 @@ var stateReducer = function stateReducer(_ref, action) {
|
|
|
160
164
|
case 'image':
|
|
161
165
|
case 'link':
|
|
162
166
|
{
|
|
163
|
-
var _action$
|
|
164
|
-
_type = _action$
|
|
165
|
-
url = _action$
|
|
166
|
-
description = _action$
|
|
167
|
+
var _action$payload3 = action.payload,
|
|
168
|
+
_type = _action$payload3.type,
|
|
169
|
+
url = _action$payload3.url,
|
|
170
|
+
description = _action$payload3.description;
|
|
167
171
|
return {
|
|
168
172
|
sourceCode: "".concat(before).concat(_type === 'link' ? '' : '!', "[").concat(description, "](").concat(url, ")").concat(after),
|
|
169
173
|
selection: createSelection(startOffset + url.length + description.length + 4 + (_type === 'link' ? 0 : 1))
|
|
@@ -192,9 +196,9 @@ var stateReducer = function stateReducer(_ref, action) {
|
|
|
192
196
|
}
|
|
193
197
|
case 'set':
|
|
194
198
|
{
|
|
195
|
-
var _action$
|
|
196
|
-
_sourceCode = _action$
|
|
197
|
-
selection = _action$
|
|
199
|
+
var _action$payload4 = action.payload,
|
|
200
|
+
_sourceCode = _action$payload4.sourceCode,
|
|
201
|
+
selection = _action$payload4.selection;
|
|
198
202
|
return {
|
|
199
203
|
sourceCode: _sourceCode.replace(/\r\n?/g, '\n'),
|
|
200
204
|
selection: selection
|
package/dist/utils/markdown.d.ts
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
import type { Root as HastRoot } from 'hast';
|
|
2
3
|
import { defaultSchema } from 'rehype-sanitize';
|
|
3
4
|
import type { ViewerOptions } from '../x-star-md-viewer';
|
|
4
5
|
/**
|
|
@@ -8,21 +9,13 @@ import type { ViewerOptions } from '../x-star-md-viewer';
|
|
|
8
9
|
* @returns DOM 树
|
|
9
10
|
*/
|
|
10
11
|
export declare const editorRender: (sourceCode: string) => HTMLDivElement;
|
|
11
|
-
/**
|
|
12
|
-
* 将 Mdast 树转成 Hast 树的处理器
|
|
13
|
-
*/
|
|
14
|
-
declare const toHastProcessor: import("unified").FrozenProcessor<import("mdast").Root, import("hast").Root, import("hast").Root, void>;
|
|
15
|
-
/**
|
|
16
|
-
* Hast 根节点
|
|
17
|
-
*/
|
|
18
|
-
export type HastRoot = Awaited<ReturnType<(typeof toHastProcessor)['run']>>;
|
|
19
12
|
/**
|
|
20
13
|
* 将 Markdown 文本转成 Hast 树
|
|
21
14
|
*
|
|
22
15
|
* @param sourceCode Markdown 文本
|
|
23
16
|
* @returns Hast 树
|
|
24
17
|
*/
|
|
25
|
-
export declare const preViewerRender: (sourceCode: string) => Promise<
|
|
18
|
+
export declare const preViewerRender: (sourceCode: string) => Promise<HastRoot>;
|
|
26
19
|
/**
|
|
27
20
|
* 过滤模式
|
|
28
21
|
*/
|
|
@@ -35,7 +28,7 @@ export declare const getDefaultSchema: () => Schema;
|
|
|
35
28
|
* @param schema 过滤模式
|
|
36
29
|
* @returns 新的 Hast 树
|
|
37
30
|
*/
|
|
38
|
-
export declare const viewerRender: (root: HastRoot, schema: Schema) =>
|
|
31
|
+
export declare const viewerRender: (root: HastRoot, schema: Schema) => HastRoot;
|
|
39
32
|
/**
|
|
40
33
|
* 将 Hast 树映射到 React 虚拟 DOM 树
|
|
41
34
|
*
|
|
@@ -50,19 +43,18 @@ export declare const postViewerRender: (root: HastRoot, options: ViewerOptions)
|
|
|
50
43
|
* @param sourceCode Markdown 文本
|
|
51
44
|
* @returns HTML 文本
|
|
52
45
|
*/
|
|
53
|
-
export declare const toHTML: (sourceCode: string) =>
|
|
46
|
+
export declare const toHTML: (sourceCode: string) => string;
|
|
54
47
|
/**
|
|
55
48
|
* 将带有 HTML 的 Markdown 文本转成 Markdown 文本
|
|
56
49
|
*
|
|
57
50
|
* @param sourceCode 带有 HTML 的 Markdown 文本
|
|
58
51
|
* @returns Markdown 文本
|
|
59
52
|
*/
|
|
60
|
-
export declare const toMarkdown: (sourceCode: string) =>
|
|
53
|
+
export declare const toMarkdown: (sourceCode: string) => string;
|
|
61
54
|
/**
|
|
62
55
|
* 将 Markdown 文本转成纯文本
|
|
63
56
|
*
|
|
64
57
|
* @param sourceCode Markdown 文本
|
|
65
58
|
* @returns 纯文本
|
|
66
59
|
*/
|
|
67
|
-
export declare const toText: (sourceCode: string) =>
|
|
68
|
-
export {};
|
|
60
|
+
export declare const toText: (sourceCode: string) => string;
|
package/dist/utils/markdown.js
CHANGED
|
@@ -5,12 +5,13 @@ import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
|
|
|
5
5
|
import _createForOfIteratorHelper from "@babel/runtime/helpers/esm/createForOfIteratorHelper";
|
|
6
6
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
7
7
|
import { toJsxRuntime } from 'hast-util-to-jsx-runtime';
|
|
8
|
+
import { toText as hastToText } from 'hast-util-to-text';
|
|
8
9
|
import { Fragment, jsx, jsxs } from 'react/jsx-runtime';
|
|
9
10
|
import rehypeKatex from 'rehype-katex';
|
|
10
11
|
import rehypeMermaid from 'rehype-mermaidjs';
|
|
11
12
|
import rehypePrism from 'rehype-prism-plus';
|
|
12
13
|
import rehypeRaw from 'rehype-raw';
|
|
13
|
-
import rehypeRemark from 'rehype-remark';
|
|
14
|
+
import rehypeRemark, { defaultHandlers } from 'rehype-remark';
|
|
14
15
|
import rehypeSanitize, { defaultSchema } from 'rehype-sanitize';
|
|
15
16
|
import rehypeStringify from 'rehype-stringify';
|
|
16
17
|
import remarkBreaks from 'remark-breaks';
|
|
@@ -22,16 +23,15 @@ import remarkStringify from 'remark-stringify';
|
|
|
22
23
|
import strip from 'strip-markdown';
|
|
23
24
|
import { unified } from 'unified';
|
|
24
25
|
import { prefix } from "./global";
|
|
26
|
+
import rehypeLine from "./rehype/rehype-line";
|
|
27
|
+
import rehypeMath, { isMathNode } from "./rehype/rehype-math";
|
|
28
|
+
import rehypeRawPositions from "./rehype/rehype-raw-positions";
|
|
25
29
|
|
|
26
30
|
/**
|
|
27
31
|
* 将 Markdown 文本解析为 Mdast 树的处理器
|
|
28
32
|
*/
|
|
29
33
|
var toMdastProcessor = unified().use(remarkParse).use(remarkGfm).use(remarkMath).freeze();
|
|
30
34
|
|
|
31
|
-
/**
|
|
32
|
-
* Mdast 根节点
|
|
33
|
-
*/
|
|
34
|
-
|
|
35
35
|
/**
|
|
36
36
|
* 带缓存的解析函数
|
|
37
37
|
*
|
|
@@ -46,10 +46,6 @@ var cachedParse = function () {
|
|
|
46
46
|
};
|
|
47
47
|
}();
|
|
48
48
|
|
|
49
|
-
/**
|
|
50
|
-
* Mdast 节点
|
|
51
|
-
*/
|
|
52
|
-
|
|
53
49
|
/**
|
|
54
50
|
* 将 Markdown 文本映射到 DOM 树,第一层为 `<div>` 块元素,第二层为 `<div>` 行元素,之后均为 `<span>` 元素
|
|
55
51
|
*
|
|
@@ -194,10 +190,10 @@ export var editorRender = function editorRender(sourceCode) {
|
|
|
194
190
|
_step;
|
|
195
191
|
try {
|
|
196
192
|
for (_iterator.s(); !(_step = _iterator.n()).done;) {
|
|
197
|
-
var _node$position, _node$position2;
|
|
193
|
+
var _node$position, _node$position$start, _node$position2, _node$position2$end;
|
|
198
194
|
var node = _step.value;
|
|
199
|
-
var startOffset = (_node$position = node.position) === null || _node$position === void 0 ? void 0 : _node$position.start.offset;
|
|
200
|
-
var endOffset = (_node$position2 = node.position) === null || _node$position2 === void 0 ? void 0 : _node$position2.end.offset;
|
|
195
|
+
var startOffset = (_node$position = node.position) === null || _node$position === void 0 ? void 0 : (_node$position$start = _node$position.start) === null || _node$position$start === void 0 ? void 0 : _node$position$start.offset;
|
|
196
|
+
var endOffset = (_node$position2 = node.position) === null || _node$position2 === void 0 ? void 0 : (_node$position2$end = _node$position2.end) === null || _node$position2$end === void 0 ? void 0 : _node$position2$end.offset;
|
|
201
197
|
if (startOffset === undefined || endOffset === undefined) {
|
|
202
198
|
continue;
|
|
203
199
|
}
|
|
@@ -227,11 +223,12 @@ export var editorRender = function editorRender(sourceCode) {
|
|
|
227
223
|
if (stack.length > 1) {
|
|
228
224
|
pushElement(stack.length - 1);
|
|
229
225
|
} else {
|
|
230
|
-
var _node$position3;
|
|
226
|
+
var _node$position3, _node$position3$start;
|
|
231
227
|
// 如果栈大小为 1,说明为块级元素终点
|
|
232
228
|
stack[0].element.append("\u200B");
|
|
233
229
|
pushElement(0);
|
|
234
|
-
|
|
230
|
+
// 记录行号,用于同步滚动
|
|
231
|
+
block.dataset.line = "".concat((_node$position3 = node.position) === null || _node$position3 === void 0 ? void 0 : (_node$position3$start = _node$position3.start) === null || _node$position3$start === void 0 ? void 0 : _node$position3$start.line);
|
|
235
232
|
pushBlock();
|
|
236
233
|
scanOffset++;
|
|
237
234
|
}
|
|
@@ -278,11 +275,7 @@ var toHastProcessor = unified().use(remarkBreaks).use(remarkRehype, {
|
|
|
278
275
|
strategy: 'img-svg'
|
|
279
276
|
}).use(rehypePrism, {
|
|
280
277
|
ignoreMissing: true
|
|
281
|
-
}).
|
|
282
|
-
|
|
283
|
-
/**
|
|
284
|
-
* Hast 根节点
|
|
285
|
-
*/
|
|
278
|
+
}).freeze();
|
|
286
279
|
|
|
287
280
|
/**
|
|
288
281
|
* 将 Markdown 文本转成 Hast 树
|
|
@@ -340,43 +333,9 @@ export var getDefaultSchema = function getDefaultSchema() {
|
|
|
340
333
|
* @param schema 过滤模式
|
|
341
334
|
* @returns 新的 Hast 树
|
|
342
335
|
*/
|
|
343
|
-
export var viewerRender =
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
while (1) switch (_context2.prev = _context2.next) {
|
|
347
|
-
case 0:
|
|
348
|
-
_context2.next = 2;
|
|
349
|
-
return unified().use(rehypeRaw).use(rehypeSanitize, schema).use(function () {
|
|
350
|
-
return function (root) {
|
|
351
|
-
var _iterator2 = _createForOfIteratorHelper(root.children),
|
|
352
|
-
_step2;
|
|
353
|
-
try {
|
|
354
|
-
for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
|
|
355
|
-
var node = _step2.value;
|
|
356
|
-
if ('properties' in node && node.properties) {
|
|
357
|
-
var _node$position4;
|
|
358
|
-
node.properties['data-line'] = (_node$position4 = node.position) === null || _node$position4 === void 0 ? void 0 : _node$position4.start.line;
|
|
359
|
-
}
|
|
360
|
-
}
|
|
361
|
-
} catch (err) {
|
|
362
|
-
_iterator2.e(err);
|
|
363
|
-
} finally {
|
|
364
|
-
_iterator2.f();
|
|
365
|
-
}
|
|
366
|
-
};
|
|
367
|
-
}).run(root);
|
|
368
|
-
case 2:
|
|
369
|
-
return _context2.abrupt("return", _context2.sent);
|
|
370
|
-
case 3:
|
|
371
|
-
case "end":
|
|
372
|
-
return _context2.stop();
|
|
373
|
-
}
|
|
374
|
-
}, _callee2);
|
|
375
|
-
}));
|
|
376
|
-
return function viewerRender(_x2, _x3) {
|
|
377
|
-
return _ref2.apply(this, arguments);
|
|
378
|
-
};
|
|
379
|
-
}();
|
|
336
|
+
export var viewerRender = function viewerRender(root, schema) {
|
|
337
|
+
return unified().use(rehypeRawPositions).use(rehypeRaw).use(rehypeMath).use(rehypeSanitize, schema).use(rehypeLine).runSync(root);
|
|
338
|
+
};
|
|
380
339
|
|
|
381
340
|
/**
|
|
382
341
|
* 将 Hast 树映射到 React 虚拟 DOM 树
|
|
@@ -386,25 +345,35 @@ export var viewerRender = /*#__PURE__*/function () {
|
|
|
386
345
|
* @returns React 虚拟 DOM 树
|
|
387
346
|
*/
|
|
388
347
|
export var postViewerRender = function postViewerRender(root, options) {
|
|
389
|
-
|
|
348
|
+
var components = _objectSpread(_objectSpread({}, options.customHTMLElements), {}, {
|
|
349
|
+
custom: function custom(props) {
|
|
350
|
+
var _options$customBlocks;
|
|
351
|
+
return jsx((_options$customBlocks = options.customBlocks[props.meta]) !== null && _options$customBlocks !== void 0 ? _options$customBlocks : 'div', {
|
|
352
|
+
children: props.value
|
|
353
|
+
});
|
|
354
|
+
}
|
|
355
|
+
});
|
|
356
|
+
return toJsxRuntime(unified().use(rehypeKatex).runSync(root), {
|
|
390
357
|
Fragment: Fragment,
|
|
391
358
|
jsx: jsx,
|
|
392
359
|
jsxs: jsxs,
|
|
393
|
-
components:
|
|
394
|
-
custom: function custom(_ref3) {
|
|
395
|
-
var _options$customBlocks;
|
|
396
|
-
var meta = _ref3.meta,
|
|
397
|
-
value = _ref3.value;
|
|
398
|
-
return jsx((_options$customBlocks = options.customBlocks[meta]) !== null && _options$customBlocks !== void 0 ? _options$customBlocks : 'div', {
|
|
399
|
-
children: value
|
|
400
|
-
});
|
|
401
|
-
}
|
|
402
|
-
})
|
|
360
|
+
components: components
|
|
403
361
|
});
|
|
404
362
|
};
|
|
405
|
-
var toHTMLProcessor = unified().use(remarkParse).use(remarkGfm).use(remarkRehype, {
|
|
406
|
-
allowDangerousHtml: true
|
|
407
|
-
|
|
363
|
+
var toHTMLProcessor = unified().use(remarkParse).use(remarkGfm).use(remarkMath).use(remarkRehype, {
|
|
364
|
+
allowDangerousHtml: true,
|
|
365
|
+
handlers: {
|
|
366
|
+
math: function math(h, node) {
|
|
367
|
+
return (
|
|
368
|
+
// 如果 Math 节点的 `meta` 属性不为空,则视为自定义块
|
|
369
|
+
node.meta ? h(node.position, 'custom', {
|
|
370
|
+
meta: node.meta,
|
|
371
|
+
value: node.value
|
|
372
|
+
}) : h(node, 'div')
|
|
373
|
+
);
|
|
374
|
+
}
|
|
375
|
+
}
|
|
376
|
+
}).use(rehypeRawPositions).use(rehypeRaw).use(rehypeMath).use(rehypeStringify).freeze();
|
|
408
377
|
|
|
409
378
|
/**
|
|
410
379
|
* 将 Markdown 文本转成 HTML 文本
|
|
@@ -412,28 +381,26 @@ var toHTMLProcessor = unified().use(remarkParse).use(remarkGfm).use(remarkRehype
|
|
|
412
381
|
* @param sourceCode Markdown 文本
|
|
413
382
|
* @returns HTML 文本
|
|
414
383
|
*/
|
|
415
|
-
export var toHTML =
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
while (1) switch (_context3.prev = _context3.next) {
|
|
419
|
-
case 0:
|
|
420
|
-
_context3.next = 2;
|
|
421
|
-
return toHTMLProcessor.process(sourceCode);
|
|
422
|
-
case 2:
|
|
423
|
-
return _context3.abrupt("return", _context3.sent.toString());
|
|
424
|
-
case 3:
|
|
425
|
-
case "end":
|
|
426
|
-
return _context3.stop();
|
|
427
|
-
}
|
|
428
|
-
}, _callee3);
|
|
429
|
-
}));
|
|
430
|
-
return function toHTML(_x4) {
|
|
431
|
-
return _ref4.apply(this, arguments);
|
|
432
|
-
};
|
|
433
|
-
}();
|
|
384
|
+
export var toHTML = function toHTML(sourceCode) {
|
|
385
|
+
return toHTMLProcessor.processSync(sourceCode).toString();
|
|
386
|
+
};
|
|
434
387
|
var toMarkdownProcessor = unified().use(rehypeRemark, {
|
|
435
|
-
newlines: true
|
|
436
|
-
|
|
388
|
+
newlines: true,
|
|
389
|
+
handlers: {
|
|
390
|
+
div: function div(h, node) {
|
|
391
|
+
return isMathNode(node) ? h(node, 'math', hastToText(node)) : defaultHandlers.div(h, node);
|
|
392
|
+
},
|
|
393
|
+
span: function span(h, node) {
|
|
394
|
+
return isMathNode(node) ? h(node, 'inlineMath', hastToText(node)) : defaultHandlers.span(h, node);
|
|
395
|
+
},
|
|
396
|
+
custom: function custom(h, node) {
|
|
397
|
+
var _node$properties, _node$properties2;
|
|
398
|
+
return h(node, 'math', {
|
|
399
|
+
meta: (_node$properties = node.properties) === null || _node$properties === void 0 ? void 0 : _node$properties.meta
|
|
400
|
+
}, (_node$properties2 = node.properties) === null || _node$properties2 === void 0 ? void 0 : _node$properties2.value);
|
|
401
|
+
}
|
|
402
|
+
}
|
|
403
|
+
}).use(remarkMath).use(remarkGfm).use(remarkStringify).freeze();
|
|
437
404
|
|
|
438
405
|
/**
|
|
439
406
|
* 将带有 HTML 的 Markdown 文本转成 Markdown 文本
|
|
@@ -441,33 +408,17 @@ var toMarkdownProcessor = unified().use(rehypeRemark, {
|
|
|
441
408
|
* @param sourceCode 带有 HTML 的 Markdown 文本
|
|
442
409
|
* @returns Markdown 文本
|
|
443
410
|
*/
|
|
444
|
-
export var toMarkdown =
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
_context4.next = 7;
|
|
456
|
-
return _context4.t1.run.call(_context4.t1, _context4.t2);
|
|
457
|
-
case 7:
|
|
458
|
-
_context4.t3 = _context4.sent;
|
|
459
|
-
return _context4.abrupt("return", _context4.t0.stringify.call(_context4.t0, _context4.t3));
|
|
460
|
-
case 9:
|
|
461
|
-
case "end":
|
|
462
|
-
return _context4.stop();
|
|
463
|
-
}
|
|
464
|
-
}, _callee4);
|
|
465
|
-
}));
|
|
466
|
-
return function toMarkdown(_x5) {
|
|
467
|
-
return _ref5.apply(this, arguments);
|
|
468
|
-
};
|
|
469
|
-
}();
|
|
470
|
-
var toTextProcessor = unified().use(remarkParse).use(remarkGfm).use(strip).use(remarkStringify).freeze();
|
|
411
|
+
export var toMarkdown = function toMarkdown(sourceCode) {
|
|
412
|
+
return toMarkdownProcessor.stringify(toMarkdownProcessor.runSync(toHTMLProcessor.runSync(toHTMLProcessor.parse(sourceCode))));
|
|
413
|
+
};
|
|
414
|
+
var toTextProcessor = unified().use(remarkParse).use(remarkGfm).use(remarkMath).use(strip, {
|
|
415
|
+
remove: ['math', ['inlineMath', function (node) {
|
|
416
|
+
return {
|
|
417
|
+
type: 'text',
|
|
418
|
+
value: node.value
|
|
419
|
+
};
|
|
420
|
+
}]]
|
|
421
|
+
}).use(remarkStringify).freeze();
|
|
471
422
|
|
|
472
423
|
/**
|
|
473
424
|
* 将 Markdown 文本转成纯文本
|
|
@@ -475,22 +426,6 @@ var toTextProcessor = unified().use(remarkParse).use(remarkGfm).use(strip).use(r
|
|
|
475
426
|
* @param sourceCode Markdown 文本
|
|
476
427
|
* @returns 纯文本
|
|
477
428
|
*/
|
|
478
|
-
export var toText =
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
while (1) switch (_context5.prev = _context5.next) {
|
|
482
|
-
case 0:
|
|
483
|
-
_context5.next = 2;
|
|
484
|
-
return toTextProcessor.process(sourceCode);
|
|
485
|
-
case 2:
|
|
486
|
-
return _context5.abrupt("return", _context5.sent.toString());
|
|
487
|
-
case 3:
|
|
488
|
-
case "end":
|
|
489
|
-
return _context5.stop();
|
|
490
|
-
}
|
|
491
|
-
}, _callee5);
|
|
492
|
-
}));
|
|
493
|
-
return function toText(_x6) {
|
|
494
|
-
return _ref6.apply(this, arguments);
|
|
495
|
-
};
|
|
496
|
-
}();
|
|
429
|
+
export var toText = function toText(sourceCode) {
|
|
430
|
+
return toTextProcessor.processSync(sourceCode).toString();
|
|
431
|
+
};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { SKIP, visit } from 'unist-util-visit';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* 为第一层 Hast 节点添加行号属性
|
|
5
|
+
*/
|
|
6
|
+
var rehypeLine = function rehypeLine() {
|
|
7
|
+
return function (root) {
|
|
8
|
+
return visit(root, 'element', function (node) {
|
|
9
|
+
var _node$properties, _node$position, _node$position$start;
|
|
10
|
+
(_node$properties = node.properties) !== null && _node$properties !== void 0 ? _node$properties : node.properties = {};
|
|
11
|
+
// 记录行号,用于同步滚动
|
|
12
|
+
node.properties['data-line'] = (_node$position = node.position) === null || _node$position === void 0 ? void 0 : (_node$position$start = _node$position.start) === null || _node$position$start === void 0 ? void 0 : _node$position$start.line;
|
|
13
|
+
return SKIP;
|
|
14
|
+
});
|
|
15
|
+
};
|
|
16
|
+
};
|
|
17
|
+
export default rehypeLine;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { RootContent as HastNode, Root as HastRoot } from 'hast';
|
|
2
|
+
/**
|
|
3
|
+
* 判断一个 Hast 节点是否属于行内公式或公式块
|
|
4
|
+
*
|
|
5
|
+
* @param node Hast 节点
|
|
6
|
+
* @returns 是否属于行内公式或公式块
|
|
7
|
+
*/
|
|
8
|
+
export declare const isMathNode: (node: HastRoot | HastNode) => boolean | undefined;
|
|
9
|
+
/**
|
|
10
|
+
* 解析属于 Raw 节点的文本中的数学公式
|
|
11
|
+
*/
|
|
12
|
+
declare const rehypeMath: () => (root: HastRoot) => void;
|
|
13
|
+
export default rehypeMath;
|