@pie-element/math-templated 7.1.1-next.13 → 7.1.1-next.138
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/CHANGELOG.json +1 -0
- package/CHANGELOG.md +1134 -0
- package/LICENSE.md +5 -0
- package/README.md +0 -0
- package/configure/CHANGELOG.json +1 -0
- package/configure/CHANGELOG.md +1011 -0
- package/configure/lib/defaults.js +172 -0
- package/configure/lib/defaults.js.map +1 -0
- package/configure/lib/design.js +546 -0
- package/configure/lib/design.js.map +1 -0
- package/configure/lib/index.js +173 -0
- package/configure/lib/index.js.map +1 -0
- package/configure/lib/markupUtils.js +39 -0
- package/configure/lib/markupUtils.js.map +1 -0
- package/configure/lib/response.js +394 -0
- package/configure/lib/response.js.map +1 -0
- package/configure/lib/utils.js +15 -0
- package/configure/lib/utils.js.map +1 -0
- package/configure/package.json +26 -0
- package/controller/CHANGELOG.json +1 -0
- package/controller/CHANGELOG.md +870 -0
- package/controller/lib/defaults.js +28 -0
- package/controller/lib/defaults.js.map +1 -0
- package/controller/lib/index.js +360 -0
- package/controller/lib/index.js.map +1 -0
- package/controller/package.json +17 -0
- package/docs/config-schema.json +2251 -0
- package/docs/config-schema.json.md +1658 -0
- package/docs/demo/config.js +8 -0
- package/docs/demo/generate.js +42 -0
- package/docs/demo/index.html +1 -0
- package/docs/demo/session.js +14 -0
- package/docs/pie-schema.json +1231 -0
- package/docs/pie-schema.json.md +894 -0
- package/lib/index.js +77 -0
- package/lib/index.js.map +1 -0
- package/lib/main.js +877 -0
- package/lib/main.js.map +1 -0
- package/lib/print.js +88 -0
- package/lib/print.js.map +1 -0
- package/module/configure.js +1 -0
- package/module/controller.js +3711 -0
- package/module/demo.js +67 -0
- package/module/element.js +1 -0
- package/module/index.html +21 -0
- package/module/manifest.json +22 -0
- package/module/print-demo.js +105 -0
- package/module/print.html +18 -0
- package/module/print.js +1 -0
- package/package.json +22 -93
- package/configure.js +0 -2
- package/controller.js +0 -1
- package/dist/author/defaults.d.ts +0 -173
- package/dist/author/defaults.js +0 -123
- package/dist/author/design.d.ts +0 -35
- package/dist/author/design.js +0 -360
- package/dist/author/index.d.ts +0 -42
- package/dist/author/index.js +0 -97
- package/dist/author/markupUtils.d.ts +0 -11
- package/dist/author/markupUtils.js +0 -10
- package/dist/author/response.d.ts +0 -41
- package/dist/author/response.js +0 -238
- package/dist/author/utils.d.ts +0 -9
- package/dist/author/utils.js +0 -7
- package/dist/browser/author/index.js +0 -37857
- package/dist/browser/author/index.js.map +0 -1
- package/dist/browser/browser-DJA4OL8j.js +0 -331
- package/dist/browser/browser-DJA4OL8j.js.map +0 -1
- package/dist/browser/controller/index.js +0 -37731
- package/dist/browser/controller/index.js.map +0 -1
- package/dist/browser/delivery/index.js +0 -81
- package/dist/browser/delivery/index.js.map +0 -1
- package/dist/browser/dist-CV_6q33a.js +0 -17046
- package/dist/browser/dist-CV_6q33a.js.map +0 -1
- package/dist/browser/dist-D9ARZhQk.js +0 -1426
- package/dist/browser/dist-D9ARZhQk.js.map +0 -1
- package/dist/browser/main-bsY-kJry.js +0 -1274
- package/dist/browser/main-bsY-kJry.js.map +0 -1
- package/dist/browser/math-templated.css +0 -2
- package/dist/browser/print/index.js +0 -47
- package/dist/browser/print/index.js.map +0 -1
- package/dist/controller/defaults.d.ts +0 -29
- package/dist/controller/defaults.js +0 -23
- package/dist/controller/index.d.ts +0 -45
- package/dist/controller/index.js +0 -154
- package/dist/delivery/index.d.ts +0 -20
- package/dist/delivery/index.js +0 -51
- package/dist/delivery/main.d.ts +0 -40
- package/dist/delivery/main.js +0 -492
- package/dist/index.d.ts +0 -1
- package/dist/index.iife.d.ts +0 -8
- package/dist/index.iife.js +0 -205
- package/dist/index.js +0 -2
- package/dist/math-templated.css +0 -2
- package/dist/print/index.d.ts +0 -15
- package/dist/print/index.js +0 -47
- package/dist/runtime-support.d.ts +0 -12
- package/dist/runtime-support.js +0 -12
|
@@ -0,0 +1,173 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.default = void 0;
|
|
8
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
+
var _react = _interopRequireDefault(require("react"));
|
|
10
|
+
var _client = require("react-dom/client");
|
|
11
|
+
var _debug = _interopRequireDefault(require("debug"));
|
|
12
|
+
var _lodashEs = require("lodash-es");
|
|
13
|
+
var _pieConfigureEvents = require("@pie-framework/pie-configure-events");
|
|
14
|
+
var _design = _interopRequireDefault(require("./design"));
|
|
15
|
+
var _defaults = _interopRequireDefault(require("./defaults"));
|
|
16
|
+
var _markupUtils = require("./markupUtils");
|
|
17
|
+
const log = (0, _debug.default)('math-templated:configure');
|
|
18
|
+
class MathTemplateConfigure extends HTMLElement {
|
|
19
|
+
constructor() {
|
|
20
|
+
super();
|
|
21
|
+
this._root = null;
|
|
22
|
+
this._model = MathTemplateConfigure.prepareModel();
|
|
23
|
+
this._configuration = _defaults.default.configuration;
|
|
24
|
+
this.onModelChanged = this.onModelChanged.bind(this);
|
|
25
|
+
this.onConfigurationChanged = this.onConfigurationChanged.bind(this);
|
|
26
|
+
}
|
|
27
|
+
set model(s) {
|
|
28
|
+
this._model = MathTemplateConfigure.prepareModel(s);
|
|
29
|
+
this._render();
|
|
30
|
+
}
|
|
31
|
+
set configuration(c) {
|
|
32
|
+
this._configuration = (0, _lodashEs.defaults)(c, _defaults.default.configuration);
|
|
33
|
+
|
|
34
|
+
// if language:enabled is true, then the corresponding default item model should include a language value;
|
|
35
|
+
// if it is false, then the language field should be omitted from the item model.
|
|
36
|
+
// if a default item model includes a language value (e.g., en_US) and the corresponding authoring view settings have language:settings = true,
|
|
37
|
+
// then (a) language:enabled should also be true, and (b) that default language value should be represented in languageChoices[] (as a key).
|
|
38
|
+
if (c.language?.enabled) {
|
|
39
|
+
if (c.languageChoices?.options?.length) {
|
|
40
|
+
this._model.language = c.languageChoices.options[0].value;
|
|
41
|
+
}
|
|
42
|
+
} else if (c.language.settings && this._model.language) {
|
|
43
|
+
this._configuration.language.enabled = true;
|
|
44
|
+
if (!this._configuration.languageChoices.options || !this._configuration.languageChoices.options.length) {
|
|
45
|
+
this._configuration.languageChoices.options = [];
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
// check if the language is already included in the languageChoices.options array
|
|
49
|
+
// and if not, then add it.
|
|
50
|
+
if (!this._configuration.languageChoices.options.find(option => option.value === this._model.language)) {
|
|
51
|
+
this._configuration.languageChoices.options.push({
|
|
52
|
+
value: this._model.language,
|
|
53
|
+
label: this._model.language
|
|
54
|
+
});
|
|
55
|
+
}
|
|
56
|
+
} else {
|
|
57
|
+
delete this._model.language;
|
|
58
|
+
}
|
|
59
|
+
this._render();
|
|
60
|
+
}
|
|
61
|
+
set disableSidePanel(s) {
|
|
62
|
+
this._disableSidePanel = s;
|
|
63
|
+
this._render();
|
|
64
|
+
}
|
|
65
|
+
dispatchModelUpdated(reset) {
|
|
66
|
+
const resetValue = !!reset;
|
|
67
|
+
this.dispatchEvent(new _pieConfigureEvents.ModelUpdatedEvent(this._model, resetValue));
|
|
68
|
+
}
|
|
69
|
+
onModelChanged(m, reset) {
|
|
70
|
+
this._model = MathTemplateConfigure.prepareModel(m);
|
|
71
|
+
this._render();
|
|
72
|
+
this.dispatchModelUpdated(reset);
|
|
73
|
+
}
|
|
74
|
+
onConfigurationChanged(c) {
|
|
75
|
+
this._configuration = c;
|
|
76
|
+
this._render();
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
/** @param {done, progress, file} handler */
|
|
80
|
+
insertImage(handler) {
|
|
81
|
+
this.dispatchEvent(new _pieConfigureEvents.InsertImageEvent(handler));
|
|
82
|
+
}
|
|
83
|
+
onDeleteImage(src, done) {
|
|
84
|
+
this.dispatchEvent(new _pieConfigureEvents.DeleteImageEvent(src, done));
|
|
85
|
+
}
|
|
86
|
+
insertSound(handler) {
|
|
87
|
+
this.dispatchEvent(new _pieConfigureEvents.InsertSoundEvent(handler));
|
|
88
|
+
}
|
|
89
|
+
onDeleteSound(src, done) {
|
|
90
|
+
this.dispatchEvent(new _pieConfigureEvents.DeleteSoundEvent(src, done));
|
|
91
|
+
}
|
|
92
|
+
_render() {
|
|
93
|
+
log('_render');
|
|
94
|
+
let element = /*#__PURE__*/_react.default.createElement(_design.default, {
|
|
95
|
+
model: this._model,
|
|
96
|
+
configuration: this._configuration,
|
|
97
|
+
onModelChanged: this.onModelChanged,
|
|
98
|
+
onConfigurationChanged: this.onConfigurationChanged,
|
|
99
|
+
disableSidePanel: this._disableSidePanel,
|
|
100
|
+
imageSupport: {
|
|
101
|
+
add: this.insertImage.bind(this),
|
|
102
|
+
delete: this.onDeleteImage.bind(this)
|
|
103
|
+
},
|
|
104
|
+
uploadSoundSupport: {
|
|
105
|
+
add: this.insertSound.bind(this),
|
|
106
|
+
delete: this.onDeleteSound.bind(this)
|
|
107
|
+
}
|
|
108
|
+
});
|
|
109
|
+
if (!this._root) {
|
|
110
|
+
this._root = (0, _client.createRoot)(this);
|
|
111
|
+
}
|
|
112
|
+
this._root.render(element);
|
|
113
|
+
}
|
|
114
|
+
connectedCallback() {
|
|
115
|
+
this._render();
|
|
116
|
+
}
|
|
117
|
+
disconnectedCallback() {
|
|
118
|
+
if (this._root) {
|
|
119
|
+
this._root.unmount();
|
|
120
|
+
this._root = null;
|
|
121
|
+
}
|
|
122
|
+
}
|
|
123
|
+
}
|
|
124
|
+
exports.default = MathTemplateConfigure;
|
|
125
|
+
(0, _defineProperty2.default)(MathTemplateConfigure, "prepareModel", (model = {}) => {
|
|
126
|
+
const {
|
|
127
|
+
validationDefault,
|
|
128
|
+
allowTrailingZerosDefault,
|
|
129
|
+
ignoreOrderDefault,
|
|
130
|
+
responses = {}
|
|
131
|
+
} = model;
|
|
132
|
+
const updatedResponses = Object.keys(responses).reduce((acc, responseId) => {
|
|
133
|
+
const correctResponse = responses[responseId];
|
|
134
|
+
acc[responseId] = {
|
|
135
|
+
...correctResponse,
|
|
136
|
+
validation: correctResponse.validation || validationDefault,
|
|
137
|
+
allowTrailingZeros: correctResponse.allowTrailingZeros || allowTrailingZerosDefault,
|
|
138
|
+
ignoreOrder: correctResponse.ignoreOrder || ignoreOrderDefault
|
|
139
|
+
};
|
|
140
|
+
return acc;
|
|
141
|
+
}, {});
|
|
142
|
+
const joinedObj = {
|
|
143
|
+
..._defaults.default.model,
|
|
144
|
+
...model,
|
|
145
|
+
responses: updatedResponses
|
|
146
|
+
};
|
|
147
|
+
const slateMarkup = joinedObj.slateMarkup || (0, _markupUtils.createSlateMarkup)(joinedObj.markup, joinedObj.responses);
|
|
148
|
+
const processedMarkup = (0, _markupUtils.processMarkup)(slateMarkup);
|
|
149
|
+
|
|
150
|
+
// this was added to treat an exception, when the model has responses without the "answer" property
|
|
151
|
+
if (joinedObj.responses) {
|
|
152
|
+
Object.keys(joinedObj.responses).forEach(key => {
|
|
153
|
+
if ((0, _lodashEs.isArray)(joinedObj.responses[key])) {
|
|
154
|
+
joinedObj.responses[key] = (joinedObj.responses[key] || []).map((item, index) => {
|
|
155
|
+
if (!item.answer) {
|
|
156
|
+
log('Choice does not contain "answer" property, which is required.', item);
|
|
157
|
+
return {
|
|
158
|
+
answer: `${index}`,
|
|
159
|
+
...item
|
|
160
|
+
};
|
|
161
|
+
}
|
|
162
|
+
return item;
|
|
163
|
+
});
|
|
164
|
+
}
|
|
165
|
+
});
|
|
166
|
+
}
|
|
167
|
+
return {
|
|
168
|
+
...joinedObj,
|
|
169
|
+
slateMarkup,
|
|
170
|
+
markup: processedMarkup
|
|
171
|
+
};
|
|
172
|
+
});
|
|
173
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_client","_debug","_lodashEs","_pieConfigureEvents","_design","_defaults","_markupUtils","log","debug","MathTemplateConfigure","HTMLElement","constructor","_root","_model","prepareModel","_configuration","sensibleDefaults","configuration","onModelChanged","bind","onConfigurationChanged","model","s","_render","c","defaults","language","enabled","languageChoices","options","length","value","settings","find","option","push","label","disableSidePanel","_disableSidePanel","dispatchModelUpdated","reset","resetValue","dispatchEvent","ModelUpdatedEvent","m","insertImage","handler","InsertImageEvent","onDeleteImage","src","done","DeleteImageEvent","insertSound","InsertSoundEvent","onDeleteSound","DeleteSoundEvent","element","React","createElement","Main","imageSupport","add","delete","uploadSoundSupport","createRoot","render","connectedCallback","disconnectedCallback","unmount","exports","default","_defineProperty2","validationDefault","allowTrailingZerosDefault","ignoreOrderDefault","responses","updatedResponses","Object","keys","reduce","acc","responseId","correctResponse","validation","allowTrailingZeros","ignoreOrder","joinedObj","slateMarkup","createSlateMarkup","markup","processedMarkup","processMarkup","forEach","key","isArray","map","item","index","answer"],"sources":["../src/index.js"],"sourcesContent":["import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport debug from 'debug';\nimport { defaults, isArray } from 'lodash-es';\nimport {\n ModelUpdatedEvent,\n DeleteImageEvent,\n InsertImageEvent,\n InsertSoundEvent,\n DeleteSoundEvent,\n} from '@pie-framework/pie-configure-events';\n\nimport Main from './design';\n\nimport sensibleDefaults from './defaults';\nimport { processMarkup, createSlateMarkup } from './markupUtils';\n\nconst log = debug('math-templated:configure');\n\nexport default class MathTemplateConfigure extends HTMLElement {\n static prepareModel = (model = {}) => {\n const { validationDefault, allowTrailingZerosDefault, ignoreOrderDefault, responses = {} } = model;\n\n const updatedResponses = Object.keys(responses).reduce((acc, responseId) => {\n const correctResponse = responses[responseId];\n\n acc[responseId] = {\n ...correctResponse,\n validation: correctResponse.validation || validationDefault,\n allowTrailingZeros: correctResponse.allowTrailingZeros || allowTrailingZerosDefault,\n ignoreOrder: correctResponse.ignoreOrder || ignoreOrderDefault,\n };\n\n return acc;\n }, {});\n\n const joinedObj = {\n ...sensibleDefaults.model,\n ...model,\n responses: updatedResponses,\n };\n\n const slateMarkup = joinedObj.slateMarkup || createSlateMarkup(joinedObj.markup, joinedObj.responses);\n const processedMarkup = processMarkup(slateMarkup);\n\n // this was added to treat an exception, when the model has responses without the \"answer\" property\n if (joinedObj.responses) {\n Object.keys(joinedObj.responses).forEach((key) => {\n if (isArray(joinedObj.responses[key])) {\n joinedObj.responses[key] = (joinedObj.responses[key] || []).map((item, index) => {\n if (!item.answer) {\n log('Choice does not contain \"answer\" property, which is required.', item);\n return { answer: `${index}`, ...item };\n }\n\n return item;\n });\n }\n });\n }\n\n return {\n ...joinedObj,\n slateMarkup,\n markup: processedMarkup,\n };\n };\n\n constructor() {\n super();\n this._root = null;\n this._model = MathTemplateConfigure.prepareModel();\n this._configuration = sensibleDefaults.configuration;\n this.onModelChanged = this.onModelChanged.bind(this);\n this.onConfigurationChanged = this.onConfigurationChanged.bind(this);\n }\n\n set model(s) {\n this._model = MathTemplateConfigure.prepareModel(s);\n this._render();\n }\n\n set configuration(c) {\n this._configuration = defaults(c, sensibleDefaults.configuration);\n\n // if language:enabled is true, then the corresponding default item model should include a language value;\n // if it is false, then the language field should be omitted from the item model.\n // if a default item model includes a language value (e.g., en_US) and the corresponding authoring view settings have language:settings = true,\n // then (a) language:enabled should also be true, and (b) that default language value should be represented in languageChoices[] (as a key).\n if (c.language?.enabled) {\n if (c.languageChoices?.options?.length) {\n this._model.language = c.languageChoices.options[0].value;\n }\n } else if (c.language.settings && this._model.language) {\n this._configuration.language.enabled = true;\n\n if (!this._configuration.languageChoices.options || !this._configuration.languageChoices.options.length) {\n this._configuration.languageChoices.options = [];\n }\n\n // check if the language is already included in the languageChoices.options array\n // and if not, then add it.\n if (!this._configuration.languageChoices.options.find((option) => option.value === this._model.language)) {\n this._configuration.languageChoices.options.push({\n value: this._model.language,\n label: this._model.language,\n });\n }\n } else {\n delete this._model.language;\n }\n\n this._render();\n }\n\n set disableSidePanel(s) {\n this._disableSidePanel = s;\n this._render();\n }\n\n dispatchModelUpdated(reset) {\n const resetValue = !!reset;\n\n this.dispatchEvent(new ModelUpdatedEvent(this._model, resetValue));\n }\n\n onModelChanged(m, reset) {\n this._model = MathTemplateConfigure.prepareModel(m);\n this._render();\n this.dispatchModelUpdated(reset);\n }\n\n onConfigurationChanged(c) {\n this._configuration = c;\n this._render();\n }\n\n /** @param {done, progress, file} handler */\n insertImage(handler) {\n this.dispatchEvent(new InsertImageEvent(handler));\n }\n\n onDeleteImage(src, done) {\n this.dispatchEvent(new DeleteImageEvent(src, done));\n }\n\n insertSound(handler) {\n this.dispatchEvent(new InsertSoundEvent(handler));\n }\n\n onDeleteSound(src, done) {\n this.dispatchEvent(new DeleteSoundEvent(src, done));\n }\n\n _render() {\n log('_render');\n\n let element = React.createElement(Main, {\n model: this._model,\n configuration: this._configuration,\n onModelChanged: this.onModelChanged,\n onConfigurationChanged: this.onConfigurationChanged,\n disableSidePanel: this._disableSidePanel,\n imageSupport: {\n add: this.insertImage.bind(this),\n delete: this.onDeleteImage.bind(this),\n },\n uploadSoundSupport: {\n add: this.insertSound.bind(this),\n delete: this.onDeleteSound.bind(this),\n },\n });\n\n if (!this._root) {\n this._root = createRoot(this);\n }\n this._root.render(element);\n }\n\n connectedCallback() {\n this._render();\n }\n\n disconnectedCallback() {\n if (this._root) {\n this._root.unmount();\n this._root = null;\n }\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.removeUnwantedCharacters = exports.processMarkup = exports.createSlateMarkup = void 0;
|
|
7
|
+
// do not remove \t from \times, \triangle, \tan, \theta or \therefore
|
|
8
|
+
const tSymbols = 'imes|riangle|an|heta|herefore';
|
|
9
|
+
// do not remove \n from \nthroot, \nparallel, \ncong, \napprox, \neq, \ne or \nsim
|
|
10
|
+
const nSymbols = 'throot|parallel|cong|approx|eq|e|sim';
|
|
11
|
+
// match all \t and \n that are not part of math symbols that starts with \t or \n
|
|
12
|
+
const matchTabAndNewLine = new RegExp(`(\\t(?!${tSymbols}))|(\\n(?!${nSymbols}))|(\\\\t(?!${tSymbols}))|(\\\\n(?!${nSymbols}))`, 'g');
|
|
13
|
+
const removeUnwantedCharacters = markup => markup.replace(matchTabAndNewLine, '').replace(/\\"/g, '"').replace(/\\\//g, '/');
|
|
14
|
+
exports.removeUnwantedCharacters = removeUnwantedCharacters;
|
|
15
|
+
const createElementFromHTML = (htmlString = '') => {
|
|
16
|
+
const div = document.createElement('div');
|
|
17
|
+
div.innerHTML = htmlString.trim();
|
|
18
|
+
return div;
|
|
19
|
+
};
|
|
20
|
+
const processMarkup = markup => {
|
|
21
|
+
const newMarkup = removeUnwantedCharacters(markup || '');
|
|
22
|
+
const slateMarkup = createElementFromHTML(newMarkup || '');
|
|
23
|
+
slateMarkup.querySelectorAll('[data-type="math_templated"]').forEach(s => s.replaceWith(`{{${s.dataset.index}}}`));
|
|
24
|
+
return slateMarkup.innerHTML;
|
|
25
|
+
};
|
|
26
|
+
exports.processMarkup = processMarkup;
|
|
27
|
+
const REGEX = /\{\{(\d+)\}\}/g;
|
|
28
|
+
const createSlateMarkup = (markup, responses) => {
|
|
29
|
+
if (!markup) {
|
|
30
|
+
return '';
|
|
31
|
+
}
|
|
32
|
+
const newMarkup = removeUnwantedCharacters(markup);
|
|
33
|
+
return newMarkup.replace(REGEX, (match, groupIndex) => {
|
|
34
|
+
const responseValue = responses[groupIndex]?.answer || '';
|
|
35
|
+
return `<span data-type="math_templated" data-index="${groupIndex}" data-value="${responseValue}"></span>`;
|
|
36
|
+
});
|
|
37
|
+
};
|
|
38
|
+
exports.createSlateMarkup = createSlateMarkup;
|
|
39
|
+
//# sourceMappingURL=markupUtils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"markupUtils.js","names":["tSymbols","nSymbols","matchTabAndNewLine","RegExp","removeUnwantedCharacters","markup","replace","exports","createElementFromHTML","htmlString","div","document","createElement","innerHTML","trim","processMarkup","newMarkup","slateMarkup","querySelectorAll","forEach","s","replaceWith","dataset","index","REGEX","createSlateMarkup","responses","match","groupIndex","responseValue","answer"],"sources":["../src/markupUtils.js"],"sourcesContent":["// do not remove \\t from \\times, \\triangle, \\tan, \\theta or \\therefore\nconst tSymbols = 'imes|riangle|an|heta|herefore';\n// do not remove \\n from \\nthroot, \\nparallel, \\ncong, \\napprox, \\neq, \\ne or \\nsim\nconst nSymbols = 'throot|parallel|cong|approx|eq|e|sim';\n// match all \\t and \\n that are not part of math symbols that starts with \\t or \\n\nconst matchTabAndNewLine = new RegExp(\n `(\\\\t(?!${tSymbols}))|(\\\\n(?!${nSymbols}))|(\\\\\\\\t(?!${tSymbols}))|(\\\\\\\\n(?!${nSymbols}))`,\n 'g'\n);\n\nexport const removeUnwantedCharacters = (markup) =>\n markup.replace(matchTabAndNewLine, '').replace(/\\\\\"/g, '\"').replace(/\\\\\\//g, '/');\n\nconst createElementFromHTML = (htmlString = '') => {\n const div = document.createElement('div');\n\n div.innerHTML = htmlString.trim();\n\n return div;\n};\n\nexport const processMarkup = (markup) => {\n const newMarkup = removeUnwantedCharacters(markup || '');\n const slateMarkup = createElementFromHTML(newMarkup || '');\n\n slateMarkup.querySelectorAll('[data-type=\"math_templated\"]')\n .forEach((s) => s.replaceWith(`{{${s.dataset.index}}}`));\n\n return slateMarkup.innerHTML;\n};\n\nconst REGEX = /\\{\\{(\\d+)\\}\\}/g;\n\nexport const createSlateMarkup = (markup, responses) => {\n if (!markup) {\n return '';\n }\n\n const newMarkup = removeUnwantedCharacters(markup);\n\n return newMarkup.replace(REGEX, (match, groupIndex) => {\n const responseValue = responses[groupIndex]?.answer || '';\n return `<span data-type=\"math_templated\" data-index=\"${groupIndex}\" data-value=\"${responseValue}\"></span>`;\n });\n};\n"],"mappings":";;;;;;AAAA;AACA,MAAMA,QAAQ,GAAG,+BAA+B;AAChD;AACA,MAAMC,QAAQ,GAAG,sCAAsC;AACvD;AACA,MAAMC,kBAAkB,GAAG,IAAIC,MAAM,CACnC,UAAUH,QAAQ,aAAaC,QAAQ,eAAeD,QAAQ,eAAeC,QAAQ,IAAI,EACzF,GACF,CAAC;AAEM,MAAMG,wBAAwB,GAAIC,MAAM,IAC7CA,MAAM,CAACC,OAAO,CAACJ,kBAAkB,EAAE,EAAE,CAAC,CAACI,OAAO,CAAC,MAAM,EAAE,GAAG,CAAC,CAACA,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC;AAACC,OAAA,CAAAH,wBAAA,GAAAA,wBAAA;AAEpF,MAAMI,qBAAqB,GAAGA,CAACC,UAAU,GAAG,EAAE,KAAK;EACjD,MAAMC,GAAG,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;EAEzCF,GAAG,CAACG,SAAS,GAAGJ,UAAU,CAACK,IAAI,CAAC,CAAC;EAEjC,OAAOJ,GAAG;AACZ,CAAC;AAEM,MAAMK,aAAa,GAAIV,MAAM,IAAK;EACvC,MAAMW,SAAS,GAAGZ,wBAAwB,CAACC,MAAM,IAAI,EAAE,CAAC;EACxD,MAAMY,WAAW,GAAGT,qBAAqB,CAACQ,SAAS,IAAI,EAAE,CAAC;EAE1DC,WAAW,CAACC,gBAAgB,CAAC,8BAA8B,CAAC,CACzDC,OAAO,CAAEC,CAAC,IAAKA,CAAC,CAACC,WAAW,CAAC,KAAKD,CAAC,CAACE,OAAO,CAACC,KAAK,IAAI,CAAC,CAAC;EAE1D,OAAON,WAAW,CAACJ,SAAS;AAC9B,CAAC;AAACN,OAAA,CAAAQ,aAAA,GAAAA,aAAA;AAEF,MAAMS,KAAK,GAAG,gBAAgB;AAEvB,MAAMC,iBAAiB,GAAGA,CAACpB,MAAM,EAAEqB,SAAS,KAAK;EACtD,IAAI,CAACrB,MAAM,EAAE;IACX,OAAO,EAAE;EACX;EAEA,MAAMW,SAAS,GAAGZ,wBAAwB,CAACC,MAAM,CAAC;EAElD,OAAOW,SAAS,CAACV,OAAO,CAACkB,KAAK,EAAE,CAACG,KAAK,EAAEC,UAAU,KAAK;IACrD,MAAMC,aAAa,GAAGH,SAAS,CAACE,UAAU,CAAC,EAAEE,MAAM,IAAI,EAAE;IACzD,OAAO,gDAAgDF,UAAU,iBAAiBC,aAAa,WAAW;EAC5G,CAAC,CAAC;AACJ,CAAC;AAACtB,OAAA,CAAAkB,iBAAA,GAAAA,iBAAA","ignoreList":[]}
|
|
@@ -0,0 +1,394 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.default = exports.Response = void 0;
|
|
8
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
+
var React = _interopRequireWildcard(require("react"));
|
|
10
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
11
|
+
var _configUi = require("@pie-lib/config-ui");
|
|
12
|
+
var _mathToolbar = require("@pie-lib/math-toolbar");
|
|
13
|
+
var _Card = _interopRequireDefault(require("@mui/material/Card"));
|
|
14
|
+
var _CardContent = _interopRequireDefault(require("@mui/material/CardContent"));
|
|
15
|
+
var _Button = _interopRequireDefault(require("@mui/material/Button"));
|
|
16
|
+
var _FormControlLabel = _interopRequireDefault(require("@mui/material/FormControlLabel"));
|
|
17
|
+
var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
|
|
18
|
+
var _InputLabel = _interopRequireDefault(require("@mui/material/InputLabel"));
|
|
19
|
+
var _Checkbox = _interopRequireDefault(require("@mui/material/Checkbox"));
|
|
20
|
+
var _Select = _interopRequireDefault(require("@mui/material/Select"));
|
|
21
|
+
var _MenuItem = _interopRequireDefault(require("@mui/material/MenuItem"));
|
|
22
|
+
var _styles = require("@mui/material/styles");
|
|
23
|
+
var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
|
|
24
|
+
var _Delete = _interopRequireDefault(require("@mui/icons-material/Delete"));
|
|
25
|
+
var _renderUi = require("@pie-lib/render-ui");
|
|
26
|
+
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
27
|
+
const ResponseContainer = (0, _styles.styled)(_Card.default)(({
|
|
28
|
+
theme
|
|
29
|
+
}) => ({
|
|
30
|
+
marginBottom: theme.spacing(2.5),
|
|
31
|
+
width: '100%',
|
|
32
|
+
minWidth: '548px',
|
|
33
|
+
border: `1px solid ${_renderUi.color.borderDark()}`,
|
|
34
|
+
display: 'flex',
|
|
35
|
+
flexDirection: 'column',
|
|
36
|
+
justifyContent: 'space-between'
|
|
37
|
+
}));
|
|
38
|
+
const StyledCardContent = (0, _styles.styled)(_CardContent.default)(({
|
|
39
|
+
theme
|
|
40
|
+
}) => ({
|
|
41
|
+
paddingBottom: `${theme.spacing(2)} !important`
|
|
42
|
+
}));
|
|
43
|
+
const StyledTitle = (0, _styles.styled)(_Typography.default)({
|
|
44
|
+
fontWeight: 700,
|
|
45
|
+
fontSize: '1.2rem',
|
|
46
|
+
flex: 3
|
|
47
|
+
});
|
|
48
|
+
const StyledSelectContainer = (0, _styles.styled)(_configUi.InputContainer)(({
|
|
49
|
+
theme
|
|
50
|
+
}) => ({
|
|
51
|
+
flex: 2,
|
|
52
|
+
'& > *:not(label)': {
|
|
53
|
+
marginTop: theme.spacing(1)
|
|
54
|
+
}
|
|
55
|
+
}));
|
|
56
|
+
const InputContainerWrapper = (0, _styles.styled)('div')(({
|
|
57
|
+
theme
|
|
58
|
+
}) => ({
|
|
59
|
+
marginBottom: theme.spacing(2)
|
|
60
|
+
}));
|
|
61
|
+
const TitleBar = (0, _styles.styled)('div')({
|
|
62
|
+
display: 'flex',
|
|
63
|
+
alignItems: 'center',
|
|
64
|
+
justifyContent: 'space-between'
|
|
65
|
+
});
|
|
66
|
+
const FlexContainer = (0, _styles.styled)('div')({
|
|
67
|
+
display: 'flex'
|
|
68
|
+
});
|
|
69
|
+
const AlternateButton = (0, _styles.styled)(_Button.default)(() => ({
|
|
70
|
+
border: `1px solid ${_renderUi.color.border()}`,
|
|
71
|
+
color: _renderUi.color.text()
|
|
72
|
+
}));
|
|
73
|
+
const RemoveAlternateButton = (0, _styles.styled)(_IconButton.default)(({
|
|
74
|
+
theme
|
|
75
|
+
}) => ({
|
|
76
|
+
marginLeft: theme.spacing(1)
|
|
77
|
+
}));
|
|
78
|
+
const ErrorText = (0, _styles.styled)('div')(({
|
|
79
|
+
theme
|
|
80
|
+
}) => ({
|
|
81
|
+
fontSize: theme.typography.fontSize - 2,
|
|
82
|
+
color: theme.palette.error.main,
|
|
83
|
+
paddingTop: theme.spacing(1)
|
|
84
|
+
}));
|
|
85
|
+
|
|
86
|
+
// Fill and ink move together so the slot label stays legible on whatever the fill becomes.
|
|
87
|
+
const ResponseBox = (0, _styles.styled)('div')(() => ({
|
|
88
|
+
background: _renderUi.color.backgroundDark(),
|
|
89
|
+
color: _renderUi.color.text(),
|
|
90
|
+
display: 'inline',
|
|
91
|
+
minWidth: '50px',
|
|
92
|
+
padding: '8px',
|
|
93
|
+
// #C0C3CF is `--pie-blue-grey-300`'s default, but that token is a fill and measures
|
|
94
|
+
// 1.00:1 against some schemes' backgrounds; the slot outline needs the stroke token.
|
|
95
|
+
border: `1px solid ${_renderUi.color.border()}`
|
|
96
|
+
}));
|
|
97
|
+
const AlternateBar = (0, _styles.styled)('div')({
|
|
98
|
+
display: 'flex',
|
|
99
|
+
justifyContent: 'space-between',
|
|
100
|
+
alignItems: 'center'
|
|
101
|
+
});
|
|
102
|
+
const CustomColorCheckbox = (0, _styles.styled)(_Checkbox.default)({
|
|
103
|
+
color: `${_renderUi.color.tertiary()} !important`
|
|
104
|
+
});
|
|
105
|
+
|
|
106
|
+
// CSS for MathToolbar classNames (used as strings)
|
|
107
|
+
if (typeof document !== 'undefined') {
|
|
108
|
+
const styleId = 'math-templated-response-styles';
|
|
109
|
+
if (!document.getElementById(styleId)) {
|
|
110
|
+
const style = document.createElement('style');
|
|
111
|
+
style.id = styleId;
|
|
112
|
+
style.textContent = `
|
|
113
|
+
.response-editor {
|
|
114
|
+
display: flex;
|
|
115
|
+
align-items: center;
|
|
116
|
+
justify-content: center;
|
|
117
|
+
width: 100%;
|
|
118
|
+
min-width: 500px;
|
|
119
|
+
max-width: 900px;
|
|
120
|
+
height: auto;
|
|
121
|
+
min-height: 40px;
|
|
122
|
+
}
|
|
123
|
+
.math-toolbar {
|
|
124
|
+
width: 100%;
|
|
125
|
+
}
|
|
126
|
+
`;
|
|
127
|
+
document.head.appendChild(style);
|
|
128
|
+
}
|
|
129
|
+
}
|
|
130
|
+
class Response extends React.Component {
|
|
131
|
+
constructor(props) {
|
|
132
|
+
super(props);
|
|
133
|
+
(0, _defineProperty2.default)(this, "onChange", name => evt => {
|
|
134
|
+
const {
|
|
135
|
+
response,
|
|
136
|
+
onResponseChange,
|
|
137
|
+
responseKey
|
|
138
|
+
} = this.props;
|
|
139
|
+
const newResponse = {
|
|
140
|
+
...response
|
|
141
|
+
};
|
|
142
|
+
newResponse[name] = evt.target.value;
|
|
143
|
+
onResponseChange(newResponse, responseKey);
|
|
144
|
+
});
|
|
145
|
+
(0, _defineProperty2.default)(this, "onConfigChanged", name => evt => {
|
|
146
|
+
const {
|
|
147
|
+
response,
|
|
148
|
+
onResponseChange,
|
|
149
|
+
responseKey
|
|
150
|
+
} = this.props;
|
|
151
|
+
const newResponse = {
|
|
152
|
+
...response
|
|
153
|
+
};
|
|
154
|
+
newResponse[name] = evt.target.checked;
|
|
155
|
+
onResponseChange(newResponse, responseKey);
|
|
156
|
+
});
|
|
157
|
+
(0, _defineProperty2.default)(this, "onLiteralOptionsChange", name => () => {
|
|
158
|
+
const {
|
|
159
|
+
response,
|
|
160
|
+
onResponseChange,
|
|
161
|
+
responseKey
|
|
162
|
+
} = this.props;
|
|
163
|
+
const newResponse = {
|
|
164
|
+
...response
|
|
165
|
+
};
|
|
166
|
+
newResponse[name] = !response[name];
|
|
167
|
+
onResponseChange(newResponse, responseKey);
|
|
168
|
+
});
|
|
169
|
+
(0, _defineProperty2.default)(this, "onAnswerChange", answer => {
|
|
170
|
+
const {
|
|
171
|
+
response,
|
|
172
|
+
onResponseChange,
|
|
173
|
+
responseKey
|
|
174
|
+
} = this.props;
|
|
175
|
+
const newResponse = {
|
|
176
|
+
...response
|
|
177
|
+
};
|
|
178
|
+
newResponse.answer = answer;
|
|
179
|
+
onResponseChange(newResponse, responseKey);
|
|
180
|
+
});
|
|
181
|
+
(0, _defineProperty2.default)(this, "onAlternateAnswerChange", alternateId => answer => {
|
|
182
|
+
const {
|
|
183
|
+
response,
|
|
184
|
+
onResponseChange,
|
|
185
|
+
responseKey
|
|
186
|
+
} = this.props;
|
|
187
|
+
const newResponse = {
|
|
188
|
+
...response
|
|
189
|
+
};
|
|
190
|
+
newResponse.alternates[alternateId] = answer;
|
|
191
|
+
onResponseChange(newResponse, responseKey);
|
|
192
|
+
});
|
|
193
|
+
(0, _defineProperty2.default)(this, "onAddAlternate", () => {
|
|
194
|
+
const {
|
|
195
|
+
response,
|
|
196
|
+
onResponseChange,
|
|
197
|
+
responseKey
|
|
198
|
+
} = this.props;
|
|
199
|
+
const {
|
|
200
|
+
alternateIdCounter
|
|
201
|
+
} = this.state;
|
|
202
|
+
const newResponse = {
|
|
203
|
+
...response
|
|
204
|
+
};
|
|
205
|
+
if (!newResponse.alternates) {
|
|
206
|
+
newResponse.alternates = {};
|
|
207
|
+
}
|
|
208
|
+
newResponse.alternates[alternateIdCounter] = '';
|
|
209
|
+
onResponseChange(newResponse, responseKey);
|
|
210
|
+
this.setState({
|
|
211
|
+
alternateIdCounter: alternateIdCounter + 1
|
|
212
|
+
});
|
|
213
|
+
});
|
|
214
|
+
(0, _defineProperty2.default)(this, "onRemoveAlternate", alternateId => () => {
|
|
215
|
+
const {
|
|
216
|
+
response,
|
|
217
|
+
onResponseChange,
|
|
218
|
+
responseKey
|
|
219
|
+
} = this.props;
|
|
220
|
+
const newResponse = {
|
|
221
|
+
...response
|
|
222
|
+
};
|
|
223
|
+
delete newResponse.alternates[alternateId];
|
|
224
|
+
onResponseChange(newResponse, responseKey);
|
|
225
|
+
this.setState(state => ({
|
|
226
|
+
showKeypad: {
|
|
227
|
+
...state.showKeypad,
|
|
228
|
+
openCount: !state.showKeypad[alternateId] ? state.showKeypad.openCount : state.showKeypad.openCount - 1
|
|
229
|
+
}
|
|
230
|
+
}));
|
|
231
|
+
});
|
|
232
|
+
(0, _defineProperty2.default)(this, "onDone", () => {
|
|
233
|
+
const {
|
|
234
|
+
onResponseDone
|
|
235
|
+
} = this.props;
|
|
236
|
+
this.setState(state => ({
|
|
237
|
+
showKeypad: {
|
|
238
|
+
...state.showKeypad,
|
|
239
|
+
openCount: state.showKeypad.openCount - 1,
|
|
240
|
+
main: false
|
|
241
|
+
}
|
|
242
|
+
}));
|
|
243
|
+
onResponseDone();
|
|
244
|
+
});
|
|
245
|
+
(0, _defineProperty2.default)(this, "onFocus", () => {
|
|
246
|
+
this.setState(state => ({
|
|
247
|
+
showKeypad: {
|
|
248
|
+
...state.showKeypad,
|
|
249
|
+
openCount: !state.showKeypad.main ? state.showKeypad.openCount + 1 : state.showKeypad.openCount,
|
|
250
|
+
main: true
|
|
251
|
+
}
|
|
252
|
+
}));
|
|
253
|
+
});
|
|
254
|
+
(0, _defineProperty2.default)(this, "onAlternateFocus", alternateId => () => {
|
|
255
|
+
this.setState(state => ({
|
|
256
|
+
showKeypad: {
|
|
257
|
+
...state.showKeypad,
|
|
258
|
+
openCount: !state.showKeypad[alternateId] ? state.showKeypad.openCount + 1 : state.showKeypad.openCount,
|
|
259
|
+
[alternateId]: true
|
|
260
|
+
}
|
|
261
|
+
}));
|
|
262
|
+
});
|
|
263
|
+
(0, _defineProperty2.default)(this, "onAlternateDone", alternateId => () => {
|
|
264
|
+
this.setState(state => ({
|
|
265
|
+
showKeypad: {
|
|
266
|
+
...state.showKeypad,
|
|
267
|
+
openCount: state.showKeypad.openCount - 1,
|
|
268
|
+
[alternateId]: false
|
|
269
|
+
}
|
|
270
|
+
}));
|
|
271
|
+
});
|
|
272
|
+
const {
|
|
273
|
+
response: {
|
|
274
|
+
alternates
|
|
275
|
+
} = {}
|
|
276
|
+
} = props || {};
|
|
277
|
+
const alternatesLength = Object.keys(alternates || {}).length;
|
|
278
|
+
this.state = {
|
|
279
|
+
alternateIdCounter: alternatesLength + 1,
|
|
280
|
+
showKeypad: {
|
|
281
|
+
openCount: 0,
|
|
282
|
+
main: false
|
|
283
|
+
}
|
|
284
|
+
};
|
|
285
|
+
}
|
|
286
|
+
render() {
|
|
287
|
+
const {
|
|
288
|
+
mode,
|
|
289
|
+
responseKey,
|
|
290
|
+
response,
|
|
291
|
+
cAllowTrailingZeros,
|
|
292
|
+
cIgnoreOrder,
|
|
293
|
+
error
|
|
294
|
+
} = this.props;
|
|
295
|
+
const {
|
|
296
|
+
showKeypad
|
|
297
|
+
} = this.state;
|
|
298
|
+
const {
|
|
299
|
+
validation,
|
|
300
|
+
answer,
|
|
301
|
+
alternates,
|
|
302
|
+
ignoreOrder,
|
|
303
|
+
allowTrailingZeros
|
|
304
|
+
} = response;
|
|
305
|
+
const hasAlternates = Object.keys(alternates || {}).length > 0;
|
|
306
|
+
const classNames = {
|
|
307
|
+
editor: 'response-editor',
|
|
308
|
+
mathToolbar: 'math-toolbar'
|
|
309
|
+
};
|
|
310
|
+
const styles = {
|
|
311
|
+
minHeight: `${showKeypad.openCount > 0 ? 430 : 230}px`
|
|
312
|
+
};
|
|
313
|
+
// add 1 to index to display R 1 instead of R 0
|
|
314
|
+
const keyToDisplay = `R ${parseInt(responseKey) + 1}`;
|
|
315
|
+
return /*#__PURE__*/React.createElement(ResponseContainer, {
|
|
316
|
+
style: styles
|
|
317
|
+
}, /*#__PURE__*/React.createElement(StyledCardContent, null, /*#__PURE__*/React.createElement(TitleBar, null, /*#__PURE__*/React.createElement(StyledTitle, {
|
|
318
|
+
component: "div"
|
|
319
|
+
}, "Response for ", /*#__PURE__*/React.createElement(ResponseBox, null, keyToDisplay)), /*#__PURE__*/React.createElement(StyledSelectContainer, {
|
|
320
|
+
label: "Validation"
|
|
321
|
+
}, /*#__PURE__*/React.createElement(_Select.default, {
|
|
322
|
+
onChange: this.onChange('validation'),
|
|
323
|
+
value: validation || 'literal',
|
|
324
|
+
MenuProps: {
|
|
325
|
+
transitionDuration: {
|
|
326
|
+
enter: 225,
|
|
327
|
+
exit: 195
|
|
328
|
+
}
|
|
329
|
+
}
|
|
330
|
+
}, /*#__PURE__*/React.createElement(_MenuItem.default, {
|
|
331
|
+
value: "literal"
|
|
332
|
+
}, "Literal Validation"), /*#__PURE__*/React.createElement(_MenuItem.default, {
|
|
333
|
+
value: "symbolic"
|
|
334
|
+
}, "Symbolic Validation")))), validation === 'literal' && /*#__PURE__*/React.createElement(FlexContainer, null, cAllowTrailingZeros.enabled && /*#__PURE__*/React.createElement(_FormControlLabel.default, {
|
|
335
|
+
label: cAllowTrailingZeros.label,
|
|
336
|
+
control: /*#__PURE__*/React.createElement(CustomColorCheckbox, {
|
|
337
|
+
checked: allowTrailingZeros,
|
|
338
|
+
onChange: this.onLiteralOptionsChange('allowTrailingZeros')
|
|
339
|
+
})
|
|
340
|
+
}), cIgnoreOrder.enabled && /*#__PURE__*/React.createElement(_FormControlLabel.default, {
|
|
341
|
+
label: cIgnoreOrder.label,
|
|
342
|
+
control: /*#__PURE__*/React.createElement(CustomColorCheckbox, {
|
|
343
|
+
checked: ignoreOrder,
|
|
344
|
+
onChange: this.onLiteralOptionsChange('ignoreOrder')
|
|
345
|
+
})
|
|
346
|
+
})), /*#__PURE__*/React.createElement(InputContainerWrapper, null, /*#__PURE__*/React.createElement(_InputLabel.default, null, "Correct Answer"), /*#__PURE__*/React.createElement(_mathToolbar.MathToolbar, {
|
|
347
|
+
keypadMode: mode,
|
|
348
|
+
classNames: classNames,
|
|
349
|
+
controlledKeypad: true,
|
|
350
|
+
showKeypad: showKeypad.main,
|
|
351
|
+
latex: answer || '',
|
|
352
|
+
onChange: this.onAnswerChange,
|
|
353
|
+
onFocus: this.onFocus,
|
|
354
|
+
onDone: this.onDone,
|
|
355
|
+
error: error && error.answer
|
|
356
|
+
}), error && error.answer ? /*#__PURE__*/React.createElement(ErrorText, null, error.answer) : null), hasAlternates && Object.keys(alternates).map((alternateId, altIdx) => /*#__PURE__*/React.createElement(InputContainerWrapper, {
|
|
357
|
+
key: alternateId
|
|
358
|
+
}, /*#__PURE__*/React.createElement(_InputLabel.default, null, "Alternate", Object.keys(alternates).length > 1 ? ` ${altIdx + 1}` : ''), /*#__PURE__*/React.createElement(AlternateBar, null, /*#__PURE__*/React.createElement(_mathToolbar.MathToolbar, {
|
|
359
|
+
classNames: classNames,
|
|
360
|
+
controlledKeypad: true,
|
|
361
|
+
keypadMode: mode,
|
|
362
|
+
showKeypad: showKeypad[alternateId] || false,
|
|
363
|
+
latex: alternates[alternateId] || '',
|
|
364
|
+
onChange: this.onAlternateAnswerChange(alternateId),
|
|
365
|
+
onFocus: this.onAlternateFocus(alternateId),
|
|
366
|
+
onDone: this.onAlternateDone(alternateId),
|
|
367
|
+
error: error && error[alternateId]
|
|
368
|
+
}), /*#__PURE__*/React.createElement(RemoveAlternateButton, {
|
|
369
|
+
onClick: this.onRemoveAlternate(alternateId),
|
|
370
|
+
size: "large"
|
|
371
|
+
}, /*#__PURE__*/React.createElement(_Delete.default, null))), error && error[alternateId] ? /*#__PURE__*/React.createElement(ErrorText, null, error[alternateId]) : null)), /*#__PURE__*/React.createElement(AlternateButton, {
|
|
372
|
+
type: "primary",
|
|
373
|
+
onClick: this.onAddAlternate
|
|
374
|
+
}, "ADD ALTERNATE")));
|
|
375
|
+
}
|
|
376
|
+
}
|
|
377
|
+
exports.Response = Response;
|
|
378
|
+
(0, _defineProperty2.default)(Response, "propTypes", {
|
|
379
|
+
defaultResponse: _propTypes.default.bool,
|
|
380
|
+
error: _propTypes.default.object,
|
|
381
|
+
mode: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
|
|
382
|
+
onResponseChange: _propTypes.default.func.isRequired,
|
|
383
|
+
onResponseDone: _propTypes.default.func.isRequired,
|
|
384
|
+
response: _propTypes.default.object.isRequired,
|
|
385
|
+
cIgnoreOrder: _propTypes.default.object.isRequired,
|
|
386
|
+
cAllowTrailingZeros: _propTypes.default.object.isRequired,
|
|
387
|
+
responseKey: _propTypes.default.number.isRequired
|
|
388
|
+
});
|
|
389
|
+
(0, _defineProperty2.default)(Response, "defaultProps", {
|
|
390
|
+
defaultResponse: false,
|
|
391
|
+
mode: '8'
|
|
392
|
+
});
|
|
393
|
+
var _default = exports.default = Response;
|
|
394
|
+
//# sourceMappingURL=response.js.map
|