@pie-lib/math-rendering 2.5.1-next.127 → 2.5.1

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.
@@ -1,81 +1,117 @@
1
- <!doctype html>
1
+ <!DOCTYPE html>
2
2
  <html>
3
+ <head>
4
+ <script>
5
+ window.pie = window.pie || {};
6
+ window.pie.mathRendering = { useSingleDollar: false };
7
+ </script>
8
+ <script src="./main.bundle.js"></script>
9
+ </head>
3
10
 
4
- <head>
5
-
6
- <script>
7
- window.pie = window.pie || {}
8
- window.pie.mathRendering = { useSingleDollar: false }
9
- </script>
10
- <script src="./main.bundle.js"></script>
11
- </head>
12
-
13
- <body>
14
- <div id="mathml-node">
15
-
16
- <br/>
17
- <span>inline: \(\frac{1}{2}\)</span>
18
- <br/> block: <span>\[\frac{1}{2}\]</span>
19
- <br/>
20
- <span>single dollar: $\frac{1}{2}$</span>
21
- <br/>
22
- <span> double dollar: $$\frac{1}{2}$$</span>
23
- <math xmlns="http://www.w3.org/1998/Math/MathML">
24
- <mi>a</mi>
25
- <mo>&#x2260;</mo>
26
- <mn>0</mn>
27
- </math>, there are two solutions to
28
- <math xmlns="http://www.w3.org/1998/Math/MathML">
29
- <mi>ab</mi>
30
- <msup>
11
+ <body>
12
+ <div id="mathml-node">
13
+ <br />
14
+ <span>inline: \(\frac{1}{2}\)</span>
15
+ <br />
16
+ block: <span>\[\frac{1}{2}\]</span>
17
+ <br />
18
+ <span>single dollar: $\frac{1}{2}$</span>
19
+ <br />
20
+ <span> double dollar: $$\frac{1}{2}$$</span>
21
+ <math xmlns="http://www.w3.org/1998/Math/MathML">
22
+ <mi>a</mi>
23
+ <mo>&#x2260;</mo>
24
+ <mn>0</mn> </math
25
+ >, there are two solutions to
26
+ <math xmlns="http://www.w3.org/1998/Math/MathML">
27
+ <mi>ab</mi>
28
+ <msup>
29
+ <mi>x</mi>
30
+ <mn>2</mn>
31
+ </msup>
32
+ <mo>+</mo>
33
+ <mi>b</mi>
31
34
  <mi>x</mi>
32
- <mn>2</mn>
33
- </msup>
34
- <mo>+</mo>
35
- <mi>b</mi>
36
- <mi>x</mi>
37
- <mo>+</mo>
38
- <mi>c</mi>
39
- <mo>=</mo>
40
- <mn>0</mn>
41
- </math> and they are
42
- <br/>
43
- <math xmlns="http://www.w3.org/1998/Math/MathML" display="block">
44
- <mi>x</mi>
45
- <mo>=</mo>
46
- <mrow>
47
- <mfrac>
48
- <mrow>
49
- <mo>&#x2212;</mo>
50
- <mi>b</mi>
51
- <mo>&#x00B1;</mo>
52
- <msqrt>
53
- <msup>
54
- <mi>bfoo bar</mi>
55
- <mn>2</mn>
56
- </msup>
35
+ <mo>+</mo>
36
+ <mi>c</mi>
37
+ <mo>=</mo>
38
+ <mn>0</mn>
39
+ </math>
40
+ and they are
41
+ <br />
42
+ <math xmlns="http://www.w3.org/1998/Math/MathML" display="block">
43
+ <mi>x</mi>
44
+ <mo>=</mo>
45
+ <mrow>
46
+ <mfrac>
47
+ <mrow>
57
48
  <mo>&#x2212;</mo>
58
- <mn>4</mn>
49
+ <mi>b</mi>
50
+ <mo>&#x00B1;</mo>
51
+ <msqrt>
52
+ <msup>
53
+ <mi>bfoo bar</mi>
54
+ <mn>2</mn>
55
+ </msup>
56
+ <mo>&#x2212;</mo>
57
+ <mn>4</mn>
58
+ <mi>a</mi>
59
+ <mi>c</mi>
60
+ </msqrt>
61
+ </mrow>
62
+ <mrow>
63
+ <mn>2</mn>
59
64
  <mi>a</mi>
60
- <mi>c</mi>
61
- </msqrt>
62
- </mrow>
65
+ </mrow>
66
+ </mfrac>
67
+ </mrow>
68
+ <mtext>.</mtext>
69
+ </math>
70
+
71
+ <math xmlns="http://www.w3.org/1998/Math/MathML" display="block">
72
+ <msup>
63
73
  <mrow>
