@pie-element/match-list 7.1.2-next.5 → 7.1.3
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 +572 -0
- package/CHANGELOG.md +1499 -0
- package/LICENSE.md +5 -0
- package/README.md +1 -0
- package/controller/CHANGELOG.json +242 -0
- package/controller/CHANGELOG.md +1047 -0
- package/controller/lib/defaults.js +15 -0
- package/controller/lib/defaults.js.map +1 -0
- package/controller/lib/index.js +246 -0
- package/controller/lib/index.js.map +1 -0
- package/controller/package.json +25 -0
- package/docs/config-schema.json +70 -0
- package/docs/config-schema.json.md +55 -0
- package/docs/demo/config.js +34 -0
- package/docs/demo/generate.js +54 -0
- package/docs/demo/index.html +1 -0
- package/docs/demo/session.js +6 -0
- package/docs/pie-schema.json +170 -0
- package/docs/pie-schema.json.md +104 -0
- package/lib/answer-area.js +168 -0
- package/lib/answer-area.js.map +1 -0
- package/lib/answer.js +267 -0
- package/lib/answer.js.map +1 -0
- package/lib/arrow.js +57 -0
- package/lib/arrow.js.map +1 -0
- package/lib/choices-list.js +60 -0
- package/lib/choices-list.js.map +1 -0
- package/lib/droppable-placeholder.js +60 -0
- package/lib/droppable-placeholder.js.map +1 -0
- package/lib/index.js +86 -0
- package/lib/index.js.map +1 -0
- package/lib/main.js +220 -0
- package/lib/main.js.map +1 -0
- package/package.json +22 -69
- package/controller.js +0 -1
- package/dist/browser/controller/index.js +0 -201
- package/dist/browser/controller/index.js.map +0 -1
- package/dist/browser/delivery/index.js +0 -13062
- package/dist/browser/delivery/index.js.map +0 -1
- package/dist/browser/dist-DksDR3d3.js +0 -278
- package/dist/browser/dist-DksDR3d3.js.map +0 -1
- package/dist/controller/defaults.d.ts +0 -17
- package/dist/controller/defaults.js +0 -9
- package/dist/controller/index.d.ts +0 -38
- package/dist/controller/index.js +0 -105
- package/dist/delivery/answer-area.d.ts +0 -27
- package/dist/delivery/answer-area.js +0 -92
- package/dist/delivery/answer.d.ts +0 -40
- package/dist/delivery/answer.js +0 -176
- package/dist/delivery/arrow.d.ts +0 -17
- package/dist/delivery/arrow.js +0 -35
- package/dist/delivery/choices-list.d.ts +0 -21
- package/dist/delivery/choices-list.js +0 -35
- package/dist/delivery/droppable-placeholder.d.ts +0 -24
- package/dist/delivery/droppable-placeholder.js +0 -42
- package/dist/delivery/index.d.ts +0 -21
- package/dist/delivery/index.js +0 -49
- package/dist/delivery/main.d.ts +0 -26
- package/dist/delivery/main.js +0 -147
- package/dist/index.d.ts +0 -1
- package/dist/index.iife.d.ts +0 -8
- package/dist/index.iife.js +0 -152
- package/dist/index.js +0 -2
- package/dist/runtime-support.d.ts +0 -12
- package/dist/runtime-support.js +0 -12
|
@@ -0,0 +1,170 @@
|
|
|
1
|
+
{
|
|
2
|
+
"description": "Model for the @pie-elements/match-list Interaction",
|
|
3
|
+
"additionalProperties": false,
|
|
4
|
+
"type": "object",
|
|
5
|
+
"properties": {
|
|
6
|
+
"prompt": {
|
|
7
|
+
"description": "The question prompt or item stem",
|
|
8
|
+
"type": "string",
|
|
9
|
+
"title": "prompt"
|
|
10
|
+
},
|
|
11
|
+
"prompts": {
|
|
12
|
+
"description": "The question prompts that are going to be displayed.",
|
|
13
|
+
"type": "array",
|
|
14
|
+
"items": {
|
|
15
|
+
"description": "Multiple question prompts",
|
|
16
|
+
"title": "Prompt",
|
|
17
|
+
"type": "object",
|
|
18
|
+
"properties": {
|
|
19
|
+
"id": {
|
|
20
|
+
"description": "Identifier for a question prompt",
|
|
21
|
+
"type": [
|
|
22
|
+
"string",
|
|
23
|
+
"number"
|
|
24
|
+
],
|
|
25
|
+
"title": "id"
|
|
26
|
+
},
|
|
27
|
+
"title": {
|
|
28
|
+
"description": "Text that will be displayed in the question prompt row",
|
|
29
|
+
"type": "string",
|
|
30
|
+
"title": "title"
|
|
31
|
+
},
|
|
32
|
+
"relatedAnswer": {
|
|
33
|
+
"description": "Id for the correct answer for this question prompt",
|
|
34
|
+
"type": [
|
|
35
|
+
"string",
|
|
36
|
+
"number"
|
|
37
|
+
],
|
|
38
|
+
"title": "relatedAnswer"
|
|
39
|
+
}
|
|
40
|
+
},
|
|
41
|
+
"required": [
|
|
42
|
+
"id",
|
|
43
|
+
"relatedAnswer",
|
|
44
|
+
"title"
|
|
45
|
+
]
|
|
46
|
+
},
|
|
47
|
+
"title": "prompts"
|
|
48
|
+
},
|
|
49
|
+
"answers": {
|
|
50
|
+
"description": "The answer rows that are going to be displayed.",
|
|
51
|
+
"type": "array",
|
|
52
|
+
"items": {
|
|
53
|
+
"description": "Multiple answers",
|
|
54
|
+
"title": "Answer",
|
|
55
|
+
"type": "object",
|
|
56
|
+
"properties": {
|
|
57
|
+
"id": {
|
|
58
|
+
"description": "Identifier for an answer row",
|
|
59
|
+
"type": [
|
|
60
|
+
"string",
|
|
61
|
+
"number"
|
|
62
|
+
],
|
|
63
|
+
"title": "id"
|
|
64
|
+
},
|
|
65
|
+
"title": {
|
|
66
|
+
"description": "Text that will be displayed in the answer row",
|
|
67
|
+
"type": "string",
|
|
68
|
+
"title": "title"
|
|
69
|
+
}
|
|
70
|
+
},
|
|
71
|
+
"required": [
|
|
72
|
+
"id",
|
|
73
|
+
"title"
|
|
74
|
+
]
|
|
75
|
+
},
|
|
76
|
+
"title": "answers"
|
|
77
|
+
},
|
|
78
|
+
"lockChoiceOrder": {
|
|
79
|
+
"description": "Indicates if answers should be locked in order according to the model or if they should be shuffed\ntrue - order is respected according to model\nfalse - order is shuffled",
|
|
80
|
+
"type": "boolean",
|
|
81
|
+
"title": "lockChoiceOrder"
|
|
82
|
+
},
|
|
83
|
+
"duplicates": {
|
|
84
|
+
"description": "Indicates if duplicates are allowed",
|
|
85
|
+
"type": "boolean",
|
|
86
|
+
"title": "duplicates"
|
|
87
|
+
},
|
|
88
|
+
"language": {
|
|
89
|
+
"description": "Indicates the language of the component\nSupported options: en, es, en_US, en-US, es_ES, es-ES, es_MX, es-MX",
|
|
90
|
+
"type": "string",
|
|
91
|
+
"title": "language"
|
|
92
|
+
},
|
|
93
|
+
"id": {
|
|
94
|
+
"description": "Identifier to identify the Pie Element in html markup, Must be unique within a pie item config.",
|
|
95
|
+
"type": "string",
|
|
96
|
+
"title": "id"
|
|
97
|
+
},
|
|
98
|
+
"element": {
|
|
99
|
+
"description": "The html Element tag name",
|
|
100
|
+
"type": "string",
|
|
101
|
+
"title": "element"
|
|
102
|
+
}
|
|
103
|
+
},
|
|
104
|
+
"required": [
|
|
105
|
+
"answers",
|
|
106
|
+
"element",
|
|
107
|
+
"id",
|
|
108
|
+
"prompts"
|
|
109
|
+
],
|
|
110
|
+
"definitions": {
|
|
111
|
+
"Prompt": {
|
|
112
|
+
"description": "Multiple question prompts",
|
|
113
|
+
"title": "Prompt",
|
|
114
|
+
"type": "object",
|
|
115
|
+
"properties": {
|
|
116
|
+
"id": {
|
|
117
|
+
"description": "Identifier for a question prompt",
|
|
118
|
+
"type": [
|
|
119
|
+
"string",
|
|
120
|
+
"number"
|
|
121
|
+
],
|
|
122
|
+
"title": "id"
|
|
123
|
+
},
|
|
124
|
+
"title": {
|
|
125
|
+
"description": "Text that will be displayed in the question prompt row",
|
|
126
|
+
"type": "string",
|
|
127
|
+
"title": "title"
|
|
128
|
+
},
|
|
129
|
+
"relatedAnswer": {
|
|
130
|
+
"description": "Id for the correct answer for this question prompt",
|
|
131
|
+
"type": [
|
|
132
|
+
"string",
|
|
133
|
+
"number"
|
|
134
|
+
],
|
|
135
|
+
"title": "relatedAnswer"
|
|
136
|
+
}
|
|
137
|
+
},
|
|
138
|
+
"required": [
|
|
139
|
+
"id",
|
|
140
|
+
"relatedAnswer",
|
|
141
|
+
"title"
|
|
142
|
+
]
|
|
143
|
+
},
|
|
144
|
+
"Answer": {
|
|
145
|
+
"description": "Multiple answers",
|
|
146
|
+
"title": "Answer",
|
|
147
|
+
"type": "object",
|
|
148
|
+
"properties": {
|
|
149
|
+
"id": {
|
|
150
|
+
"description": "Identifier for an answer row",
|
|
151
|
+
"type": [
|
|
152
|
+
"string",
|
|
153
|
+
"number"
|
|
154
|
+
],
|
|
155
|
+
"title": "id"
|
|
156
|
+
},
|
|
157
|
+
"title": {
|
|
158
|
+
"description": "Text that will be displayed in the answer row",
|
|
159
|
+
"type": "string",
|
|
160
|
+
"title": "title"
|
|
161
|
+
}
|
|
162
|
+
},
|
|
163
|
+
"required": [
|
|
164
|
+
"id",
|
|
165
|
+
"title"
|
|
166
|
+
]
|
|
167
|
+
}
|
|
168
|
+
},
|
|
169
|
+
"$schema": "http://json-schema.org/draft-07/schema#"
|
|
170
|
+
}
|
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
Model for the @pie-elements/match-list Interaction
|
|
2
|
+
|
|
3
|
+
The schema defines the following properties:
|
|
4
|
+
|
|
5
|
+
# `prompt` (string)
|
|
6
|
+
|
|
7
|
+
The question prompt or item stem
|
|
8
|
+
|
|
9
|
+
# `prompts` (array, required)
|
|
10
|
+
|
|
11
|
+
The question prompts that are going to be displayed.
|
|
12
|
+
|
|
13
|
+
The object is an array with all elements of the type `object`.
|
|
14
|
+
|
|
15
|
+
The array object has the following properties:
|
|
16
|
+
|
|
17
|
+
## `id` (string,number, required)
|
|
18
|
+
|
|
19
|
+
Identifier for a question prompt
|
|
20
|
+
|
|
21
|
+
## `title` (string, required)
|
|
22
|
+
|
|
23
|
+
Text that will be displayed in the question prompt row
|
|
24
|
+
|
|
25
|
+
## `relatedAnswer` (string,number, required)
|
|
26
|
+
|
|
27
|
+
Id for the correct answer for this question prompt
|
|
28
|
+
|
|
29
|
+
# `answers` (array, required)
|
|
30
|
+
|
|
31
|
+
The answer rows that are going to be displayed.
|
|
32
|
+
|
|
33
|
+
The object is an array with all elements of the type `object`.
|
|
34
|
+
|
|
35
|
+
The array object has the following properties:
|
|
36
|
+
|
|
37
|
+
## `id` (string,number, required)
|
|
38
|
+
|
|
39
|
+
Identifier for an answer row
|
|
40
|
+
|
|
41
|
+
## `title` (string, required)
|
|
42
|
+
|
|
43
|
+
Text that will be displayed in the answer row
|
|
44
|
+
|
|
45
|
+
# `lockChoiceOrder` (boolean)
|
|
46
|
+
|
|
47
|
+
Indicates if answers should be locked in order according to the model or if they should be shuffed
|
|
48
|
+
true - order is respected according to model
|
|
49
|
+
false - order is shuffled
|
|
50
|
+
|
|
51
|
+
# `duplicates` (boolean)
|
|
52
|
+
|
|
53
|
+
Indicates if duplicates are allowed
|
|
54
|
+
|
|
55
|
+
# `language` (string)
|
|
56
|
+
|
|
57
|
+
Indicates the language of the component
|
|
58
|
+
Supported options: en, es, en_US, en-US, es_ES, es-ES, es_MX, es-MX
|
|
59
|
+
|
|
60
|
+
# `id` (string, required)
|
|
61
|
+
|
|
62
|
+
Identifier to identify the Pie Element in html markup, Must be unique within a pie item config.
|
|
63
|
+
|
|
64
|
+
# `element` (string, required)
|
|
65
|
+
|
|
66
|
+
The html Element tag name
|
|
67
|
+
|
|
68
|
+
---
|
|
69
|
+
|
|
70
|
+
# Sub Schemas
|
|
71
|
+
|
|
72
|
+
The schema defines the following additional types:
|
|
73
|
+
|
|
74
|
+
## `Prompt` (object)
|
|
75
|
+
|
|
76
|
+
Multiple question prompts
|
|
77
|
+
|
|
78
|
+
Properties of the `Prompt` object:
|
|
79
|
+
|
|
80
|
+
### `id` (string,number, required)
|
|
81
|
+
|
|
82
|
+
Identifier for a question prompt
|
|
83
|
+
|
|
84
|
+
### `title` (string, required)
|
|
85
|
+
|
|
86
|
+
Text that will be displayed in the question prompt row
|
|
87
|
+
|
|
88
|
+
### `relatedAnswer` (string,number, required)
|
|
89
|
+
|
|
90
|
+
Id for the correct answer for this question prompt
|
|
91
|
+
|
|
92
|
+
## `Answer` (object)
|
|
93
|
+
|
|
94
|
+
Multiple answers
|
|
95
|
+
|
|
96
|
+
Properties of the `Answer` object:
|
|
97
|
+
|
|
98
|
+
### `id` (string,number, required)
|
|
99
|
+
|
|
100
|
+
Identifier for an answer row
|
|
101
|
+
|
|
102
|
+
### `title` (string, required)
|
|
103
|
+
|
|
104
|
+
Text that will be displayed in the answer row
|
|
@@ -0,0 +1,168 @@
|
|
|
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.AnswerArea = void 0;
|
|
8
|
+
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
|
+
var _react = _interopRequireDefault(require("react"));
|
|
10
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
11
|
+
var _styles = require("@mui/material/styles");
|
|
12
|
+
var _lodashEs = require("lodash-es");
|
|
13
|
+
var _arrow = _interopRequireDefault(require("./arrow"));
|
|
14
|
+
var _answer = _interopRequireDefault(require("./answer"));
|
|
15
|
+
const ArrowEntry = (0, _styles.styled)('div')({
|
|
16
|
+
alignItems: 'normal',
|
|
17
|
+
display: 'flex',
|
|
18
|
+
height: 40,
|
|
19
|
+
margin: '10px 20px'
|
|
20
|
+
});
|
|
21
|
+
const ItemList = (0, _styles.styled)('div')(({
|
|
22
|
+
theme
|
|
23
|
+
}) => ({
|
|
24
|
+
alignItems: 'flex-start',
|
|
25
|
+
display: 'flex',
|
|
26
|
+
flex: 1,
|
|
27
|
+
flexDirection: 'column',
|
|
28
|
+
justifyContent: 'space-between',
|
|
29
|
+
marginTop: theme.spacing(2),
|
|
30
|
+
marginBottom: theme.spacing(2)
|
|
31
|
+
}));
|
|
32
|
+
const PromptEntry = (0, _styles.styled)('div')(({
|
|
33
|
+
theme
|
|
34
|
+
}) => ({
|
|
35
|
+
border: `1px solid ${theme.palette.grey[400]}`,
|
|
36
|
+
boxSizing: 'border-box',
|
|
37
|
+
flex: 1,
|
|
38
|
+
margin: '10px 0',
|
|
39
|
+
minHeight: 40,
|
|
40
|
+
overflow: 'hidden',
|
|
41
|
+
padding: 10,
|
|
42
|
+
textAlign: 'center',
|
|
43
|
+
width: '100%',
|
|
44
|
+
wordBreak: 'break-word'
|
|
45
|
+
}));
|
|
46
|
+
const Row = (0, _styles.styled)('div')({
|
|
47
|
+
alignItems: 'center',
|
|
48
|
+
display: 'flex',
|
|
49
|
+
justifyContent: 'space-between',
|
|
50
|
+
width: '100%'
|
|
51
|
+
});
|
|
52
|
+
class AnswerArea extends _react.default.Component {
|
|
53
|
+
constructor(...args) {
|
|
54
|
+
super(...args);
|
|
55
|
+
(0, _defineProperty2.default)(this, "getAnswerFromSession", promptId => {
|
|
56
|
+
const {
|
|
57
|
+
model,
|
|
58
|
+
session,
|
|
59
|
+
showCorrect
|
|
60
|
+
} = this.props;
|
|
61
|
+
const {
|
|
62
|
+
config
|
|
63
|
+
} = model;
|
|
64
|
+
const answerId = showCorrect ? config.prompts.find(p => p.id === promptId).relatedAnswer : session.value && session.value[promptId];
|
|
65
|
+
const answer = config.answers.find(answer => answer.id === answerId);
|
|
66
|
+
return answer || {};
|
|
67
|
+
});
|
|
68
|
+
(0, _defineProperty2.default)(this, "getCorrectOrIncorrectMap", () => {
|
|
69
|
+
const {
|
|
70
|
+
model,
|
|
71
|
+
session,
|
|
72
|
+
showCorrect
|
|
73
|
+
} = this.props;
|
|
74
|
+
const {
|
|
75
|
+
config
|
|
76
|
+
} = model;
|
|
77
|
+
const sessionValue = session.value || config.prompts.reduce((obj, prompt) => {
|
|
78
|
+
obj[prompt.id] = undefined;
|
|
79
|
+
return obj;
|
|
80
|
+
}, {});
|
|
81
|
+
if (model.mode !== 'evaluate') {
|
|
82
|
+
return {};
|
|
83
|
+
}
|
|
84
|
+
if (showCorrect) {
|
|
85
|
+
return config.prompts.reduce((obj, prompt) => {
|
|
86
|
+
obj[prompt.id] = true;
|
|
87
|
+
return obj;
|
|
88
|
+
}, {});
|
|
89
|
+
}
|
|
90
|
+
const correctPromptMap = config.prompts.reduce((obj, prompt) => {
|
|
91
|
+
if (!(0, _lodashEs.isUndefined)(prompt.relatedAnswer)) {
|
|
92
|
+
obj[prompt.id] = prompt.relatedAnswer;
|
|
93
|
+
}
|
|
94
|
+
return obj;
|
|
95
|
+
}, {});
|
|
96
|
+
return (0, _lodashEs.reduce)(sessionValue, (obj, val, key) => {
|
|
97
|
+
obj[key] = correctPromptMap[key] === sessionValue[key];
|
|
98
|
+
return obj;
|
|
99
|
+
}, {});
|
|
100
|
+
});
|
|
101
|
+
(0, _defineProperty2.default)(this, "buildRows", () => {
|
|
102
|
+
const {
|
|
103
|
+
model
|
|
104
|
+
} = this.props;
|
|
105
|
+
const {
|
|
106
|
+
config
|
|
107
|
+
} = model;
|
|
108
|
+
const prompts = config.prompts || [];
|
|
109
|
+
return prompts.map(prompt => {
|
|
110
|
+
const sessionAnswer = this.getAnswerFromSession(prompt.id);
|
|
111
|
+
return {
|
|
112
|
+
...prompt,
|
|
113
|
+
sessionAnswer
|
|
114
|
+
};
|
|
115
|
+
});
|
|
116
|
+
});
|
|
117
|
+
}
|
|
118
|
+
render() {
|
|
119
|
+
const {
|
|
120
|
+
disabled,
|
|
121
|
+
instanceId,
|
|
122
|
+
onRemoveAnswer
|
|
123
|
+
} = this.props;
|
|
124
|
+
const rows = this.buildRows();
|
|
125
|
+
const correctnessMap = this.getCorrectOrIncorrectMap();
|
|
126
|
+
return /*#__PURE__*/_react.default.createElement(ItemList, null, rows.map(({
|
|
127
|
+
sessionAnswer,
|
|
128
|
+
title,
|
|
129
|
+
id
|
|
130
|
+
}, index) => {
|
|
131
|
+
return /*#__PURE__*/_react.default.createElement(Row, {
|
|
132
|
+
key: index
|
|
133
|
+
}, /*#__PURE__*/_react.default.createElement(PromptEntry, {
|
|
134
|
+
dangerouslySetInnerHTML: {
|
|
135
|
+
__html: title
|
|
136
|
+
}
|
|
137
|
+
}), /*#__PURE__*/_react.default.createElement(ArrowEntry, null, /*#__PURE__*/_react.default.createElement(_arrow.default, {
|
|
138
|
+
direction: "left"
|
|
139
|
+
}), /*#__PURE__*/_react.default.createElement(_arrow.default, null)), /*#__PURE__*/_react.default.createElement(_answer.default, {
|
|
140
|
+
key: index,
|
|
141
|
+
className: "answer",
|
|
142
|
+
index: index,
|
|
143
|
+
promptId: id,
|
|
144
|
+
correct: correctnessMap[id],
|
|
145
|
+
draggable: !(0, _lodashEs.isEmpty)(sessionAnswer),
|
|
146
|
+
disabled: disabled,
|
|
147
|
+
instanceId: instanceId,
|
|
148
|
+
id: sessionAnswer.id,
|
|
149
|
+
title: sessionAnswer.title,
|
|
150
|
+
type: 'target',
|
|
151
|
+
onRemoveChoice: () => onRemoveAnswer(id)
|
|
152
|
+
}));
|
|
153
|
+
}));
|
|
154
|
+
}
|
|
155
|
+
}
|
|
156
|
+
exports.AnswerArea = AnswerArea;
|
|
157
|
+
(0, _defineProperty2.default)(AnswerArea, "propTypes", {
|
|
158
|
+
session: _propTypes.default.object.isRequired,
|
|
159
|
+
showCorrect: _propTypes.default.bool.isRequired,
|
|
160
|
+
disabled: _propTypes.default.bool.isRequired,
|
|
161
|
+
onSessionChange: _propTypes.default.func,
|
|
162
|
+
onRemoveAnswer: _propTypes.default.func,
|
|
163
|
+
instanceId: _propTypes.default.string.isRequired,
|
|
164
|
+
model: _propTypes.default.object.isRequired,
|
|
165
|
+
prompt: _propTypes.default.string
|
|
166
|
+
});
|
|
167
|
+
var _default = exports.default = AnswerArea;
|
|
168
|
+
//# sourceMappingURL=answer-area.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"answer-area.js","names":["_react","_interopRequireDefault","require","_propTypes","_styles","_lodashEs","_arrow","_answer","ArrowEntry","styled","alignItems","display","height","margin","ItemList","theme","flex","flexDirection","justifyContent","marginTop","spacing","marginBottom","PromptEntry","border","palette","grey","boxSizing","minHeight","overflow","padding","textAlign","width","wordBreak","Row","AnswerArea","React","Component","constructor","args","_defineProperty2","default","promptId","model","session","showCorrect","props","config","answerId","prompts","find","p","id","relatedAnswer","value","answer","answers","sessionValue","reduce","obj","prompt","undefined","mode","correctPromptMap","isUndefined","val","key","map","sessionAnswer","getAnswerFromSession","render","disabled","instanceId","onRemoveAnswer","rows","buildRows","correctnessMap","getCorrectOrIncorrectMap","createElement","title","index","dangerouslySetInnerHTML","__html","direction","className","correct","draggable","isEmpty","type","onRemoveChoice","exports","PropTypes","object","isRequired","bool","onSessionChange","func","string","_default"],"sources":["../src/answer-area.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@mui/material/styles';\nimport { isEmpty, isUndefined, reduce } from 'lodash-es';\n\nimport Arrow from './arrow';\nimport DragAndDropAnswer from './answer';\n\nconst ArrowEntry = styled('div')({\n alignItems: 'normal',\n display: 'flex',\n height: 40,\n margin: '10px 20px',\n});\n\nconst ItemList = styled('div')(({ theme }) => ({\n alignItems: 'flex-start',\n display: 'flex',\n flex: 1,\n flexDirection: 'column',\n justifyContent: 'space-between',\n marginTop: theme.spacing(2),\n marginBottom: theme.spacing(2),\n}));\n\nconst PromptEntry = styled('div')(({ theme }) => ({\n border: `1px solid ${theme.palette.grey[400]}`,\n boxSizing: 'border-box',\n flex: 1,\n margin: '10px 0',\n minHeight: 40,\n overflow: 'hidden',\n padding: 10,\n textAlign: 'center',\n width: '100%',\n wordBreak: 'break-word',\n}));\n\nconst Row = styled('div')({\n alignItems: 'center',\n display: 'flex',\n justifyContent: 'space-between',\n width: '100%',\n});\n\nexport class AnswerArea extends React.Component {\n static propTypes = {\n session: PropTypes.object.isRequired,\n showCorrect: PropTypes.bool.isRequired,\n disabled: PropTypes.bool.isRequired,\n onSessionChange: PropTypes.func,\n onRemoveAnswer: PropTypes.func,\n instanceId: PropTypes.string.isRequired,\n model: PropTypes.object.isRequired,\n prompt: PropTypes.string,\n };\n\n getAnswerFromSession = (promptId) => {\n const { model, session, showCorrect } = this.props;\n const { config } = model;\n const answerId = showCorrect\n ? config.prompts.find((p) => p.id === promptId).relatedAnswer\n : session.value && session.value[promptId];\n const answer = config.answers.find((answer) => answer.id === answerId);\n\n return answer || {};\n };\n\n getCorrectOrIncorrectMap = () => {\n const { model, session, showCorrect } = this.props;\n const { config } = model;\n const sessionValue =\n session.value ||\n config.prompts.reduce((obj, prompt) => {\n obj[prompt.id] = undefined;\n return obj;\n }, {});\n\n if (model.mode !== 'evaluate') {\n return {};\n }\n\n if (showCorrect) {\n return config.prompts.reduce((obj, prompt) => {\n obj[prompt.id] = true;\n\n return obj;\n }, {});\n }\n\n const correctPromptMap = config.prompts.reduce((obj, prompt) => {\n if (!isUndefined(prompt.relatedAnswer)) {\n obj[prompt.id] = prompt.relatedAnswer;\n }\n\n return obj;\n }, {});\n\n return reduce(\n sessionValue,\n (obj, val, key) => {\n obj[key] = correctPromptMap[key] === sessionValue[key];\n\n return obj;\n },\n {},\n );\n };\n\n buildRows = () => {\n const { model } = this.props;\n const { config } = model;\n const prompts = config.prompts || [];\n\n return prompts.map((prompt) => {\n const sessionAnswer = this.getAnswerFromSession(prompt.id);\n\n return {\n ...prompt,\n sessionAnswer,\n };\n });\n };\n\n render() {\n const { disabled, instanceId, onRemoveAnswer } = this.props;\n const rows = this.buildRows();\n const correctnessMap = this.getCorrectOrIncorrectMap();\n\n return (\n <ItemList>\n {rows.map(({ sessionAnswer, title, id }, index) => {\n return (\n <Row key={index}>\n <PromptEntry dangerouslySetInnerHTML={{ __html: title }} />\n\n <ArrowEntry>\n <Arrow direction=\"left\" />\n <Arrow />\n </ArrowEntry>\n\n <DragAndDropAnswer\n key={index}\n className=\"answer\"\n index={index}\n promptId={id}\n correct={correctnessMap[id]}\n draggable={!isEmpty(sessionAnswer)}\n disabled={disabled}\n instanceId={instanceId}\n id={sessionAnswer.id}\n title={sessionAnswer.title}\n type={'target'}\n onRemoveChoice={() => onRemoveAnswer(id)}\n />\n </Row>\n );\n })}\n </ItemList>\n );\n }\n}\n\nexport default AnswerArea;\n"],"mappings":"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","ignoreList":[]}
|