@liqvid/katex 0.0.3 → 0.0.4
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 +1 -29
- package/dist/{index.js → index.cjs} +71 -27
- package/dist/index.d.ts +67 -0
- package/dist/index.mjs +31 -31
- package/dist/{plain.js → plain.cjs} +6 -5
- package/dist/{types/plain.d.ts → plain.d.ts} +6 -3
- package/dist/plain.mjs +5 -4
- package/package.json +15 -20
- package/dist/types/RenderGroup.d.ts +0 -18
- package/dist/types/fancy.d.ts +0 -17
- package/dist/types/index.d.ts +0 -7
- package/dist/types/loading.d.ts +0 -6
package/README.md
CHANGED
|
@@ -1,31 +1,3 @@
|
|
|
1
1
|
# @liqvid/katex
|
|
2
2
|
|
|
3
|
-
[KaTeX](https://katex.org/) integration for [Liqvid](https://liqvidjs.org).
|
|
4
|
-
|
|
5
|
-
## Usage
|
|
6
|
-
|
|
7
|
-
```tsx
|
|
8
|
-
import {KTX} from "@liqvid/katex";
|
|
9
|
-
|
|
10
|
-
function Quadratic() {
|
|
11
|
-
return (
|
|
12
|
-
<div>
|
|
13
|
-
The value of <KTX>x</KTX> is given by the quadratic formula
|
|
14
|
-
<KTX display>{String.raw`x = \frac{-b \pm \sqrt{b^2 - 4ac}}{2a}`}</KTX>
|
|
15
|
-
</div>
|
|
16
|
-
);
|
|
17
|
-
}
|
|
18
|
-
```
|
|
19
|
-
|
|
20
|
-
## Macros
|
|
21
|
-
|
|
22
|
-
For convenience, this module supports loading macro definitions from a file. Simply include a `<script type="math/tex">` tag in the `<head>` of your html, pointing to a tex file containing `\newcommand`s.
|
|
23
|
-
|
|
24
|
-
```html
|
|
25
|
-
<!-- this has to go in <head> -->
|
|
26
|
-
<script src="./macros.tex" type="math/tex"></script>
|
|
27
|
-
```
|
|
28
|
-
```tex
|
|
29
|
-
% macros.tex
|
|
30
|
-
\newcommand{\C}{\mathbb C}
|
|
31
|
-
```
|
|
3
|
+
[KaTeX](https://katex.org/) integration for [Liqvid](https://liqvidjs.org). See https://liqvidjs.org/docs/integrations/katex/ for documentation.
|
|
@@ -2,33 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var jsxRuntime_js = require('react/jsx-runtime.js');
|
|
6
6
|
var react$1 = require('@liqvid/utils/react');
|
|
7
7
|
var liqvid = require('liqvid');
|
|
8
8
|
var react = require('react');
|
|
9
|
-
var plain = require('./plain');
|
|
10
|
-
|
|
11
|
-
/** Component for KaTeX code */
|
|
12
|
-
const KTX = react.forwardRef(function KTX(props, ref) {
|
|
13
|
-
const { obstruct = "canplay canplaythrough", reparse = false, ...attrs } = props;
|
|
14
|
-
const plain$1 = react.useRef();
|
|
15
|
-
const combined = react$1.combineRefs(plain$1, ref);
|
|
16
|
-
const player = liqvid.usePlayer();
|
|
17
|
-
react.useEffect(() => {
|
|
18
|
-
// obstruction
|
|
19
|
-
if (obstruct.match(/\bcanplay\b/)) {
|
|
20
|
-
player.obstruct("canplay", plain$1.current.ready);
|
|
21
|
-
}
|
|
22
|
-
if (obstruct.match("canplaythrough")) {
|
|
23
|
-
player.obstruct("canplaythrough", plain$1.current.ready);
|
|
24
|
-
}
|
|
25
|
-
// reparsing
|
|
26
|
-
if (reparse) {
|
|
27
|
-
plain$1.current.ready.then(() => player.reparseTree(plain$1.current.domElement));
|
|
28
|
-
}
|
|
29
|
-
}, []);
|
|
30
|
-
return (jsxRuntime.jsx(plain.KTX, { ref: combined, ...attrs }));
|
|
31
|
-
});
|
|
32
9
|
|
|
33
10
|
// option of loading KaTeX asynchronously
|
|
34
11
|
const KaTeXLoad = new Promise((resolve) => {
|
|
@@ -61,8 +38,9 @@ const KaTeXMacros = new Promise((resolve) => {
|
|
|
61
38
|
*/
|
|
62
39
|
const KaTeXReady = Promise.all([KaTeXLoad, KaTeXMacros]);
|
|
63
40
|
/**
|
|
64
|
-
Parse \newcommand macros in a file.
|
|
65
|
-
Also supports \ktxnewcommand (for use in conjunction with MathJax).
|
|
41
|
+
* Parse \newcommand macros in a file.
|
|
42
|
+
* Also supports \ktxnewcommand (for use in conjunction with MathJax).
|
|
43
|
+
* @param file TeX file to parse
|
|
66
44
|
*/
|
|
67
45
|
function parseMacros(file) {
|
|
68
46
|
const macros = {};
|
|
@@ -94,6 +72,72 @@ function parseMacros(file) {
|
|
|
94
72
|
return macros;
|
|
95
73
|
}
|
|
96
74
|
|
|
75
|
+
/** Component for KaTeX code */
|
|
76
|
+
const KTX$1 = react.forwardRef(function KTX(props, ref) {
|
|
77
|
+
const spanRef = react.useRef();
|
|
78
|
+
const { children, display = false, ...attrs } = props;
|
|
79
|
+
const [ready, resolve] = react$1.usePromise();
|
|
80
|
+
// handle
|
|
81
|
+
react.useImperativeHandle(ref, () => ({
|
|
82
|
+
domElement: spanRef.current,
|
|
83
|
+
ready
|
|
84
|
+
}));
|
|
85
|
+
react.useEffect(() => {
|
|
86
|
+
KaTeXReady.then(([katex, macros]) => {
|
|
87
|
+
katex.render(children.toString(), spanRef.current, {
|
|
88
|
+
displayMode: !!display,
|
|
89
|
+
macros,
|
|
90
|
+
strict: "ignore",
|
|
91
|
+
throwOnError: false,
|
|
92
|
+
trust: true
|
|
93
|
+
});
|
|
94
|
+
/* move katex into placeholder element */
|
|
95
|
+
const child = spanRef.current.firstElementChild;
|
|
96
|
+
// copy classes
|
|
97
|
+
for (let i = 0, len = child.classList.length; i < len; ++i) {
|
|
98
|
+
spanRef.current.classList.add(child.classList.item(i));
|
|
99
|
+
}
|
|
100
|
+
// move children
|
|
101
|
+
while (child.childNodes.length > 0) {
|
|
102
|
+
spanRef.current.appendChild(child.firstChild);
|
|
103
|
+
}
|
|
104
|
+
// delete child
|
|
105
|
+
child.remove();
|
|
106
|
+
// resolve promise
|
|
107
|
+
resolve();
|
|
108
|
+
});
|
|
109
|
+
}, [children]);
|
|
110
|
+
// Google Chrome fails without this
|
|
111
|
+
if (display) {
|
|
112
|
+
if (!attrs.style)
|
|
113
|
+
attrs.style = {};
|
|
114
|
+
attrs.style.display = "block";
|
|
115
|
+
}
|
|
116
|
+
return (jsxRuntime_js.jsx("span", { ...attrs, ref: spanRef }));
|
|
117
|
+
});
|
|
118
|
+
|
|
119
|
+
/** Component for KaTeX code */
|
|
120
|
+
const KTX = react.forwardRef(function KTX(props, ref) {
|
|
121
|
+
const { obstruct = "canplay canplaythrough", reparse = false, ...attrs } = props;
|
|
122
|
+
const plain = react.useRef();
|
|
123
|
+
const combined = react$1.combineRefs(plain, ref);
|
|
124
|
+
const player = liqvid.usePlayer();
|
|
125
|
+
react.useEffect(() => {
|
|
126
|
+
// obstruction
|
|
127
|
+
if (obstruct.match(/\bcanplay\b/)) {
|
|
128
|
+
player.obstruct("canplay", plain.current.ready);
|
|
129
|
+
}
|
|
130
|
+
if (obstruct.match("canplaythrough")) {
|
|
131
|
+
player.obstruct("canplaythrough", plain.current.ready);
|
|
132
|
+
}
|
|
133
|
+
// reparsing
|
|
134
|
+
if (reparse) {
|
|
135
|
+
plain.current.ready.then(() => player.reparseTree(plain.current.domElement));
|
|
136
|
+
}
|
|
137
|
+
}, []);
|
|
138
|
+
return (jsxRuntime_js.jsx(KTX$1, { ref: combined, ...attrs }));
|
|
139
|
+
});
|
|
140
|
+
|
|
97
141
|
/**
|
|
98
142
|
* Wait for several things to be rendered
|
|
99
143
|
*/
|
|
@@ -143,7 +187,7 @@ const RenderGroup = react.forwardRef(function RenderGroup(props, ref) {
|
|
|
143
187
|
* @param node Element to check
|
|
144
188
|
*/
|
|
145
189
|
function shouldInspect(node) {
|
|
146
|
-
return react.isValidElement(node) && typeof node.type === "object" && (node.type === KTX || node.type ===
|
|
190
|
+
return react.isValidElement(node) && typeof node.type === "object" && (node.type === KTX || node.type === KTX$1);
|
|
147
191
|
}
|
|
148
192
|
/**
|
|
149
193
|
* Find least common ancestor of an array of elements
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import * as react from 'react';
|
|
3
|
+
import * as katex from 'katex';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* KTX element API
|
|
7
|
+
*/
|
|
8
|
+
interface Handle$1 {
|
|
9
|
+
/** The underlying <span> element */
|
|
10
|
+
domElement: HTMLSpanElement;
|
|
11
|
+
/** Promise that resolves once typesetting is finished */
|
|
12
|
+
ready: Promise<void>;
|
|
13
|
+
}
|
|
14
|
+
interface Props$2 extends React.HTMLAttributes<HTMLSpanElement> {
|
|
15
|
+
/**
|
|
16
|
+
* Whether to render in display style
|
|
17
|
+
* @default false
|
|
18
|
+
*/
|
|
19
|
+
display?: boolean;
|
|
20
|
+
}
|
|
21
|
+
/** Component for KaTeX code */
|
|
22
|
+
declare const KTX$1: react.ForwardRefExoticComponent<Props$2 & react.RefAttributes<Handle$1>>;
|
|
23
|
+
|
|
24
|
+
interface Props$1 extends React.ComponentProps<typeof KTX$1> {
|
|
25
|
+
/**
|
|
26
|
+
* Player events to obstruct
|
|
27
|
+
* @default "canplay canplaythrough"
|
|
28
|
+
*/
|
|
29
|
+
obstruct?: string;
|
|
30
|
+
/**
|
|
31
|
+
* Whether to reparse descendants for `during()` and `from()`
|
|
32
|
+
* @default false
|
|
33
|
+
*/
|
|
34
|
+
reparse?: boolean;
|
|
35
|
+
}
|
|
36
|
+
/** Component for KaTeX code */
|
|
37
|
+
declare const KTX: react.ForwardRefExoticComponent<Pick<Props$1, "hidden" | "color" | "style" | "display" | "translate" | "slot" | "title" | "children" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "obstruct" | "reparse"> & react.RefAttributes<Handle$1>>;
|
|
38
|
+
|
|
39
|
+
/**
|
|
40
|
+
* Ready Promise
|
|
41
|
+
*/
|
|
42
|
+
declare const KaTeXReady: Promise<[typeof katex, {
|
|
43
|
+
[key: string]: string;
|
|
44
|
+
}]>;
|
|
45
|
+
|
|
46
|
+
/** RenderGroup element API */
|
|
47
|
+
interface Handle {
|
|
48
|
+
/** Promise that resolves once all KTX descendants have finished typesetting */
|
|
49
|
+
ready: Promise<void>;
|
|
50
|
+
}
|
|
51
|
+
interface Props {
|
|
52
|
+
/**
|
|
53
|
+
* Whether to reparse descendants for `during()` and `from()`
|
|
54
|
+
* @default false
|
|
55
|
+
*/
|
|
56
|
+
reparse?: boolean;
|
|
57
|
+
}
|
|
58
|
+
/**
|
|
59
|
+
* Wait for several things to be rendered
|
|
60
|
+
*/
|
|
61
|
+
declare const RenderGroup: react.ForwardRefExoticComponent<Props & react.RefAttributes<Handle>>;
|
|
62
|
+
|
|
63
|
+
declare global {
|
|
64
|
+
const katex: typeof katex;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
export { Handle$1 as Handle, KTX, KaTeXReady, RenderGroup };
|
package/dist/index.mjs
CHANGED
|
@@ -1,30 +1,7 @@
|
|
|
1
|
-
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import {
|
|
1
|
+
import { jsx } from 'react/jsx-runtime.js';
|
|
2
|
+
import { usePromise, combineRefs, recursiveMap } from '@liqvid/utils/react';
|
|
3
3
|
import { usePlayer } from 'liqvid';
|
|
4
|
-
import { forwardRef, useRef,
|
|
5
|
-
import { KTX as KTX$2 } from './plain.mjs';
|
|
6
|
-
|
|
7
|
-
/** Component for KaTeX code */
|
|
8
|
-
const KTX$1 = forwardRef(function KTX(props, ref) {
|
|
9
|
-
const { obstruct = "canplay canplaythrough", reparse = false, ...attrs } = props;
|
|
10
|
-
const plain = useRef();
|
|
11
|
-
const combined = combineRefs(plain, ref);
|
|
12
|
-
const player = usePlayer();
|
|
13
|
-
useEffect(() => {
|
|
14
|
-
// obstruction
|
|
15
|
-
if (obstruct.match(/\bcanplay\b/)) {
|
|
16
|
-
player.obstruct("canplay", plain.current.ready);
|
|
17
|
-
}
|
|
18
|
-
if (obstruct.match("canplaythrough")) {
|
|
19
|
-
player.obstruct("canplaythrough", plain.current.ready);
|
|
20
|
-
}
|
|
21
|
-
// reparsing
|
|
22
|
-
if (reparse) {
|
|
23
|
-
plain.current.ready.then(() => player.reparseTree(plain.current.domElement));
|
|
24
|
-
}
|
|
25
|
-
}, []);
|
|
26
|
-
return (jsx(KTX$2, { ref: combined, ...attrs }));
|
|
27
|
-
});
|
|
4
|
+
import { forwardRef, useRef, useImperativeHandle, useEffect, isValidElement, cloneElement } from 'react';
|
|
28
5
|
|
|
29
6
|
// option of loading KaTeX asynchronously
|
|
30
7
|
const KaTeXLoad = new Promise((resolve) => {
|
|
@@ -57,8 +34,9 @@ const KaTeXMacros = new Promise((resolve) => {
|
|
|
57
34
|
*/
|
|
58
35
|
const KaTeXReady = Promise.all([KaTeXLoad, KaTeXMacros]);
|
|
59
36
|
/**
|
|
60
|
-
Parse \newcommand macros in a file.
|
|
61
|
-
Also supports \ktxnewcommand (for use in conjunction with MathJax).
|
|
37
|
+
* Parse \newcommand macros in a file.
|
|
38
|
+
* Also supports \ktxnewcommand (for use in conjunction with MathJax).
|
|
39
|
+
* @param file TeX file to parse
|
|
62
40
|
*/
|
|
63
41
|
function parseMacros(file) {
|
|
64
42
|
const macros = {};
|
|
@@ -91,7 +69,7 @@ function parseMacros(file) {
|
|
|
91
69
|
}
|
|
92
70
|
|
|
93
71
|
/** Component for KaTeX code */
|
|
94
|
-
const KTX = forwardRef(function KTX(props, ref) {
|
|
72
|
+
const KTX$1 = forwardRef(function KTX(props, ref) {
|
|
95
73
|
const spanRef = useRef();
|
|
96
74
|
const { children, display = false, ...attrs } = props;
|
|
97
75
|
const [ready, resolve] = usePromise();
|
|
@@ -134,6 +112,28 @@ const KTX = forwardRef(function KTX(props, ref) {
|
|
|
134
112
|
return (jsx("span", { ...attrs, ref: spanRef }));
|
|
135
113
|
});
|
|
136
114
|
|
|
115
|
+
/** Component for KaTeX code */
|
|
116
|
+
const KTX = forwardRef(function KTX(props, ref) {
|
|
117
|
+
const { obstruct = "canplay canplaythrough", reparse = false, ...attrs } = props;
|
|
118
|
+
const plain = useRef();
|
|
119
|
+
const combined = combineRefs(plain, ref);
|
|
120
|
+
const player = usePlayer();
|
|
121
|
+
useEffect(() => {
|
|
122
|
+
// obstruction
|
|
123
|
+
if (obstruct.match(/\bcanplay\b/)) {
|
|
124
|
+
player.obstruct("canplay", plain.current.ready);
|
|
125
|
+
}
|
|
126
|
+
if (obstruct.match("canplaythrough")) {
|
|
127
|
+
player.obstruct("canplaythrough", plain.current.ready);
|
|
128
|
+
}
|
|
129
|
+
// reparsing
|
|
130
|
+
if (reparse) {
|
|
131
|
+
plain.current.ready.then(() => player.reparseTree(plain.current.domElement));
|
|
132
|
+
}
|
|
133
|
+
}, []);
|
|
134
|
+
return (jsx(KTX$1, { ref: combined, ...attrs }));
|
|
135
|
+
});
|
|
136
|
+
|
|
137
137
|
/**
|
|
138
138
|
* Wait for several things to be rendered
|
|
139
139
|
*/
|
|
@@ -183,7 +183,7 @@ const RenderGroup = forwardRef(function RenderGroup(props, ref) {
|
|
|
183
183
|
* @param node Element to check
|
|
184
184
|
*/
|
|
185
185
|
function shouldInspect(node) {
|
|
186
|
-
return isValidElement(node) && typeof node.type === "object" && (node.type === KTX
|
|
186
|
+
return isValidElement(node) && typeof node.type === "object" && (node.type === KTX || node.type === KTX$1);
|
|
187
187
|
}
|
|
188
188
|
/**
|
|
189
189
|
* Find least common ancestor of an array of elements
|
|
@@ -203,4 +203,4 @@ function leastCommonAncestor(elements) {
|
|
|
203
203
|
return ancestor;
|
|
204
204
|
}
|
|
205
205
|
|
|
206
|
-
export { KTX
|
|
206
|
+
export { KTX, KaTeXReady, RenderGroup };
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var
|
|
6
|
-
var react = require('react');
|
|
5
|
+
var jsxRuntime_js = require('react/jsx-runtime.js');
|
|
7
6
|
var react$1 = require('@liqvid/utils/react');
|
|
7
|
+
var react = require('react');
|
|
8
8
|
|
|
9
9
|
// option of loading KaTeX asynchronously
|
|
10
10
|
const KaTeXLoad = new Promise((resolve) => {
|
|
@@ -37,8 +37,9 @@ const KaTeXMacros = new Promise((resolve) => {
|
|
|
37
37
|
*/
|
|
38
38
|
const KaTeXReady = Promise.all([KaTeXLoad, KaTeXMacros]);
|
|
39
39
|
/**
|
|
40
|
-
Parse \newcommand macros in a file.
|
|
41
|
-
Also supports \ktxnewcommand (for use in conjunction with MathJax).
|
|
40
|
+
* Parse \newcommand macros in a file.
|
|
41
|
+
* Also supports \ktxnewcommand (for use in conjunction with MathJax).
|
|
42
|
+
* @param file TeX file to parse
|
|
42
43
|
*/
|
|
43
44
|
function parseMacros(file) {
|
|
44
45
|
const macros = {};
|
|
@@ -111,7 +112,7 @@ const KTX = react.forwardRef(function KTX(props, ref) {
|
|
|
111
112
|
attrs.style = {};
|
|
112
113
|
attrs.style.display = "block";
|
|
113
114
|
}
|
|
114
|
-
return (
|
|
115
|
+
return (jsxRuntime_js.jsx("span", { ...attrs, ref: spanRef }));
|
|
115
116
|
});
|
|
116
117
|
|
|
117
118
|
exports.KTX = KTX;
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
+
import * as react from 'react';
|
|
3
|
+
|
|
2
4
|
/**
|
|
3
5
|
* KTX element API
|
|
4
6
|
*/
|
|
5
|
-
|
|
7
|
+
interface Handle {
|
|
6
8
|
/** The underlying <span> element */
|
|
7
9
|
domElement: HTMLSpanElement;
|
|
8
10
|
/** Promise that resolves once typesetting is finished */
|
|
@@ -16,5 +18,6 @@ interface Props extends React.HTMLAttributes<HTMLSpanElement> {
|
|
|
16
18
|
display?: boolean;
|
|
17
19
|
}
|
|
18
20
|
/** Component for KaTeX code */
|
|
19
|
-
|
|
20
|
-
|
|
21
|
+
declare const KTX: react.ForwardRefExoticComponent<Props & react.RefAttributes<Handle>>;
|
|
22
|
+
|
|
23
|
+
export { Handle, KTX };
|
package/dist/plain.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { forwardRef, useRef, useImperativeHandle, useEffect } from 'react';
|
|
1
|
+
import { jsx } from 'react/jsx-runtime.js';
|
|
3
2
|
import { usePromise } from '@liqvid/utils/react';
|
|
3
|
+
import { forwardRef, useRef, useImperativeHandle, useEffect } from 'react';
|
|
4
4
|
|
|
5
5
|
// option of loading KaTeX asynchronously
|
|
6
6
|
const KaTeXLoad = new Promise((resolve) => {
|
|
@@ -33,8 +33,9 @@ const KaTeXMacros = new Promise((resolve) => {
|
|
|
33
33
|
*/
|
|
34
34
|
const KaTeXReady = Promise.all([KaTeXLoad, KaTeXMacros]);
|
|
35
35
|
/**
|
|
36
|
-
Parse \newcommand macros in a file.
|
|
37
|
-
Also supports \ktxnewcommand (for use in conjunction with MathJax).
|
|
36
|
+
* Parse \newcommand macros in a file.
|
|
37
|
+
* Also supports \ktxnewcommand (for use in conjunction with MathJax).
|
|
38
|
+
* @param file TeX file to parse
|
|
38
39
|
*/
|
|
39
40
|
function parseMacros(file) {
|
|
40
41
|
const macros = {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@liqvid/katex",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.4",
|
|
4
4
|
"description": "KaTeX integration for Liqvid",
|
|
5
5
|
"files": [
|
|
6
6
|
"dist/*"
|
|
@@ -8,11 +8,11 @@
|
|
|
8
8
|
"exports": {
|
|
9
9
|
".": {
|
|
10
10
|
"import": "./dist/index.mjs",
|
|
11
|
-
"require": "./dist/index.
|
|
11
|
+
"require": "./dist/index.cjs"
|
|
12
12
|
},
|
|
13
13
|
"./plain": {
|
|
14
14
|
"import": "./dist/plain.mjs",
|
|
15
|
-
"require": "./dist/plain.
|
|
15
|
+
"require": "./dist/plain.cjs"
|
|
16
16
|
}
|
|
17
17
|
},
|
|
18
18
|
"typesVersions": {
|
|
@@ -27,10 +27,6 @@
|
|
|
27
27
|
"liqvid",
|
|
28
28
|
"katex"
|
|
29
29
|
],
|
|
30
|
-
"scripts": {
|
|
31
|
-
"build": "tsc --build --force",
|
|
32
|
-
"lint": "eslint --ext ts,tsx --fix src"
|
|
33
|
-
},
|
|
34
30
|
"repository": {
|
|
35
31
|
"type": "git",
|
|
36
32
|
"url": "git+https://github.com/liqvidjs/liqvid.git"
|
|
@@ -43,7 +39,7 @@
|
|
|
43
39
|
"peerDependencies": {
|
|
44
40
|
"@types/katex": "^0.11.1",
|
|
45
41
|
"@types/react": ">=17.0.0",
|
|
46
|
-
"liqvid": "^2.1.
|
|
42
|
+
"liqvid": "^2.1.4",
|
|
47
43
|
"react": ">=17.0.0"
|
|
48
44
|
},
|
|
49
45
|
"peerDependenciesMeta": {
|
|
@@ -52,18 +48,17 @@
|
|
|
52
48
|
}
|
|
53
49
|
},
|
|
54
50
|
"devDependencies": {
|
|
55
|
-
"
|
|
56
|
-
"@typescript-eslint/eslint-plugin": "^5.14.0",
|
|
57
|
-
"@typescript-eslint/parser": "^5.14.0",
|
|
58
|
-
"@yuri/eslint-config": "^1.0.1",
|
|
59
|
-
"eslint": "^8.11.0",
|
|
60
|
-
"eslint-plugin-react": "^7.29.3",
|
|
61
|
-
"liqvid": "^2.1.1",
|
|
62
|
-
"react": "^17.0.2",
|
|
63
|
-
"rollup": "^2.70.0",
|
|
64
|
-
"typescript": "^4.6.2"
|
|
51
|
+
"liqvid": "^2.1.4"
|
|
65
52
|
},
|
|
66
53
|
"dependencies": {
|
|
67
54
|
"@liqvid/utils": "^1.3.0"
|
|
68
|
-
}
|
|
69
|
-
|
|
55
|
+
},
|
|
56
|
+
"scripts": {
|
|
57
|
+
"build": "pnpm build:clean && pnpm build:js && pnpm build:postclean",
|
|
58
|
+
"build:clean": "rm -rf dist",
|
|
59
|
+
"build:js": "tsc && node ../../build.mjs && rollup -c",
|
|
60
|
+
"build:postclean": "rm -rf dist/esm dist/types dist/tsconfig.tsbuildinfo",
|
|
61
|
+
"lint": "eslint --ext ts,tsx --fix src"
|
|
62
|
+
},
|
|
63
|
+
"readme": "# @liqvid/katex\n\n[KaTeX](https://katex.org/) integration for [Liqvid](https://liqvidjs.org). See https://liqvidjs.org/docs/integrations/katex/ for documentation.\n"
|
|
64
|
+
}
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
/** RenderGroup element API */
|
|
3
|
-
interface Handle {
|
|
4
|
-
/** Promise that resolves once all KTX descendants have finished typesetting */
|
|
5
|
-
ready: Promise<void>;
|
|
6
|
-
}
|
|
7
|
-
interface Props {
|
|
8
|
-
/**
|
|
9
|
-
* Whether to reparse descendants for `during()` and `from()`
|
|
10
|
-
* @default false
|
|
11
|
-
*/
|
|
12
|
-
reparse?: boolean;
|
|
13
|
-
}
|
|
14
|
-
/**
|
|
15
|
-
* Wait for several things to be rendered
|
|
16
|
-
*/
|
|
17
|
-
export declare const RenderGroup: React.ForwardRefExoticComponent<Props & React.RefAttributes<Handle>>;
|
|
18
|
-
export {};
|
package/dist/types/fancy.d.ts
DELETED
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { Handle, KTX as KTXPlain } from "./plain";
|
|
3
|
-
interface Props extends React.ComponentProps<typeof KTXPlain> {
|
|
4
|
-
/**
|
|
5
|
-
* Player events to obstruct
|
|
6
|
-
* @default "canplay canplaythrough"
|
|
7
|
-
*/
|
|
8
|
-
obstruct?: string;
|
|
9
|
-
/**
|
|
10
|
-
* Whether to reparse descendants for `during()` and `from()`
|
|
11
|
-
* @default false
|
|
12
|
-
*/
|
|
13
|
-
reparse?: boolean;
|
|
14
|
-
}
|
|
15
|
-
/** Component for KaTeX code */
|
|
16
|
-
export declare const KTX: import("react").ForwardRefExoticComponent<Pick<Props, "hidden" | "color" | "style" | "display" | "translate" | "slot" | "title" | "children" | "key" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "obstruct" | "reparse"> & import("react").RefAttributes<Handle>>;
|
|
17
|
-
export {};
|
package/dist/types/index.d.ts
DELETED