74
+ <mo>(</mo>
75
+ <mrow>
76
+ <munderover>
77
+ <mo
78
+ >&#x2211;
79
+ <!-- ∑ -->
80
+ </mo>
81
+ <mrow class="MJX-TeXAtom-ORD">
82
+ <mi>k</mi>
83
+ <mo>=</mo>
84
+ <mn>1</mn>
85
+ </mrow>
86
+ <mi>n</mi>
87
+ </munderover>
88
+ <msub>
89
+ <mi>a</mi>
90
+ <mi>k</mi>
91
+ </msub>
92
+ <msub>
93
+ <mi>b</mi>
94
+ <mi>k</mi>
95
+ </msub>
96
+ </mrow>
97
+ <mo>)</mo>
98
+ </mrow>
99
+ <mrow class="MJX-TeXAtom-ORD">
100
+ <mspace width="negativethinmathspace" />
101
+ <mspace width="negativethinmathspace" />
64
102
  <mn>2</mn>
65
- <mi>a</mi>
66
103
  </mrow>
67
- </mfrac>
68
- </mrow>
69
- <mtext>.</mtext>
70
- </math>
71
-
72
- <math xmlns="http://www.w3.org/1998/Math/MathML" display="block">
73
- <msup>
104
+ </msup>
105
+ <mo
106
+ >&#x2264;
107
+ <!-- ≤ -->
108
+ </mo>
74
109
  <mrow>
75
110
  <mo>(</mo>
76
111
  <mrow>
77
112
  <munderover>
78
- <mo>&#x2211;
113
+ <mo
114
+ >&#x2211;
79
115
  <!-- ∑ -->
80
116
  </mo>
81
117
  <mrow class="MJX-TeXAtom-ORD">
@@ -85,72 +121,38 @@
85
121
  </mrow>
86
122
  <mi>n</mi>
87
123
  </munderover>
88
- <msub>
124
+ <msubsup>
89
125
  <mi>a</mi>
90
126
  <mi>k</mi>
91
- </msub>
92
- <msub>
93
- <mi>b</mi>
94
- <mi>k</mi>
95
- </msub>
127
+ <mn>2</mn>
128
+ </msubsup>
96
129
  </mrow>
97
130
  <mo>)</mo>
98
131
  </mrow>
99
- <mrow class="MJX-TeXAtom-ORD">
100
- <mspace width="negativethinmathspace" />
101
- <mspace width="negativethinmathspace" />
102
- <mn>2</mn>
103
- </mrow>
104
- </msup>
105
- <mo>&#x2264;
106
- <!-- ≤ -->
107
- </mo>
108
- <mrow>
109
- <mo>(</mo>
110
132
  <mrow>
111
- <munderover>
112
- <mo>&#x2211;
113
- <!-- ∑ -->
114
- </mo>
115
- <mrow class="MJX-TeXAtom-ORD">
116
- <mi>k</mi>
117
- <mo>=</mo>
118
- <mn>1</mn>
119
- </mrow>
120
- <mi>n</mi>
121
- </munderover>
122
- <msubsup>
123
- <mi>a</mi>
124
- <mi>k</mi>
125
- <mn>2</mn>
126
- </msubsup>
127
- </mrow>
128
- <mo>)</mo>
129
- </mrow>
130
- <mrow>
131
- <mo>(</mo>
132
- <mrow>
133
- <munderover>
134
- <mo>&#x2211;
135
- <!-- ∑ -->
136
- </mo>
137
- <mrow class="MJX-TeXAtom-ORD">
133
+ <mo>(</mo>
134
+ <mrow>
135
+ <munderover>
136
+ <mo
137
+ >&#x2211;
138
+ <!-- ∑ -->
139
+ </mo>
140
+ <mrow class="MJX-TeXAtom-ORD">
141
+ <mi>k</mi>
142
+ <mo>=</mo>
143
+ <mn>1</mn>
144
+ </mrow>
145
+ <mi>n</mi>
146
+ </munderover>
147
+ <msubsup>
148
+ <mi>b</mi>
138
149
  <mi>k</mi>
139
- <mo>=</mo>
140
- <mn>1</mn>
141
- </mrow>
142
- <mi>n</mi>
143
- </munderover>
144
- <msubsup>
145
- <mi>b</mi>
146
- <mi>k</mi>
147
- <mn>2</mn>
148
- </msubsup>
150
+ <mn>2</mn>
151
+ </msubsup>
152
+ </mrow>
153
+ <mo>)</mo>
149
154
  </mrow>
150
- <mo>)</mo>
151
- </mrow>
152
- </math>
153
- </div>
154
- </body>
155
-
156
- </html>
155
+ </math>
156
+ </div>
157
+ </body>
158
+ </html>
@@ -10,20 +10,20 @@ module.exports = {
10
10
  use: {
11
11
  loader: 'babel-loader',
12
12
  options: {
13
- presets: ['env']
14
- }
15
- }
16
- }
17
- ]
13
+ presets: ['env'],
14
+ },
15
+ },
16
+ },
17
+ ],
18
18
  },
