@pie-element/multi-trait-rubric 8.1.1-next.39 → 8.1.1-next.44
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/lib/index.js +44 -3
- package/lib/index.js.map +1 -1
- package/package.json +2 -2
package/lib/index.js
CHANGED
|
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
7
|
exports.default = void 0;
|
|
8
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
8
9
|
var _react = _interopRequireDefault(require("react"));
|
|
9
10
|
var _client = require("react-dom/client");
|
|
10
11
|
var _piePlayerEvents = require("@pie-framework/pie-player-events");
|
|
@@ -13,9 +14,49 @@ var _mathRendering = require("@pie-lib/math-rendering");
|
|
|
13
14
|
class MultiTraitRubric extends HTMLElement {
|
|
14
15
|
constructor() {
|
|
15
16
|
super();
|
|
17
|
+
// React commits asynchronously, so a queueMicrotask(renderMath) can run before
|
|
18
|
+
// the LaTeX spans are in the DOM and leave raw LaTeX on first render — this is
|
|
19
|
+
// especially visible when this element is mounted inside complex-rubric, which
|
|
20
|
+
// swaps its innerHTML and re-defines the inner element. Observing the DOM and
|
|
21
|
+
// typesetting after each commit keeps math in sync regardless of timing.
|
|
22
|
+
(0, _defineProperty2.default)(this, "_scheduleMathRender", () => {
|
|
23
|
+
if (this._mathRenderPending) return;
|
|
24
|
+
this._mathRenderPending = true;
|
|
25
|
+
requestAnimationFrame(() => {
|
|
26
|
+
if (this._mathObserver) {
|
|
27
|
+
this._mathObserver.disconnect();
|
|
28
|
+
}
|
|
29
|
+
(0, _mathRendering.renderMath)(this);
|
|
30
|
+
this._mathRenderPending = false;
|
|
31
|
+
setTimeout(() => {
|
|
32
|
+
if (this._mathObserver) {
|
|
33
|
+
this._mathObserver.observe(this, {
|
|
34
|
+
childList: true,
|
|
35
|
+
subtree: true
|
|
36
|
+
});
|
|
37
|
+
}
|
|
38
|
+
}, 50);
|
|
39
|
+
});
|
|
40
|
+
});
|
|
16
41
|
this._model = {};
|
|
17
42
|
this._session = null;
|
|
18
43
|
this._root = null;
|
|
44
|
+
this._mathObserver = null;
|
|
45
|
+
this._mathRenderPending = false;
|
|
46
|
+
}
|
|
47
|
+
_initMathObserver() {
|
|
48
|
+
if (this._mathObserver) return;
|
|
49
|
+
this._mathObserver = new MutationObserver(this._scheduleMathRender);
|
|
50
|
+
this._mathObserver.observe(this, {
|
|
51
|
+
childList: true,
|
|
52
|
+
subtree: true
|
|
53
|
+
});
|
|
54
|
+
}
|
|
55
|
+
_disconnectMathObserver() {
|
|
56
|
+
if (this._mathObserver) {
|
|
57
|
+
this._mathObserver.disconnect();
|
|
58
|
+
this._mathObserver = null;
|
|
59
|
+
}
|
|
19
60
|
}
|
|
20
61
|
set model(s) {
|
|
21
62
|
this._model = s;
|
|
@@ -29,9 +70,11 @@ class MultiTraitRubric extends HTMLElement {
|
|
|
29
70
|
return this._session;
|
|
30
71
|
}
|
|
31
72
|
connectedCallback() {
|
|
73
|
+
this._initMathObserver();
|
|
32
74
|
this._render();
|
|
33
75
|
}
|
|
34
76
|
_render() {
|
|
77
|
+
this._initMathObserver();
|
|
35
78
|
const el = /*#__PURE__*/_react.default.createElement(_main.default, {
|
|
36
79
|
model: this._model,
|
|
37
80
|
session: this._session
|
|
@@ -40,11 +83,9 @@ class MultiTraitRubric extends HTMLElement {
|
|
|
40
83
|
this._root = (0, _client.createRoot)(this);
|
|
41
84
|
}
|
|
42
85
|
this._root.render(el);
|
|
43
|
-
queueMicrotask(() => {
|
|
44
|
-
(0, _mathRendering.renderMath)(this);
|
|
45
|
-
});
|
|
46
86
|
}
|
|
47
87
|
disconnectedCallback() {
|
|
88
|
+
this._disconnectMathObserver();
|
|
48
89
|
if (this._root) {
|
|
49
90
|
this._root.unmount();
|
|
50
91
|
}
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_client","_piePlayerEvents","_main","_mathRendering","MultiTraitRubric","HTMLElement","constructor","_model","_session","_root","model","s","dispatchEvent","ModelSetEvent","tagName","toLowerCase","_render","session","connectedCallback","el","React","createElement","Main","createRoot","render","
|
|
1
|
+
{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_client","_piePlayerEvents","_main","_mathRendering","MultiTraitRubric","HTMLElement","constructor","_defineProperty2","default","_mathRenderPending","requestAnimationFrame","_mathObserver","disconnect","renderMath","setTimeout","observe","childList","subtree","_model","_session","_root","_initMathObserver","MutationObserver","_scheduleMathRender","_disconnectMathObserver","model","s","dispatchEvent","ModelSetEvent","tagName","toLowerCase","_render","session","connectedCallback","el","React","createElement","Main","createRoot","render","disconnectedCallback","unmount","exports"],"sources":["../src/index.js"],"sourcesContent":["import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { ModelSetEvent } from '@pie-framework/pie-player-events';\nimport Main from './main';\nimport { renderMath } from '@pie-lib/math-rendering';\n\nexport default class MultiTraitRubric extends HTMLElement {\n constructor() {\n super();\n this._model = {};\n this._session = null;\n this._root = null;\n this._mathObserver = null;\n this._mathRenderPending = false;\n }\n\n // React commits asynchronously, so a queueMicrotask(renderMath) can run before\n // the LaTeX spans are in the DOM and leave raw LaTeX on first render — this is\n // especially visible when this element is mounted inside complex-rubric, which\n // swaps its innerHTML and re-defines the inner element. Observing the DOM and\n // typesetting after each commit keeps math in sync regardless of timing.\n _scheduleMathRender = () => {\n if (this._mathRenderPending) return;\n this._mathRenderPending = true;\n\n requestAnimationFrame(() => {\n if (this._mathObserver) {\n this._mathObserver.disconnect();\n }\n renderMath(this);\n this._mathRenderPending = false;\n setTimeout(() => {\n if (this._mathObserver) {\n this._mathObserver.observe(this, { childList: true, subtree: true });\n }\n }, 50);\n });\n };\n\n _initMathObserver() {\n if (this._mathObserver) return;\n this._mathObserver = new MutationObserver(this._scheduleMathRender);\n this._mathObserver.observe(this, { childList: true, subtree: true });\n }\n\n _disconnectMathObserver() {\n if (this._mathObserver) {\n this._mathObserver.disconnect();\n this._mathObserver = null;\n }\n }\n\n set model(s) {\n this._model = s;\n this.dispatchEvent(new ModelSetEvent(this.tagName.toLowerCase(), this._session, !!this._model));\n\n this._render();\n }\n\n set session(s) {\n this._session = s;\n }\n\n get session() {\n return this._session;\n }\n\n connectedCallback() {\n this._initMathObserver();\n this._render();\n }\n\n _render() {\n this._initMathObserver();\n\n const el = React.createElement(Main, { model: this._model, session: this._session });\n\n if (!this._root) {\n this._root = createRoot(this);\n }\n this._root.render(el);\n }\n\n disconnectedCallback() {\n this._disconnectMathObserver();\n if (this._root) {\n this._root.unmount();\n }\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pie-element/multi-trait-rubric",
|
|
3
3
|
"repository": "pie-framework/pie-elements",
|
|
4
|
-
"version": "8.1.1-next.
|
|
4
|
+
"version": "8.1.1-next.44+7ba1005b3",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
7
7
|
},
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
"react": "18.3.1",
|
|
19
19
|
"react-dom": "18.3.1"
|
|
20
20
|
},
|
|
21
|
-
"gitHead": "
|
|
21
|
+
"gitHead": "7ba1005b3c46a4bed78d1512999d3a3981cb5448",
|
|
22
22
|
"scripts": {
|
|
23
23
|
"postpublish": "../../scripts/postpublish"
|
|
24
24
|
},
|