@lofcz/platejs-math 52.3.6 → 53.4.10
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.
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import { ElementApi, KEYS, bindFirst, createSlatePlugin } from "platejs";
|
|
2
|
+
import "katex/dist/katex.min.css";
|
|
3
|
+
|
|
4
|
+
//#region src/lib/transforms/insertEquation.ts
|
|
5
|
+
const insertEquation = (editor, options) => {
|
|
6
|
+
editor.tf.insertNodes({
|
|
7
|
+
children: [{ text: "" }],
|
|
8
|
+
texExpression: "",
|
|
9
|
+
type: editor.getType(KEYS.equation)
|
|
10
|
+
}, options);
|
|
11
|
+
};
|
|
12
|
+
|
|
13
|
+
//#endregion
|
|
14
|
+
//#region src/lib/transforms/insertInlineEquation.ts
|
|
15
|
+
const insertInlineEquation = (editor, texExpression, options) => {
|
|
16
|
+
editor.tf.insertNodes({
|
|
17
|
+
children: [{ text: "" }],
|
|
18
|
+
texExpression: texExpression ?? editor.api.string(editor.selection),
|
|
19
|
+
type: editor.getType(KEYS.inlineEquation)
|
|
20
|
+
}, options);
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
//#endregion
|
|
24
|
+
//#region src/lib/getEquationExpression.internal.ts
|
|
25
|
+
const getEquationExpression = (element) => typeof element.texExpression === "string" || typeof element.texExpression === "number" || typeof element.texExpression === "boolean" ? String(element.texExpression) : "";
|
|
26
|
+
|
|
27
|
+
//#endregion
|
|
28
|
+
//#region src/lib/withEquation.internal.ts
|
|
29
|
+
const withEquation = ({ editor, tf: { normalizeNode }, type }) => ({ transforms: { normalizeNode(entry) {
|
|
30
|
+
const [node, path] = entry;
|
|
31
|
+
if (ElementApi.isElement(node) && node.type === type && typeof node.texExpression !== "string") {
|
|
32
|
+
editor.tf.setNodes({ texExpression: getEquationExpression({ texExpression: node.texExpression }) }, { at: path });
|
|
33
|
+
return;
|
|
34
|
+
}
|
|
35
|
+
return normalizeNode(entry);
|
|
36
|
+
} } });
|
|
37
|
+
|
|
38
|
+
//#endregion
|
|
39
|
+
//#region src/lib/BaseEquationPlugin.ts
|
|
40
|
+
const BaseEquationPlugin = createSlatePlugin({
|
|
41
|
+
key: KEYS.equation,
|
|
42
|
+
node: {
|
|
43
|
+
isElement: true,
|
|
44
|
+
isVoid: true
|
|
45
|
+
},
|
|
46
|
+
parsers: { html: { deserializer: { toNodeProps: ({ element }) => ({ texExpression: element.getAttribute("data-slate-tex-expression") ?? "" }) } } }
|
|
47
|
+
}).overrideEditor(withEquation).extendEditorTransforms(({ editor }) => ({ insert: { equation: bindFirst(insertEquation, editor) } }));
|
|
48
|
+
|
|
49
|
+
//#endregion
|
|
50
|
+
//#region src/lib/BaseInlineEquationPlugin.ts
|
|
51
|
+
const BaseInlineEquationPlugin = createSlatePlugin({
|
|
52
|
+
key: KEYS.inlineEquation,
|
|
53
|
+
node: {
|
|
54
|
+
isElement: true,
|
|
55
|
+
isInline: true,
|
|
56
|
+
isVoid: true
|
|
57
|
+
},
|
|
58
|
+
parsers: { html: { deserializer: { toNodeProps: ({ element }) => ({ texExpression: element.getAttribute("data-slate-tex-expression") ?? "" }) } } }
|
|
59
|
+
}).overrideEditor(withEquation).extendEditorTransforms(({ editor }) => ({ insert: { inlineEquation: bindFirst(insertInlineEquation, editor) } }));
|
|
60
|
+
|
|
61
|
+
//#endregion
|
|
62
|
+
export { insertEquation as a, insertInlineEquation as i, BaseEquationPlugin as n, getEquationExpression as r, BaseInlineEquationPlugin as t };
|
package/dist/index.d.ts
CHANGED
|
@@ -17,6 +17,20 @@ declare const BaseInlineEquationPlugin: platejs3.SlatePlugin<platejs3.PluginConf
|
|
|
17
17
|
};
|
|
18
18
|
}, {}>>;
|
|
19
19
|
//#endregion
|
|
20
|
+
//#region src/lib/MathRules.d.ts
|
|
21
|
+
declare const MathRules: {
|
|
22
|
+
markdown: (options: {
|
|
23
|
+
variant: "$";
|
|
24
|
+
enabled?: ((context: platejs3.SelectionInputRuleContext<SlateEditor> | platejs3.InsertTextInputRuleContext<SlateEditor> | platejs3.InsertBreakInputRuleContext<SlateEditor> | platejs3.InsertDataInputRuleContext<SlateEditor>) => boolean) | undefined;
|
|
25
|
+
priority?: number | undefined;
|
|
26
|
+
} | {
|
|
27
|
+
on: "break" | "match";
|
|
28
|
+
variant: "$$";
|
|
29
|
+
enabled?: ((context: platejs3.SelectionInputRuleContext<SlateEditor> | platejs3.InsertTextInputRuleContext<SlateEditor> | platejs3.InsertBreakInputRuleContext<SlateEditor> | platejs3.InsertDataInputRuleContext<SlateEditor>) => boolean) | undefined;
|
|
30
|
+
priority?: number | undefined;
|
|
31
|
+
}) => platejs3.AnyInputRule<unknown>;
|
|
32
|
+
};
|
|
33
|
+
//#endregion
|
|
20
34
|
//#region src/lib/transforms/insertEquation.d.ts
|
|
21
35
|
declare const insertEquation: (editor: SlateEditor, options?: InsertNodesOptions) => void;
|
|
22
36
|
//#endregion
|
|
@@ -32,4 +46,4 @@ declare const getEquationHtml: ({
|
|
|
32
46
|
options?: KatexOptions;
|
|
33
47
|
}) => string;
|
|
34
48
|
//#endregion
|
|
35
|
-
export { BaseEquationPlugin, BaseInlineEquationPlugin, getEquationHtml, insertEquation, insertInlineEquation };
|
|
49
|
+
export { BaseEquationPlugin, BaseInlineEquationPlugin, MathRules, getEquationHtml, insertEquation, insertInlineEquation };
|
package/dist/index.js
CHANGED
|
@@ -1,8 +1,65 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { a as insertEquation, i as insertInlineEquation, n as BaseEquationPlugin, r as getEquationExpression, t as BaseInlineEquationPlugin } from "./BaseInlineEquationPlugin-BtcwMqRJ.js";
|
|
2
|
+
import { KEYS, createRuleFactory, matchDelimitedInline } from "platejs";
|
|
2
3
|
import katex from "katex";
|
|
3
4
|
|
|
5
|
+
//#region src/lib/MathRules.ts
|
|
6
|
+
const INLINE_BOUNDARY_RE = /[\s([{'"`]/;
|
|
7
|
+
const INLINE_FOLLOW_RE = /[\s)\]}:;,.!?'"`]/;
|
|
8
|
+
const isEquationInputBlocked = (editor) => editor.api.some({ match: { type: [
|
|
9
|
+
editor.getType(KEYS.codeBlock),
|
|
10
|
+
editor.getType(KEYS.equation),
|
|
11
|
+
editor.getType(KEYS.inlineEquation)
|
|
12
|
+
] } });
|
|
13
|
+
const getInlineEquationMatch = (context) => {
|
|
14
|
+
const match = matchDelimitedInline(context, {
|
|
15
|
+
boundaryRe: INLINE_BOUNDARY_RE,
|
|
16
|
+
followRe: INLINE_FOLLOW_RE,
|
|
17
|
+
open: "$",
|
|
18
|
+
requireClosingDelimiter: false,
|
|
19
|
+
trim: "reject"
|
|
20
|
+
});
|
|
21
|
+
if (!match) return;
|
|
22
|
+
return {
|
|
23
|
+
deleteRange: match.deleteRange,
|
|
24
|
+
texExpression: match.content
|
|
25
|
+
};
|
|
26
|
+
};
|
|
27
|
+
const MathRules = { markdown: createRuleFactory((options) => options.variant === "$$" ? {
|
|
28
|
+
type: "blockFence",
|
|
29
|
+
fence: "$$",
|
|
30
|
+
block: KEYS.p,
|
|
31
|
+
on: options.on,
|
|
32
|
+
enabled: ({ editor }) => !isEquationInputBlocked(editor),
|
|
33
|
+
priority: 100,
|
|
34
|
+
apply: ({ editor }, match) => {
|
|
35
|
+
const blockMatch = match;
|
|
36
|
+
editor.tf.removeNodes({ at: blockMatch.path });
|
|
37
|
+
insertEquation(editor, {
|
|
38
|
+
at: blockMatch.path,
|
|
39
|
+
select: true
|
|
40
|
+
});
|
|
41
|
+
return true;
|
|
42
|
+
}
|
|
43
|
+
} : {
|
|
44
|
+
type: "insertText",
|
|
45
|
+
enabled: ({ editor }) => !isEquationInputBlocked(editor),
|
|
46
|
+
trigger: "$",
|
|
47
|
+
resolve: (context) => {
|
|
48
|
+
if (context.text !== "$" || context.options?.at) return;
|
|
49
|
+
return getInlineEquationMatch(context);
|
|
50
|
+
},
|
|
51
|
+
apply: ({ editor }, match) => {
|
|
52
|
+
const inlineMatch = match;
|
|
53
|
+
editor.tf.delete({ at: inlineMatch.deleteRange });
|
|
54
|
+
editor.tf.select(inlineMatch.deleteRange.anchor);
|
|
55
|
+
insertInlineEquation(editor, inlineMatch.texExpression);
|
|
56
|
+
return true;
|
|
57
|
+
}
|
|
58
|
+
}) };
|
|
59
|
+
|
|
60
|
+
//#endregion
|
|
4
61
|
//#region src/lib/utils/getEquationHtml.ts
|
|
5
|
-
const getEquationHtml = ({ element, options }) => katex.renderToString(element
|
|
62
|
+
const getEquationHtml = ({ element, options }) => katex.renderToString(getEquationExpression(element), options);
|
|
6
63
|
|
|
7
64
|
//#endregion
|
|
8
|
-
export { BaseEquationPlugin, BaseInlineEquationPlugin, getEquationHtml, insertEquation, insertInlineEquation };
|
|
65
|
+
export { BaseEquationPlugin, BaseInlineEquationPlugin, MathRules, getEquationHtml, insertEquation, insertInlineEquation };
|
package/dist/react/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { n as BaseEquationPlugin, t as BaseInlineEquationPlugin } from "../BaseInlineEquationPlugin-
|
|
1
|
+
import { n as BaseEquationPlugin, r as getEquationExpression, t as BaseInlineEquationPlugin } from "../BaseInlineEquationPlugin-BtcwMqRJ.js";
|
|
2
2
|
import { isHotkey } from "platejs";
|
|
3
3
|
import katex from "katex";
|
|
4
4
|
import { toPlatePlugin, useEditorRef, useElement } from "platejs/react";
|
|
@@ -16,7 +16,7 @@ const InlineEquationPlugin = toPlatePlugin(BaseInlineEquationPlugin);
|
|
|
16
16
|
const useEquationElement = ({ element, katexRef, options }) => {
|
|
17
17
|
React.useEffect(() => {
|
|
18
18
|
if (!katexRef.current) return;
|
|
19
|
-
katex.render(element
|
|
19
|
+
katex.render(getEquationExpression(element), katexRef.current, options);
|
|
20
20
|
}, [element.texExpression]);
|
|
21
21
|
};
|
|
22
22
|
|
|
@@ -26,14 +26,14 @@ const useEquationInput = ({ isInline, open, onClose }) => {
|
|
|
26
26
|
const editor = useEditorRef();
|
|
27
27
|
const element = useElement();
|
|
28
28
|
const inputRef = useRef(null);
|
|
29
|
-
const [expressionInput, setExpressionInput] = React.useState(element
|
|
30
|
-
const initialExpressionRef = useRef(element
|
|
29
|
+
const [expressionInput, setExpressionInput] = React.useState(getEquationExpression(element));
|
|
30
|
+
const initialExpressionRef = useRef(getEquationExpression(element));
|
|
31
31
|
useEffect(() => {
|
|
32
32
|
if (open) setTimeout(() => {
|
|
33
33
|
if (inputRef.current) {
|
|
34
34
|
inputRef.current.focus();
|
|
35
35
|
inputRef.current.select();
|
|
36
|
-
if (isInline) initialExpressionRef.current = element
|
|
36
|
+
if (isInline) initialExpressionRef.current = getEquationExpression(element);
|
|
37
37
|
}
|
|
38
38
|
}, 0);
|
|
39
39
|
}, [open]);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lofcz/platejs-math",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "53.4.10",
|
|
4
4
|
"description": "Math plugin for Plate",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"plate",
|
|
@@ -35,10 +35,10 @@
|
|
|
35
35
|
"devDependencies": {
|
|
36
36
|
"@types/katex": "0.16.7",
|
|
37
37
|
"@plate/scripts": "1.0.0",
|
|
38
|
-
"platejs": "npm:@lofcz/platejs@
|
|
38
|
+
"platejs": "npm:@lofcz/platejs@53.4.9"
|
|
39
39
|
},
|
|
40
40
|
"peerDependencies": {
|
|
41
|
-
"platejs": ">=
|
|
41
|
+
"platejs": ">=53.0.0",
|
|
42
42
|
"react": ">=18.0.0",
|
|
43
43
|
"react-dom": ">=18.0.0"
|
|
44
44
|
},
|
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
import { KEYS, bindFirst, createSlatePlugin } from "platejs";
|
|
2
|
-
import "katex/dist/katex.min.css";
|
|
3
|
-
|
|
4
|
-
//#region src/lib/transforms/insertEquation.ts
|
|
5
|
-
const insertEquation = (editor, options) => {
|
|
6
|
-
editor.tf.insertNodes({
|
|
7
|
-
children: [{ text: "" }],
|
|
8
|
-
texExpression: "",
|
|
9
|
-
type: editor.getType(KEYS.equation)
|
|
10
|
-
}, options);
|
|
11
|
-
};
|
|
12
|
-
|
|
13
|
-
//#endregion
|
|
14
|
-
//#region src/lib/transforms/insertInlineEquation.ts
|
|
15
|
-
const insertInlineEquation = (editor, texExpression, options) => {
|
|
16
|
-
editor.tf.insertNodes({
|
|
17
|
-
children: [{ text: "" }],
|
|
18
|
-
texExpression: texExpression ?? editor.api.string(editor.selection),
|
|
19
|
-
type: editor.getType(KEYS.inlineEquation)
|
|
20
|
-
}, options);
|
|
21
|
-
};
|
|
22
|
-
|
|
23
|
-
//#endregion
|
|
24
|
-
//#region src/lib/BaseEquationPlugin.ts
|
|
25
|
-
const BaseEquationPlugin = createSlatePlugin({
|
|
26
|
-
key: KEYS.equation,
|
|
27
|
-
node: {
|
|
28
|
-
isElement: true,
|
|
29
|
-
isVoid: true
|
|
30
|
-
}
|
|
31
|
-
}).extendEditorTransforms(({ editor }) => ({ insert: { equation: bindFirst(insertEquation, editor) } }));
|
|
32
|
-
|
|
33
|
-
//#endregion
|
|
34
|
-
//#region src/lib/BaseInlineEquationPlugin.ts
|
|
35
|
-
const BaseInlineEquationPlugin = createSlatePlugin({
|
|
36
|
-
key: KEYS.inlineEquation,
|
|
37
|
-
node: {
|
|
38
|
-
isElement: true,
|
|
39
|
-
isInline: true,
|
|
40
|
-
isVoid: true
|
|
41
|
-
}
|
|
42
|
-
}).extendEditorTransforms(({ editor }) => ({ insert: { inlineEquation: bindFirst(insertInlineEquation, editor) } }));
|
|
43
|
-
|
|
44
|
-
//#endregion
|
|
45
|
-
export { insertEquation as i, BaseEquationPlugin as n, insertInlineEquation as r, BaseInlineEquationPlugin as t };
|