19
19
  entry: {
20
20
  demo: './demo.js',
21
- main: './main.js'
21
+ main: './main.js',
22
22
  },
23
23
  output: {
24
- filename: '[name].bundle.js'
24
+ filename: '[name].bundle.js',
25
25
  },
26
26
  resolveLoader: {
27
- modules: ['node_modules', '../../../node_modules']
28
- }
27
+ modules: ['node_modules', '../../../node_modules'],
28
+ },
29
29
  };
@@ -32,12 +32,12 @@ export class Row {
32
32
 
33
33
  const diff = count - this.columns.length;
34
34
 
35
- const padding = _.times(diff).map(n => '__pad__');
35
+ const padding = _.times(diff).map((n) => '__pad__');
36
36
  return direction === 'right' ? [...padding, ...this.columns] : [...this.columns, ...padding];
37
37
  }
38
38
  }
39
39
 
40
- const mathNodeToCharArray = mn => {
40
+ const mathNodeToCharArray = (mn) => {
41
41
  const text = mn.childNodes.reduce(reduceText, '');
42
42
  return text.split('');
43
43
  };
@@ -47,7 +47,7 @@ const mathNodeToCharArray = mn => {
47
47
  * @param {*} child
48
48
  * @return an array of column content
49
49
  */
50
- const toColumnArray = child => {
50
+ const toColumnArray = (child) => {
51
51
  if (!child || !child.kind) {
52
52
  return [];
53
53
  }
@@ -78,7 +78,7 @@ const toColumnArray = child => {
78
78
  * @param child chtml child node of mstack
79
79
  * @return Row | Line
80
80
  */
81
- const rowStack = child => {
81
+ const rowStack = (child) => {
82
82
  if (!child || !child.kind) {
83
83
  return;
84
84
  }
@@ -119,7 +119,7 @@ const rowStack = child => {
119
119
  * @return Row[]
120
120
  */
121
121
 
122
- export const getStackData = mstack => {
122
+ export const getStackData = (mstack) => {
123
123
  if (!mstack || !mstack.childNodes) {
124
124
  return [];
125
125
  }
@@ -149,7 +149,7 @@ export class CHTMLmstack extends CHTMLWrapper {
149
149
  const table = this.ce('table');
150
150
  chtml.appendChild(table);
151
151
 
152
- stackData.forEach(row => {
152
+ stackData.forEach((row) => {
153
153
  const tr = this.ce('tr');
154
154
  table.appendChild(tr);
155
155
 
@@ -165,7 +165,7 @@ export class CHTMLmstack extends CHTMLWrapper {
165
165
 
166
166
  // align right for now:
167
167
  const cols = row.pad(maxCols, 'right');
168
- cols.forEach(c => {
168
+ cols.forEach((c) => {
169
169
  const t = this.ce('td');
170
170
  tr.appendChild(t);
171
171
  if (c === '__pad__') {
@@ -194,25 +194,25 @@ CHTMLmstack.styles = {
194
194
  'line-height': 'initial',
195
195
  border: 'solid 0px red',
196
196
  'border-spacing': '0em',
197
- 'border-collapse': 'separate'
197
+ 'border-collapse': 'separate',
198
198
  },
199
199
  'mjx-mstack > table > tr': {
200
- 'line-height': 'initial'
200
+ 'line-height': 'initial',
201
201
  },
202
202
  'mjx-mstack > table > tr > td': {
203
203
  // padding: '1.2rem',
204
204
  border: 'solid 0px blue',
205
205
  'font-family': 'sans-serif',
206
- 'line-height': 'initial'
206
+ 'line-height': 'initial',
207
207
  },
208
208
  'mjx-mstack > table > tr > td.inner': {
209
- 'font-family': 'inherit'
209
+ 'font-family': 'inherit',
210
210
  },
211
211
  'mjx-mstack > table > tr > .mjx-line': {
212
212
  padding: 0,
213
- 'border-top': 'solid 1px black'
213
+ 'border-top': 'solid 1px black',
214
214
  },
215
215
  '.TEX-A': {
216
- 'font-family': 'MJXZERO, MJXTEX !important'
217
- }
216
+ 'font-family': 'MJXZERO, MJXTEX !important',
217
+ },
218
218
  };
@@ -2,12 +2,12 @@ import { CHTMLmstack } from './chtml';
2
2
  import { MmlNone, MmlMsline, MmlMstack, MmlMsrow } from './mml';
3
3
 
4
4
  export const chtmlNodes = {
5
- mstack: CHTMLmstack
5
+ mstack: CHTMLmstack,
6
6
  };
7
7
 
8
8
  export const mmlNodes = {
9
9
  mstack: MmlMstack,
10
10
  msline: MmlMsline,
11
11
  msrow: MmlMsrow,
12
- none: MmlNone
12
+ none: MmlNone,
13
13
  };
@@ -9,7 +9,7 @@ const PAIRS = {
9
9
  [BracketTypes.ROUND_BRACKETS]: ['\\(', '\\)'],
10
10
  [BracketTypes.SQUARE_BRACKETS]: ['\\[', '\\]'],
11
11
  [BracketTypes.DOLLAR]: ['$', '$'],
12
- [BracketTypes.DOUBLE_DOLLAR]: ['$$', '$$']
12
+ [BracketTypes.DOUBLE_DOLLAR]: ['$$', '$$'],
13
13
  };
14
14
 
15
15
  export const wrapMath = (content, wrapType) => {
@@ -26,7 +26,7 @@ export const wrapMath = (content, wrapType) => {
26
26
  return `${start}${content}${end}`;
27
27
  };
28
28
 
29
- export const unWrapMath = content => {
29
+ export const unWrapMath = (content) => {
30
30
  const displayStyleIndex = content.indexOf('\\displaystyle');
31
31
  if (displayStyleIndex !== -1) {
32
32
  console.warn('\\displaystyle is not supported - removing'); // eslint-disable-line
@@ -37,13 +37,13 @@ export const unWrapMath = content => {
37
37
  console.warn('$$ syntax is not yet supported'); // eslint-disable-line
38
38
  return {
39
39
  unwrapped: content.substring(2, content.length - 2),
40
- wrapType: BracketTypes.DOLLAR
40
+ wrapType: BracketTypes.DOLLAR,
41
41
  };
42
42
  }
43
43
  if (content.startsWith('$') && content.endsWith('$')) {
44
44
  return {
45
45
  unwrapped: content.substring(1, content.length - 1),
46
- wrapType: BracketTypes.DOLLAR
46
+ wrapType: BracketTypes.DOLLAR,
47
47
  };
48
48
  }
49
49
 
@@ -51,19 +51,19 @@ export const unWrapMath = content => {
51
51
  console.warn('\\[..\\] syntax is not yet supported'); // eslint-disable-line
52
52
  return {
53
53
  unwrapped: content.substring(2, content.length - 2),
54
- wrapType: BracketTypes.ROUND_BRACKETS
54
+ wrapType: BracketTypes.ROUND_BRACKETS,
55
55
  };
56
56
  }
57
57
 
58
58
  if (content.startsWith('\\(') && content.endsWith('\\)')) {
59
59
  return {
60
60
  unwrapped: content.substring(2, content.length - 2),
61
- wrapType: BracketTypes.ROUND_BRACKETS
61
+ wrapType: BracketTypes.ROUND_BRACKETS,
62
62
  };
63
63
  }
64
64
 
65
65
  return {
66
66
  unwrapped: content,
67
- wrapType: BracketTypes.ROUND_BRACKETS
67
+ wrapType: BracketTypes.ROUND_BRACKETS,
68
68
  };
69
69
  };
@@ -21,7 +21,7 @@ import { CHTMLWrapperFactory } from 'mathjax-full/js/output/chtml/WrapperFactory
21
21
  import { CHTMLmspace } from 'mathjax-full/js/output/chtml/Wrappers/mspace';
22
22
 
23
23
  const visitor = new SerializedMmlVisitor();
24
- const toMMl = node => visitor.visitTree(node);
24
+ const toMMl = (node) => visitor.visitTree(node);
25
25
 
26
26
  const log = debug('pie-lib:math-rendering');
27
27
 
@@ -50,7 +50,7 @@ const getGlobal = () => {
50
50
  */
51
51
  const defaultOpts = () => getGlobal().opts || {};
52
52
 
53
- export const fixMathElement = element => {
53
+ export const fixMathElement = (element) => {
54
54
  if (element.dataset.mathHandled) {
55
55
  return;
56
56
  }
@@ -73,15 +73,15 @@ export const fixMathElement = element => {
73
73
  export const fixMathElements = () => {
74
74
  const mathElements = document.querySelectorAll('[data-latex]');
75
75
 
76
- mathElements.forEach(item => fixMathElement(item));
76
+ mathElements.forEach((item) => fixMathElement(item));
77
77
  };
78
78
 
79
79
  const adjustMathMLStyle = () => {
80
80
  const nodes = document.querySelectorAll('math');
81
- nodes.forEach(node => node.setAttribute('displaystyle', 'true'));
81
+ nodes.forEach((node) => node.setAttribute('displaystyle', 'true'));
82
82
  };
83
83
 
84
- const bootstrap = opts => {
84
+ const bootstrap = (opts) => {
85
85
  if (typeof window === 'undefined') {
86
86
  return { Typeset: () => ({}) };
87
87
  }
@@ -93,7 +93,7 @@ const bootstrap = opts => {
93
93
  console.warn('[math-rendering] using $ is not advisable, please use $$..$$ or \\(...\\)');
94
94
  }
95
95
 
96
- const packages = AllPackages.filter(name => name !== 'bussproofs'); // Bussproofs needs an output jax
96
+ const packages = AllPackages.filter((name) => name !== 'bussproofs'); // Bussproofs needs an output jax
97
97
 
98
98
  // The autoload extension predefines all the macros from the extensions that haven't been loaded already
99
99
  // so that they automatically load the needed extension when they are first used
@@ -103,7 +103,7 @@ const bootstrap = opts => {
103
103
  parallelogram: '\\lower.2em{\\Huge\\unicode{x25B1}}',
104
104
  overarc: '\\overparen',
105
105
  napprox: '\\not\\approx',
106
- longdiv: '\\enclose{longdiv}'
106
+ longdiv: '\\enclose{longdiv}',
107
107
  };
108
108
 
109
109
  const texConfig = opts.useSingleDollar
@@ -112,13 +112,13 @@ const bootstrap = opts => {
112
112
  macros,
113
113
  inlineMath: [
114
114
  ['$', '$'],
115
- ['\\(', '\\)']
115
+ ['\\(', '\\)'],
116
116
  ],
117
- processEscapes: true
117
+ processEscapes: true,
118
118
  }
119
119
  : {
120
120
  packages,
121
- macros
121
+ macros,
122
122
  };
123
123
 
124
124
  const mmlConfig = {
@@ -126,7 +126,7 @@ const bootstrap = opts => {
126
126
  // function to process parsing errors
127
127
  console.log('error:', node);
128
128
  this.error(this.adaptor.textContent(node).replace(/\n.*/g, ''));
129
- }
129
+ },
130
130
  };
131
131
 
132
132
  const fontURL = `https://unpkg.com/mathjax-full@${mathjax.version}/ts/output/chtml/fonts/tex-woff-v2`;
@@ -135,15 +135,15 @@ const bootstrap = opts => {
135
135
 
136
136
  wrapperFactory: new CHTMLWrapperFactory({
137
137
  ...CHTMLWrapperFactory.defaultNodes,
138
- ...chtmlNodes
139
- })
138
+ ...chtmlNodes,
139
+ }),
140
140
  };
141
141
 
142
142
  const mml = new MathML(mmlConfig);
143
143
 
144
144
  const customMmlFactory = new MmlFactory({
145
145
  ...MmlFactory.defaultNodes,
146
- ...mmlNodes
146
+ ...mmlNodes,
147
147
  });
148
148
 
149
149
  const html = mathjax.document(document, {
@@ -158,7 +158,7 @@ const bootstrap = opts => {
158
158
  },
159
159
 
160
160
  InputJax: [new TeX(texConfig), mml],
161
- OutputJax: new CHTML(htmlConfig)
161
+ OutputJax: new CHTML(htmlConfig),
162
162
  });
163
163
 
164
164
  // Note: we must set this *after* mathjax.document (no idea why)
@@ -189,7 +189,7 @@ const bootstrap = opts => {
189
189
  }
190
190
 
191
191
  updatedDocument.clear();
192
- }
192
+ },
193
193
  };
194
194
  };
195
195
 
@@ -228,8 +228,8 @@ CHTMLmspace.styles = {
228
228
  'mjx-mspace': {
229
229
  display: 'block',
230
230
  'text-align': 'center',
231
- height: '5px'
232
- }
231
+ height: '5px',
232
+ },
233
233
  };
234
234
 
235
235
  export default renderMath;