@pie-element/ebsr 10.7.3-next.12 → 10.7.3-next.14
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/module/index.html +1 -1
- package/module/manifest.json +1 -1
- package/module/print.html +1 -1
- package/package.json +3 -3
- package/configure/node_modules/@pie-element/multiple-choice/CHANGELOG.json +0 -1972
- package/configure/node_modules/@pie-element/multiple-choice/CHANGELOG.md +0 -4144
- package/configure/node_modules/@pie-element/multiple-choice/LICENSE.md +0 -5
- package/configure/node_modules/@pie-element/multiple-choice/PRINT.md +0 -35
- package/configure/node_modules/@pie-element/multiple-choice/README.md +0 -56
- package/configure/node_modules/@pie-element/multiple-choice/choice.png +0 -0
- package/configure/node_modules/@pie-element/multiple-choice/configure/CHANGELOG.json +0 -1387
- package/configure/node_modules/@pie-element/multiple-choice/configure/CHANGELOG.md +0 -3316
- package/configure/node_modules/@pie-element/multiple-choice/configure/lib/defaults.js +0 -202
- package/configure/node_modules/@pie-element/multiple-choice/configure/lib/defaults.js.map +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/configure/lib/index.js +0 -248
- package/configure/node_modules/@pie-element/multiple-choice/configure/lib/index.js.map +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/configure/lib/main.js +0 -597
- package/configure/node_modules/@pie-element/multiple-choice/configure/lib/main.js.map +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/configure/lib/utils.js +0 -18
- package/configure/node_modules/@pie-element/multiple-choice/configure/lib/utils.js.map +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/configure/package.json +0 -18
- package/configure/node_modules/@pie-element/multiple-choice/controller/CHANGELOG.json +0 -527
- package/configure/node_modules/@pie-element/multiple-choice/controller/CHANGELOG.md +0 -2281
- package/configure/node_modules/@pie-element/multiple-choice/controller/lib/defaults.js +0 -34
- package/configure/node_modules/@pie-element/multiple-choice/controller/lib/defaults.js.map +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/controller/lib/index.js +0 -346
- package/configure/node_modules/@pie-element/multiple-choice/controller/lib/index.js.map +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/controller/lib/utils.js +0 -28
- package/configure/node_modules/@pie-element/multiple-choice/controller/lib/utils.js.map +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/controller/package.json +0 -15
- package/configure/node_modules/@pie-element/multiple-choice/docs/config-schema.json +0 -2993
- package/configure/node_modules/@pie-element/multiple-choice/docs/config-schema.json.md +0 -2217
- package/configure/node_modules/@pie-element/multiple-choice/docs/demo/config.js +0 -8
- package/configure/node_modules/@pie-element/multiple-choice/docs/demo/generate.js +0 -61
- package/configure/node_modules/@pie-element/multiple-choice/docs/demo/index.html +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/docs/demo/session.js +0 -7
- package/configure/node_modules/@pie-element/multiple-choice/docs/pie-schema.json +0 -1332
- package/configure/node_modules/@pie-element/multiple-choice/docs/pie-schema.json.md +0 -1015
- package/configure/node_modules/@pie-element/multiple-choice/lib/choice-input.js +0 -427
- package/configure/node_modules/@pie-element/multiple-choice/lib/choice-input.js.map +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/lib/choice.js +0 -252
- package/configure/node_modules/@pie-element/multiple-choice/lib/choice.js.map +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/lib/feedback-tick.js +0 -174
- package/configure/node_modules/@pie-element/multiple-choice/lib/feedback-tick.js.map +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/lib/index.js +0 -388
- package/configure/node_modules/@pie-element/multiple-choice/lib/index.js.map +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/lib/main.js +0 -108
- package/configure/node_modules/@pie-element/multiple-choice/lib/main.js.map +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/lib/multiple-choice.js +0 -469
- package/configure/node_modules/@pie-element/multiple-choice/lib/multiple-choice.js.map +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/lib/print.js +0 -129
- package/configure/node_modules/@pie-element/multiple-choice/lib/print.js.map +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/lib/session-updater.js +0 -48
- package/configure/node_modules/@pie-element/multiple-choice/lib/session-updater.js.map +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/module/configure.js +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/module/controller.js +0 -3611
- package/configure/node_modules/@pie-element/multiple-choice/module/demo.js +0 -86
- package/configure/node_modules/@pie-element/multiple-choice/module/element.js +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/module/index.html +0 -21
- package/configure/node_modules/@pie-element/multiple-choice/module/manifest.json +0 -10
- package/configure/node_modules/@pie-element/multiple-choice/module/print-demo.js +0 -124
- package/configure/node_modules/@pie-element/multiple-choice/module/print.html +0 -18
- package/configure/node_modules/@pie-element/multiple-choice/module/print.js +0 -1
- package/configure/node_modules/@pie-element/multiple-choice/package.json +0 -32
|
@@ -1,252 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports["default"] = exports.Choice = void 0;
|
|
9
|
-
|
|
10
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
11
|
-
|
|
12
|
-
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
13
|
-
|
|
14
|
-
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
15
|
-
|
|
16
|
-
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
17
|
-
|
|
18
|
-
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
19
|
-
|
|
20
|
-
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
|
21
|
-
|
|
22
|
-
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
|
23
|
-
|
|
24
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
25
|
-
|
|
26
|
-
var _react = _interopRequireDefault(require("react"));
|
|
27
|
-
|
|
28
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
29
|
-
|
|
30
|
-
var _styles = require("@material-ui/core/styles");
|
|
31
|
-
|
|
32
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
|
33
|
-
|
|
34
|
-
var _choiceInput = _interopRequireDefault(require("./choice-input"));
|
|
35
|
-
|
|
36
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
37
|
-
|
|
38
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
39
|
-
|
|
40
|
-
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
|
|
41
|
-
|
|
42
|
-
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
43
|
-
|
|
44
|
-
var Choice = /*#__PURE__*/function (_React$Component) {
|
|
45
|
-
(0, _inherits2["default"])(Choice, _React$Component);
|
|
46
|
-
|
|
47
|
-
var _super = _createSuper(Choice);
|
|
48
|
-
|
|
49
|
-
function Choice() {
|
|
50
|
-
var _this;
|
|
51
|
-
|
|
52
|
-
(0, _classCallCheck2["default"])(this, Choice);
|
|
53
|
-
|
|
54
|
-
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
55
|
-
args[_key] = arguments[_key];
|
|
56
|
-
}
|
|
57
|
-
|
|
58
|
-
_this = _super.call.apply(_super, [this].concat(args));
|
|
59
|
-
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
|
|
60
|
-
isHovered: false
|
|
61
|
-
});
|
|
62
|
-
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleMouseEnter", function () {
|
|
63
|
-
var _this$props = _this.props,
|
|
64
|
-
disabled = _this$props.disabled,
|
|
65
|
-
checked = _this$props.checked;
|
|
66
|
-
|
|
67
|
-
if (!disabled && !checked) {
|
|
68
|
-
_this.setState({
|
|
69
|
-
isHovered: true
|
|
70
|
-
});
|
|
71
|
-
}
|
|
72
|
-
});
|
|
73
|
-
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleMouseLeave", function () {
|
|
74
|
-
_this.setState({
|
|
75
|
-
isHovered: false
|
|
76
|
-
});
|
|
77
|
-
});
|
|
78
|
-
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onChange", function (choice) {
|
|
79
|
-
var _this$props2 = _this.props,
|
|
80
|
-
disabled = _this$props2.disabled,
|
|
81
|
-
onChoiceChanged = _this$props2.onChoiceChanged;
|
|
82
|
-
|
|
83
|
-
if (!disabled) {
|
|
84
|
-
onChoiceChanged(choice);
|
|
85
|
-
}
|
|
86
|
-
});
|
|
87
|
-
return _this;
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
(0, _createClass2["default"])(Choice, [{
|
|
91
|
-
key: "render",
|
|
92
|
-
value: function render() {
|
|
93
|
-
var _classNames;
|
|
94
|
-
|
|
95
|
-
var _this$props3 = this.props,
|
|
96
|
-
choice = _this$props3.choice,
|
|
97
|
-
index = _this$props3.index,
|
|
98
|
-
choicesLength = _this$props3.choicesLength,
|
|
99
|
-
showCorrect = _this$props3.showCorrect,
|
|
100
|
-
isEvaluateMode = _this$props3.isEvaluateMode,
|
|
101
|
-
choiceMode = _this$props3.choiceMode,
|
|
102
|
-
disabled = _this$props3.disabled,
|
|
103
|
-
checked = _this$props3.checked,
|
|
104
|
-
correctness = _this$props3.correctness,
|
|
105
|
-
displayKey = _this$props3.displayKey,
|
|
106
|
-
classes = _this$props3.classes,
|
|
107
|
-
choicesLayout = _this$props3.choicesLayout,
|
|
108
|
-
gridColumns = _this$props3.gridColumns,
|
|
109
|
-
isSelectionButtonBelow = _this$props3.isSelectionButtonBelow,
|
|
110
|
-
selectedAnswerBackgroundColor = _this$props3.selectedAnswerBackgroundColor,
|
|
111
|
-
selectedAnswerStrokeColor = _this$props3.selectedAnswerStrokeColor,
|
|
112
|
-
selectedAnswerStrokeWidth = _this$props3.selectedAnswerStrokeWidth,
|
|
113
|
-
hoverAnswerBackgroundColor = _this$props3.hoverAnswerBackgroundColor,
|
|
114
|
-
hoverAnswerStrokeColor = _this$props3.hoverAnswerStrokeColor,
|
|
115
|
-
hoverAnswerStrokeWidth = _this$props3.hoverAnswerStrokeWidth,
|
|
116
|
-
autoFocusRef = _this$props3.autoFocusRef,
|
|
117
|
-
tagName = _this$props3.tagName;
|
|
118
|
-
var isHovered = this.state.isHovered;
|
|
119
|
-
var choiceClass = 'choice' + (index === choicesLength - 1 ? ' last' : '');
|
|
120
|
-
var feedback = !isEvaluateMode || showCorrect ? '' : choice.feedback;
|
|
121
|
-
|
|
122
|
-
var choiceProps = _objectSpread(_objectSpread({}, choice), {}, {
|
|
123
|
-
checked: checked,
|
|
124
|
-
choiceMode: choiceMode,
|
|
125
|
-
disabled: disabled,
|
|
126
|
-
feedback: feedback,
|
|
127
|
-
correctness: correctness,
|
|
128
|
-
displayKey: displayKey,
|
|
129
|
-
index: index,
|
|
130
|
-
choicesLayout: choicesLayout,
|
|
131
|
-
gridColumns: gridColumns,
|
|
132
|
-
onChange: this.onChange,
|
|
133
|
-
isEvaluateMode: isEvaluateMode,
|
|
134
|
-
isSelectionButtonBelow: isSelectionButtonBelow,
|
|
135
|
-
selectedAnswerStrokeColor: selectedAnswerStrokeColor,
|
|
136
|
-
selectedAnswerStrokeWidth: selectedAnswerStrokeWidth,
|
|
137
|
-
tagName: tagName
|
|
138
|
-
});
|
|
139
|
-
|
|
140
|
-
var normalizeStrokeWidth = function normalizeStrokeWidth(width) {
|
|
141
|
-
if (!width) return '2px'; // default
|
|
142
|
-
|
|
143
|
-
var trimmed = String(width).trim(); // add 'px' if the value is a number
|
|
144
|
-
|
|
145
|
-
if (/^\d+(\.\d+)?$/.test(trimmed)) {
|
|
146
|
-
return "".concat(trimmed, "px");
|
|
147
|
-
}
|
|
148
|
-
|
|
149
|
-
return trimmed;
|
|
150
|
-
};
|
|
151
|
-
|
|
152
|
-
var hasSelectedStroke = selectedAnswerStrokeColor && selectedAnswerStrokeColor !== 'initial';
|
|
153
|
-
var hasHoverStroke = hoverAnswerStrokeColor && hoverAnswerStrokeColor !== 'initial';
|
|
154
|
-
var currentStrokeColor = 'transparent';
|
|
155
|
-
var currentStrokeWidth = '2px';
|
|
156
|
-
var currentBackgroundColor = 'initial';
|
|
157
|
-
|
|
158
|
-
if (hasSelectedStroke || hasHoverStroke) {
|
|
159
|
-
if (checked && hasSelectedStroke) {
|
|
160
|
-
// selected state takes priority when selected stroke is configured
|
|
161
|
-
currentStrokeColor = selectedAnswerStrokeColor;
|
|
162
|
-
currentStrokeWidth = selectedAnswerStrokeWidth;
|
|
163
|
-
} else if (isHovered && !disabled && hasHoverStroke) {
|
|
164
|
-
// hover state when not selected and not disabled, and hover stroke is configured
|
|
165
|
-
currentStrokeColor = hoverAnswerStrokeColor;
|
|
166
|
-
currentStrokeWidth = hoverAnswerStrokeWidth;
|
|
167
|
-
}
|
|
168
|
-
}
|
|
169
|
-
|
|
170
|
-
if (checked && selectedAnswerBackgroundColor && selectedAnswerBackgroundColor !== 'initial') {
|
|
171
|
-
currentBackgroundColor = selectedAnswerBackgroundColor;
|
|
172
|
-
} else if (isHovered && !disabled && hoverAnswerBackgroundColor && hoverAnswerBackgroundColor !== 'initial') {
|
|
173
|
-
currentBackgroundColor = hoverAnswerBackgroundColor;
|
|
174
|
-
}
|
|
175
|
-
|
|
176
|
-
var strokeStyle = hasSelectedStroke || hasHoverStroke ? {
|
|
177
|
-
border: "".concat(normalizeStrokeWidth(currentStrokeWidth), " solid ").concat(currentStrokeColor),
|
|
178
|
-
borderRadius: '8px'
|
|
179
|
-
} : {};
|
|
180
|
-
var names = (0, _classnames["default"])(classes.choice, (_classNames = {}, (0, _defineProperty2["default"])(_classNames, classes.noBorder, index === choicesLength - 1 || choicesLayout !== 'vertical' || strokeStyle), (0, _defineProperty2["default"])(_classNames, classes.horizontalLayout, choicesLayout === 'horizontal'), _classNames));
|
|
181
|
-
var choiceBackground = currentBackgroundColor !== 'initial' ? currentBackgroundColor : 'initial';
|
|
182
|
-
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
183
|
-
className: choiceClass,
|
|
184
|
-
key: index,
|
|
185
|
-
style: _objectSpread({
|
|
186
|
-
backgroundColor: choiceBackground
|
|
187
|
-
}, strokeStyle),
|
|
188
|
-
onMouseEnter: this.handleMouseEnter,
|
|
189
|
-
onMouseLeave: this.handleMouseLeave
|
|
190
|
-
}, /*#__PURE__*/_react["default"].createElement(_choiceInput["default"], (0, _extends2["default"])({}, choiceProps, {
|
|
191
|
-
className: names,
|
|
192
|
-
autoFocusRef: autoFocusRef
|
|
193
|
-
})));
|
|
194
|
-
}
|
|
195
|
-
}]);
|
|
196
|
-
return Choice;
|
|
197
|
-
}(_react["default"].Component);
|
|
198
|
-
|
|
199
|
-
exports.Choice = Choice;
|
|
200
|
-
(0, _defineProperty2["default"])(Choice, "propTypes", {});
|
|
201
|
-
Choice.propTypes = {
|
|
202
|
-
choiceMode: _propTypes["default"].oneOf(['radio', 'checkbox']),
|
|
203
|
-
choice: _propTypes["default"].object,
|
|
204
|
-
disabled: _propTypes["default"].bool.isRequired,
|
|
205
|
-
onChoiceChanged: _propTypes["default"].func,
|
|
206
|
-
classes: _propTypes["default"].object.isRequired,
|
|
207
|
-
index: _propTypes["default"].number,
|
|
208
|
-
choicesLength: _propTypes["default"].number,
|
|
209
|
-
showCorrect: _propTypes["default"].bool,
|
|
210
|
-
isEvaluateMode: _propTypes["default"].bool,
|
|
211
|
-
checked: _propTypes["default"].bool,
|
|
212
|
-
correctness: _propTypes["default"].string,
|
|
213
|
-
displayKey: _propTypes["default"].string,
|
|
214
|
-
choicesLayout: _propTypes["default"].oneOf(['vertical', 'grid', 'horizontal']),
|
|
215
|
-
gridColumns: _propTypes["default"].string,
|
|
216
|
-
selectedAnswerBackgroundColor: _propTypes["default"].string,
|
|
217
|
-
selectedAnswerStrokeColor: _propTypes["default"].string,
|
|
218
|
-
selectedAnswerStrokeWidth: _propTypes["default"].string,
|
|
219
|
-
hoverAnswerBackgroundColor: _propTypes["default"].string,
|
|
220
|
-
hoverAnswerStrokeColor: _propTypes["default"].string,
|
|
221
|
-
hoverAnswerStrokeWidth: _propTypes["default"].string,
|
|
222
|
-
tagName: _propTypes["default"].string,
|
|
223
|
-
isSelectionButtonBelow: _propTypes["default"].bool,
|
|
224
|
-
autoFocusRef: _propTypes["default"].object
|
|
225
|
-
};
|
|
226
|
-
|
|
227
|
-
var _default = (0, _styles.withStyles)(function (theme) {
|
|
228
|
-
return {
|
|
229
|
-
choice: {
|
|
230
|
-
paddingTop: theme.spacing.unit * 2.5,
|
|
231
|
-
paddingBottom: theme.spacing.unit + 2,
|
|
232
|
-
paddingLeft: theme.spacing.unit + 2,
|
|
233
|
-
paddingRight: theme.spacing.unit + 2,
|
|
234
|
-
borderBottom: "1px solid ".concat(theme.palette.grey[300])
|
|
235
|
-
},
|
|
236
|
-
noBorder: {
|
|
237
|
-
borderBottom: 'none'
|
|
238
|
-
},
|
|
239
|
-
horizontalLayout: {
|
|
240
|
-
paddingRight: theme.spacing.unit * 2.5,
|
|
241
|
-
'& label': {
|
|
242
|
-
marginRight: theme.spacing.unit // '& span:first-child': {
|
|
243
|
-
// paddingRight: 0
|
|
244
|
-
// }
|
|
245
|
-
|
|
246
|
-
}
|
|
247
|
-
}
|
|
248
|
-
};
|
|
249
|
-
})(Choice);
|
|
250
|
-
|
|
251
|
-
exports["default"] = _default;
|
|
252
|
-
//# sourceMappingURL=choice.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/choice.jsx"],"names":["Choice","isHovered","props","disabled","checked","setState","choice","onChoiceChanged","index","choicesLength","showCorrect","isEvaluateMode","choiceMode","correctness","displayKey","classes","choicesLayout","gridColumns","isSelectionButtonBelow","selectedAnswerBackgroundColor","selectedAnswerStrokeColor","selectedAnswerStrokeWidth","hoverAnswerBackgroundColor","hoverAnswerStrokeColor","hoverAnswerStrokeWidth","autoFocusRef","tagName","state","choiceClass","feedback","choiceProps","onChange","normalizeStrokeWidth","width","trimmed","String","trim","test","hasSelectedStroke","hasHoverStroke","currentStrokeColor","currentStrokeWidth","currentBackgroundColor","strokeStyle","border","borderRadius","names","noBorder","horizontalLayout","choiceBackground","backgroundColor","handleMouseEnter","handleMouseLeave","React","Component","propTypes","PropTypes","oneOf","object","bool","isRequired","func","number","string","theme","paddingTop","spacing","unit","paddingBottom","paddingLeft","paddingRight","borderBottom","palette","grey","marginRight"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\n\nimport ChoiceInput from './choice-input';\n\nexport class Choice extends React.Component {\n static propTypes = {};\n\n state = {\n isHovered: false,\n };\n\n handleMouseEnter = () => {\n const { disabled, checked } = this.props;\n\n if (!disabled && !checked) {\n this.setState({ isHovered: true });\n }\n };\n\n handleMouseLeave = () => {\n this.setState({ isHovered: false });\n };\n\n onChange = (choice) => {\n const { disabled, onChoiceChanged } = this.props;\n\n if (!disabled) {\n onChoiceChanged(choice);\n }\n };\n\n render() {\n const {\n choice,\n index,\n choicesLength,\n showCorrect,\n isEvaluateMode,\n choiceMode,\n disabled,\n checked,\n correctness,\n displayKey,\n classes,\n choicesLayout,\n gridColumns,\n isSelectionButtonBelow,\n selectedAnswerBackgroundColor,\n selectedAnswerStrokeColor,\n selectedAnswerStrokeWidth,\n hoverAnswerBackgroundColor,\n hoverAnswerStrokeColor,\n hoverAnswerStrokeWidth,\n autoFocusRef,\n tagName\n } = this.props;\n \n const { isHovered } = this.state;\n const choiceClass = 'choice' + (index === choicesLength - 1 ? ' last' : '');\n\n const feedback = !isEvaluateMode || showCorrect ? '' : choice.feedback;\n\n const choiceProps = {\n ...choice,\n checked,\n choiceMode,\n disabled,\n feedback,\n correctness,\n displayKey,\n index,\n choicesLayout,\n gridColumns,\n onChange: this.onChange,\n isEvaluateMode,\n isSelectionButtonBelow,\n selectedAnswerStrokeColor,\n selectedAnswerStrokeWidth,\n tagName,\n };\n\n const normalizeStrokeWidth = (width) => {\n if (!width) return '2px'; // default\n const trimmed = String(width).trim();\n \n // add 'px' if the value is a number\n if (/^\\d+(\\.\\d+)?$/.test(trimmed)) {\n return `${trimmed}px`;\n }\n\n return trimmed;\n };\n\n const hasSelectedStroke = selectedAnswerStrokeColor && selectedAnswerStrokeColor !== 'initial';\n const hasHoverStroke = hoverAnswerStrokeColor && hoverAnswerStrokeColor !== 'initial';\n \n let currentStrokeColor = 'transparent';\n let currentStrokeWidth = '2px';\n let currentBackgroundColor = 'initial';\n \n if ((hasSelectedStroke || hasHoverStroke)) {\n if (checked && hasSelectedStroke) {\n // selected state takes priority when selected stroke is configured\n currentStrokeColor = selectedAnswerStrokeColor;\n currentStrokeWidth = selectedAnswerStrokeWidth;\n } else if (isHovered && !disabled && hasHoverStroke) {\n // hover state when not selected and not disabled, and hover stroke is configured\n currentStrokeColor = hoverAnswerStrokeColor;\n currentStrokeWidth = hoverAnswerStrokeWidth;\n }\n }\n \n if (checked && selectedAnswerBackgroundColor && selectedAnswerBackgroundColor !== 'initial') {\n currentBackgroundColor = selectedAnswerBackgroundColor;\n } else if (isHovered && !disabled && hoverAnswerBackgroundColor && hoverAnswerBackgroundColor !== 'initial') {\n currentBackgroundColor = hoverAnswerBackgroundColor;\n }\n\n const strokeStyle = (hasSelectedStroke || hasHoverStroke) ? {\n border: `${normalizeStrokeWidth(currentStrokeWidth)} solid ${currentStrokeColor}`,\n borderRadius: '8px',\n } : {};\n\n const names = classNames(classes.choice, {\n [classes.noBorder]: index === choicesLength - 1 || choicesLayout !== 'vertical' || strokeStyle,\n [classes.horizontalLayout]: choicesLayout === 'horizontal',\n });\n\n const choiceBackground = currentBackgroundColor !== 'initial' ? currentBackgroundColor : 'initial';\n\n return (\n <div \n className={choiceClass} \n key={index} \n style={{ backgroundColor: choiceBackground, ...strokeStyle }}\n onMouseEnter={this.handleMouseEnter}\n onMouseLeave={this.handleMouseLeave}\n >\n <ChoiceInput {...choiceProps} className={names} autoFocusRef={autoFocusRef} />\n </div>\n );\n }\n}\n\nChoice.propTypes = {\n choiceMode: PropTypes.oneOf(['radio', 'checkbox']),\n choice: PropTypes.object,\n disabled: PropTypes.bool.isRequired,\n onChoiceChanged: PropTypes.func,\n classes: PropTypes.object.isRequired,\n index: PropTypes.number,\n choicesLength: PropTypes.number,\n showCorrect: PropTypes.bool,\n isEvaluateMode: PropTypes.bool,\n checked: PropTypes.bool,\n correctness: PropTypes.string,\n displayKey: PropTypes.string,\n choicesLayout: PropTypes.oneOf(['vertical', 'grid', 'horizontal']),\n gridColumns: PropTypes.string,\n selectedAnswerBackgroundColor: PropTypes.string,\n selectedAnswerStrokeColor: PropTypes.string,\n selectedAnswerStrokeWidth: PropTypes.string,\n hoverAnswerBackgroundColor: PropTypes.string,\n hoverAnswerStrokeColor: PropTypes.string,\n hoverAnswerStrokeWidth: PropTypes.string,\n tagName: PropTypes.string,\n isSelectionButtonBelow: PropTypes.bool,\n autoFocusRef: PropTypes.object,\n};\n\nexport default withStyles((theme) => ({\n choice: {\n paddingTop: theme.spacing.unit * 2.5,\n paddingBottom: theme.spacing.unit + 2,\n paddingLeft: theme.spacing.unit + 2,\n paddingRight: theme.spacing.unit + 2,\n borderBottom: `1px solid ${theme.palette.grey[300]}`,\n },\n noBorder: {\n borderBottom: 'none',\n },\n horizontalLayout: {\n paddingRight: theme.spacing.unit * 2.5,\n '& label': {\n marginRight: theme.spacing.unit,\n // '& span:first-child': {\n // paddingRight: 0\n // }\n },\n },\n}))(Choice);\n"],"file":"choice.js"}
|
|
@@ -1,174 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
|
-
Object.defineProperty(exports, "__esModule", {
|
|
6
|
-
value: true
|
|
7
|
-
});
|
|
8
|
-
exports["default"] = void 0;
|
|
9
|
-
|
|
10
|
-
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
11
|
-
|
|
12
|
-
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
13
|
-
|
|
14
|
-
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
15
|
-
|
|
16
|
-
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
|
17
|
-
|
|
18
|
-
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
|
19
|
-
|
|
20
|
-
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
21
|
-
|
|
22
|
-
var _react = _interopRequireDefault(require("react"));
|
|
23
|
-
|
|
24
|
-
var _reactTransitionGroup = require("react-transition-group");
|
|
25
|
-
|
|
26
|
-
var _styles = require("@material-ui/core/styles");
|
|
27
|
-
|
|
28
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
29
|
-
|
|
30
|
-
var _renderUi = require("@pie-lib/pie-toolbox/render-ui");
|
|
31
|
-
|
|
32
|
-
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
|
|
33
|
-
|
|
34
|
-
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
35
|
-
|
|
36
|
-
var stylesheet = {
|
|
37
|
-
incorrect: {
|
|
38
|
-
fill: "var(--feedback-incorrect-bg-color, ".concat(_renderUi.color.incorrect(), ")")
|
|
39
|
-
},
|
|
40
|
-
correct: {
|
|
41
|
-
fill: "var(--feedback-correct-bg-color, ".concat(_renderUi.color.correct(), ")")
|
|
42
|
-
},
|
|
43
|
-
feedbackTick: {
|
|
44
|
-
width: '33px',
|
|
45
|
-
height: '33px',
|
|
46
|
-
'& svg': {
|
|
47
|
-
position: 'absolute',
|
|
48
|
-
display: 'inline-block',
|
|
49
|
-
width: '33px',
|
|
50
|
-
height: '33px',
|
|
51
|
-
verticalAlign: 'middle',
|
|
52
|
-
'& hide': {
|
|
53
|
-
display: 'none'
|
|
54
|
-
}
|
|
55
|
-
}
|
|
56
|
-
},
|
|
57
|
-
feedbackTickEnter: {
|
|
58
|
-
opacity: '0',
|
|
59
|
-
left: '-50px'
|
|
60
|
-
},
|
|
61
|
-
feedbackTickEnterActive: {
|
|
62
|
-
opacity: '1',
|
|
63
|
-
left: '0px',
|
|
64
|
-
transition: 'left 500ms ease-in 200ms, opacity 500ms linear 200ms'
|
|
65
|
-
},
|
|
66
|
-
feedbackTickLeave: {
|
|
67
|
-
opacity: '1',
|
|
68
|
-
left: '0px'
|
|
69
|
-
},
|
|
70
|
-
feedbackTickLeaveActive: {
|
|
71
|
-
opacity: '0',
|
|
72
|
-
left: '-50px',
|
|
73
|
-
transition: 'left 300ms ease-in, opacity 300ms'
|
|
74
|
-
}
|
|
75
|
-
};
|
|
76
|
-
|
|
77
|
-
var FeedbackTick = /*#__PURE__*/function (_React$Component) {
|
|
78
|
-
(0, _inherits2["default"])(FeedbackTick, _React$Component);
|
|
79
|
-
|
|
80
|
-
var _super = _createSuper(FeedbackTick);
|
|
81
|
-
|
|
82
|
-
function FeedbackTick(props) {
|
|
83
|
-
var _this;
|
|
84
|
-
|
|
85
|
-
(0, _classCallCheck2["default"])(this, FeedbackTick);
|
|
86
|
-
_this = _super.call(this, props);
|
|
87
|
-
_this.incorrectIcon = /*#__PURE__*/_react["default"].createElement("svg", {
|
|
88
|
-
key: "1",
|
|
89
|
-
preserveAspectRatio: "xMinYMin meet",
|
|
90
|
-
x: "0px",
|
|
91
|
-
y: "0px",
|
|
92
|
-
viewBox: "0 0 44 40",
|
|
93
|
-
style: {
|
|
94
|
-
enableBackground: 'new 0 0 44 40'
|
|
95
|
-
}
|
|
96
|
-
}, /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("rect", {
|
|
97
|
-
x: "11",
|
|
98
|
-
y: "17.3",
|
|
99
|
-
transform: "matrix(0.7071 -0.7071 0.7071 0.7071 -7.852 19.2507)",
|
|
100
|
-
className: _this.props.classes.incorrect,
|
|
101
|
-
width: "16.6",
|
|
102
|
-
height: "3.7"
|
|
103
|
-
}), /*#__PURE__*/_react["default"].createElement("rect", {
|
|
104
|
-
x: "17.4",
|
|
105
|
-
y: "10.7",
|
|
106
|
-
transform: "matrix(0.7071 -0.7071 0.7071 0.7071 -7.8175 19.209)",
|
|
107
|
-
className: _this.props.classes.incorrect,
|
|
108
|
-
width: "3.7",
|
|
109
|
-
height: "16.6"
|
|
110
|
-
})));
|
|
111
|
-
_this.correctIcon = /*#__PURE__*/_react["default"].createElement("svg", {
|
|
112
|
-
key: "2",
|
|
113
|
-
preserveAspectRatio: "xMinYMin meet",
|
|
114
|
-
version: "1.1",
|
|
115
|
-
x: "0px",
|
|
116
|
-
y: "0px",
|
|
117
|
-
viewBox: "0 0 44 40",
|
|
118
|
-
style: {
|
|
119
|
-
enableBackground: 'new 0 0 44 40'
|
|
120
|
-
}
|
|
121
|
-
}, /*#__PURE__*/_react["default"].createElement("polygon", {
|
|
122
|
-
className: _this.props.classes.correct,
|
|
123
|
-
points: "19.1,28.6 11.8,22.3 14.4,19.2 17.9,22.1 23.9,11.4 27.5,13.4"
|
|
124
|
-
}));
|
|
125
|
-
return _this;
|
|
126
|
-
}
|
|
127
|
-
|
|
128
|
-
(0, _createClass2["default"])(FeedbackTick, [{
|
|
129
|
-
key: "render",
|
|
130
|
-
value: function render() {
|
|
131
|
-
var _this2 = this;
|
|
132
|
-
|
|
133
|
-
var _this$props = this.props,
|
|
134
|
-
correctness = _this$props.correctness,
|
|
135
|
-
classes = _this$props.classes;
|
|
136
|
-
|
|
137
|
-
var icon = function () {
|
|
138
|
-
if (correctness === 'incorrect') {
|
|
139
|
-
return _this2.incorrectIcon;
|
|
140
|
-
} else if (correctness === 'correct') {
|
|
141
|
-
return _this2.correctIcon;
|
|
142
|
-
}
|
|
143
|
-
}();
|
|
144
|
-
|
|
145
|
-
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
146
|
-
className: classes.feedbackTick
|
|
147
|
-
}, /*#__PURE__*/_react["default"].createElement(_reactTransitionGroup.TransitionGroup, null, correctness && /*#__PURE__*/_react["default"].createElement(_reactTransitionGroup.CSSTransition, {
|
|
148
|
-
classNames: {
|
|
149
|
-
enter: classes.feedbackTickEnter,
|
|
150
|
-
enterActive: classes.feedbackTickEnterActive,
|
|
151
|
-
exit: classes.feedbackTickLeave,
|
|
152
|
-
exitActive: classes.feedbackTickLeaveActive
|
|
153
|
-
},
|
|
154
|
-
timeout: {
|
|
155
|
-
enter: 700,
|
|
156
|
-
exit: 300
|
|
157
|
-
}
|
|
158
|
-
}, icon)));
|
|
159
|
-
}
|
|
160
|
-
}]);
|
|
161
|
-
return FeedbackTick;
|
|
162
|
-
}(_react["default"].Component);
|
|
163
|
-
|
|
164
|
-
(0, _defineProperty2["default"])(FeedbackTick, "propTypes", {
|
|
165
|
-
classes: _propTypes["default"].object.isRequired,
|
|
166
|
-
correctness: _propTypes["default"].string
|
|
167
|
-
});
|
|
168
|
-
|
|
169
|
-
var _default = (0, _styles.withStyles)(stylesheet, {
|
|
170
|
-
name: 'FeedbackTick'
|
|
171
|
-
})(FeedbackTick);
|
|
172
|
-
|
|
173
|
-
exports["default"] = _default;
|
|
174
|
-
//# sourceMappingURL=feedback-tick.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/feedback-tick.jsx"],"names":["stylesheet","incorrect","fill","color","correct","feedbackTick","width","height","position","display","verticalAlign","feedbackTickEnter","opacity","left","feedbackTickEnterActive","transition","feedbackTickLeave","feedbackTickLeaveActive","FeedbackTick","props","incorrectIcon","enableBackground","classes","correctIcon","correctness","icon","enter","enterActive","exit","exitActive","React","Component","PropTypes","object","isRequired","string","name"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { TransitionGroup, CSSTransition } from 'react-transition-group';\nimport { withStyles } from '@material-ui/core/styles';\nimport PropTypes from 'prop-types';\nimport { color } from '@pie-lib/pie-toolbox/render-ui';\n\nconst stylesheet = {\n incorrect: {\n fill: `var(--feedback-incorrect-bg-color, ${color.incorrect()})`,\n },\n correct: {\n fill: `var(--feedback-correct-bg-color, ${color.correct()})`,\n },\n feedbackTick: {\n width: '33px',\n height: '33px',\n '& svg': {\n position: 'absolute',\n display: 'inline-block',\n width: '33px',\n height: '33px',\n verticalAlign: 'middle',\n '& hide': {\n display: 'none',\n },\n },\n },\n feedbackTickEnter: {\n opacity: '0',\n left: '-50px',\n },\n feedbackTickEnterActive: {\n opacity: '1',\n left: '0px',\n transition: 'left 500ms ease-in 200ms, opacity 500ms linear 200ms',\n },\n feedbackTickLeave: {\n opacity: '1',\n left: '0px',\n },\n feedbackTickLeaveActive: {\n opacity: '0',\n left: '-50px',\n transition: 'left 300ms ease-in, opacity 300ms',\n },\n};\n\nclass FeedbackTick extends React.Component {\n static propTypes = {\n classes: PropTypes.object.isRequired,\n correctness: PropTypes.string,\n };\n constructor(props) {\n super(props);\n this.incorrectIcon = (\n <svg\n key=\"1\"\n preserveAspectRatio=\"xMinYMin meet\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 44 40\"\n style={{ enableBackground: 'new 0 0 44 40' }}\n >\n <g>\n <rect\n x=\"11\"\n y=\"17.3\"\n transform=\"matrix(0.7071 -0.7071 0.7071 0.7071 -7.852 19.2507)\"\n className={this.props.classes.incorrect}\n width=\"16.6\"\n height=\"3.7\"\n />\n <rect\n x=\"17.4\"\n y=\"10.7\"\n transform=\"matrix(0.7071 -0.7071 0.7071 0.7071 -7.8175 19.209)\"\n className={this.props.classes.incorrect}\n width=\"3.7\"\n height=\"16.6\"\n />\n </g>\n </svg>\n );\n\n this.correctIcon = (\n <svg\n key=\"2\"\n preserveAspectRatio=\"xMinYMin meet\"\n version=\"1.1\"\n x=\"0px\"\n y=\"0px\"\n viewBox=\"0 0 44 40\"\n style={{ enableBackground: 'new 0 0 44 40' }}\n >\n <polygon\n className={this.props.classes.correct}\n points=\"19.1,28.6 11.8,22.3 14.4,19.2 17.9,22.1 23.9,11.4 27.5,13.4\"\n />\n </svg>\n );\n }\n\n render() {\n const { correctness, classes } = this.props;\n\n const icon = (() => {\n if (correctness === 'incorrect') {\n return this.incorrectIcon;\n } else if (correctness === 'correct') {\n return this.correctIcon;\n }\n })();\n\n return (\n <div className={classes.feedbackTick}>\n <TransitionGroup>\n {correctness && (\n <CSSTransition\n classNames={{\n enter: classes.feedbackTickEnter,\n enterActive: classes.feedbackTickEnterActive,\n exit: classes.feedbackTickLeave,\n exitActive: classes.feedbackTickLeaveActive,\n }}\n timeout={{ enter: 700, exit: 300 }}\n >\n {icon}\n </CSSTransition>\n )}\n </TransitionGroup>\n </div>\n );\n }\n}\n\nexport default withStyles(stylesheet, { name: 'FeedbackTick' })(FeedbackTick);\n"],"file":"feedback-tick.js"}
|