@pie-element/ebsr 7.0.25 → 8.1.0

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/print.js DELETED
@@ -1,2188 +0,0 @@
1
- import {_dll_prop_types, _dll_react_dom, _dll_react, _dll_material_ui__core_styles, _dll_pie_lib__render_ui, _dll_material_ui__core, _dll_classnames, _dll_pie_lib__correct_answer_toggle, _dll_lodash, _dll_debug} from "../../../@pie-lib/shared-module@^1.4.19/module/index.js";
2
- import {_dll_pie_lib__math_rendering} from "../../../@pie-lib/math-rendering-module@^1.1.7/module/index.js";
3
- function getDefaultExportFromCjs(x) {
4
- return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
5
- }
6
- function getAugmentedNamespace(n) {
7
- if (n.__esModule) return n;
8
- var a = Object.defineProperty({}, '__esModule', {
9
- value: true
10
- });
11
- Object.keys(n).forEach(function (k) {
12
- var d = Object.getOwnPropertyDescriptor(n, k);
13
- Object.defineProperty(a, k, d.get ? d : {
14
- enumerable: true,
15
- get: function () {
16
- return n[k];
17
- }
18
- });
19
- });
20
- return a;
21
- }
22
- var CSSTransition = {
23
- exports: {}
24
- };
25
- var addClass = {
26
- exports: {}
27
- };
28
- var interopRequireDefault = {
29
- exports: {}
30
- };
31
- (function (module) {
32
- function _interopRequireDefault(obj) {
33
- return obj && obj.__esModule ? obj : {
34
- "default": obj
35
- };
36
- }
37
- (module.exports = _interopRequireDefault, module.exports.__esModule = true, module.exports["default"] = module.exports);
38
- })(interopRequireDefault);
39
- getDefaultExportFromCjs(interopRequireDefault.exports);
40
- var hasClass = {
41
- exports: {}
42
- };
43
- (function (module, exports) {
44
- exports.__esModule = true;
45
- exports.default = hasClass;
46
- function hasClass(element, className) {
47
- if (element.classList) return !!className && element.classList.contains(className); else return (" " + (element.className.baseVal || element.className) + " ").indexOf(" " + className + " ") !== -1;
48
- }
49
- module.exports = exports["default"];
50
- })(hasClass, hasClass.exports);
51
- getDefaultExportFromCjs(hasClass.exports);
52
- (function (module, exports) {
53
- var _interopRequireDefault = interopRequireDefault.exports;
54
- exports.__esModule = true;
55
- exports.default = addClass;
56
- var _hasClass = _interopRequireDefault(hasClass.exports);
57
- function addClass(element, className) {
58
- if (element.classList) element.classList.add(className); else if (!(0, _hasClass.default)(element, className)) if (typeof element.className === 'string') element.className = element.className + ' ' + className; else element.setAttribute('class', (element.className && element.className.baseVal || '') + ' ' + className);
59
- }
60
- module.exports = exports["default"];
61
- })(addClass, addClass.exports);
62
- getDefaultExportFromCjs(addClass.exports);
63
- function replaceClassName(origClass, classToRemove) {
64
- return origClass.replace(new RegExp('(^|\\s)' + classToRemove + '(?:\\s|$)', 'g'), '$1').replace(/\s+/g, ' ').replace(/^\s*|\s*$/g, '');
65
- }
66
- var removeClass = function removeClass(element, className) {
67
- if (element.classList) element.classList.remove(className); else if (typeof element.className === 'string') element.className = replaceClassName(element.className, className); else element.setAttribute('class', replaceClassName(element.className && element.className.baseVal || '', className));
68
- };
69
- var Transition$1 = {};
70
- function componentWillMount() {
71
- var state = this.constructor.getDerivedStateFromProps(this.props, this.state);
72
- if (state !== null && state !== undefined) {
73
- this.setState(state);
74
- }
75
- }
76
- function componentWillReceiveProps(nextProps) {
77
- function updater(prevState) {
78
- var state = this.constructor.getDerivedStateFromProps(nextProps, prevState);
79
- return state !== null && state !== undefined ? state : null;
80
- }
81
- this.setState(updater.bind(this));
82
- }
83
- function componentWillUpdate(nextProps, nextState) {
84
- try {
85
- var prevProps = this.props;
86
- var prevState = this.state;
87
- this.props = nextProps;
88
- this.state = nextState;
89
- this.__reactInternalSnapshotFlag = true;
90
- this.__reactInternalSnapshot = this.getSnapshotBeforeUpdate(prevProps, prevState);
91
- } finally {
92
- this.props = prevProps;
93
- this.state = prevState;
94
- }
95
- }
96
- componentWillMount.__suppressDeprecationWarning = true;
97
- componentWillReceiveProps.__suppressDeprecationWarning = true;
98
- componentWillUpdate.__suppressDeprecationWarning = true;
99
- function polyfill(Component) {
100
- var prototype = Component.prototype;
101
- if (!prototype || !prototype.isReactComponent) {
102
- throw new Error('Can only polyfill class components');
103
- }
104
- if (typeof Component.getDerivedStateFromProps !== 'function' && typeof prototype.getSnapshotBeforeUpdate !== 'function') {
105
- return Component;
106
- }
107
- var foundWillMountName = null;
108
- var foundWillReceivePropsName = null;
109
- var foundWillUpdateName = null;
110
- if (typeof prototype.componentWillMount === 'function') {
111
- foundWillMountName = 'componentWillMount';
112
- } else if (typeof prototype.UNSAFE_componentWillMount === 'function') {
113
- foundWillMountName = 'UNSAFE_componentWillMount';
114
- }
115
- if (typeof prototype.componentWillReceiveProps === 'function') {
116
- foundWillReceivePropsName = 'componentWillReceiveProps';
117
- } else if (typeof prototype.UNSAFE_componentWillReceiveProps === 'function') {
118
- foundWillReceivePropsName = 'UNSAFE_componentWillReceiveProps';
119
- }
120
- if (typeof prototype.componentWillUpdate === 'function') {
121
- foundWillUpdateName = 'componentWillUpdate';
122
- } else if (typeof prototype.UNSAFE_componentWillUpdate === 'function') {
123
- foundWillUpdateName = 'UNSAFE_componentWillUpdate';
124
- }
125
- if (foundWillMountName !== null || foundWillReceivePropsName !== null || foundWillUpdateName !== null) {
126
- var componentName = Component.displayName || Component.name;
127
- var newApiName = typeof Component.getDerivedStateFromProps === 'function' ? 'getDerivedStateFromProps()' : 'getSnapshotBeforeUpdate()';
128
- throw Error('Unsafe legacy lifecycles will not be called for components using new component APIs.\n\n' + componentName + ' uses ' + newApiName + ' but also contains the following legacy lifecycles:' + (foundWillMountName !== null ? '\n ' + foundWillMountName : '') + (foundWillReceivePropsName !== null ? '\n ' + foundWillReceivePropsName : '') + (foundWillUpdateName !== null ? '\n ' + foundWillUpdateName : '') + '\n\nThe above lifecycles should be removed. Learn more about this warning here:\n' + 'https://fb.me/react-async-component-lifecycle-hooks');
129
- }
130
- if (typeof Component.getDerivedStateFromProps === 'function') {
131
- prototype.componentWillMount = componentWillMount;
132
- prototype.componentWillReceiveProps = componentWillReceiveProps;
133
- }
134
- if (typeof prototype.getSnapshotBeforeUpdate === 'function') {
135
- if (typeof prototype.componentDidUpdate !== 'function') {
136
- throw new Error('Cannot polyfill getSnapshotBeforeUpdate() for components that do not define componentDidUpdate() on the prototype');
137
- }
138
- prototype.componentWillUpdate = componentWillUpdate;
139
- var componentDidUpdate = prototype.componentDidUpdate;
140
- prototype.componentDidUpdate = function componentDidUpdatePolyfill(prevProps, prevState, maybeSnapshot) {
141
- var snapshot = this.__reactInternalSnapshotFlag ? this.__reactInternalSnapshot : maybeSnapshot;
142
- componentDidUpdate.call(this, prevProps, prevState, snapshot);
143
- };
144
- }
145
- return Component;
146
- }
147
- var reactLifecyclesCompat_es = Object.freeze({
148
- __proto__: null,
149
- polyfill: polyfill
150
- });
151
- var require$$2$2 = getAugmentedNamespace(reactLifecyclesCompat_es);
152
- var PropTypes$6 = {};
153
- const require$$0$5 = _dll_prop_types;
154
- PropTypes$6.__esModule = true;
155
- PropTypes$6.classNamesShape = PropTypes$6.timeoutsShape = void 0;
156
- var _propTypes = _interopRequireDefault$2(require$$0$5);
157
- function _interopRequireDefault$2(obj) {
158
- return obj && obj.__esModule ? obj : {
159
- default: obj
160
- };
161
- }
162
- var timeoutsShape = _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.shape({
163
- enter: _propTypes.default.number,
164
- exit: _propTypes.default.number,
165
- appear: _propTypes.default.number
166
- }).isRequired]);
167
- PropTypes$6.timeoutsShape = timeoutsShape;
168
- var classNamesShape = _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.shape({
169
- enter: _propTypes.default.string,
170
- exit: _propTypes.default.string,
171
- active: _propTypes.default.string
172
- }), _propTypes.default.shape({
173
- enter: _propTypes.default.string,
174
- enterDone: _propTypes.default.string,
175
- enterActive: _propTypes.default.string,
176
- exit: _propTypes.default.string,
177
- exitDone: _propTypes.default.string,
178
- exitActive: _propTypes.default.string
179
- })]);
180
- PropTypes$6.classNamesShape = classNamesShape;
181
- const require$$0$4 = _dll_prop_types;
182
- const require$$1$2 = _dll_react;
183
- const require$$2$1 = _dll_react_dom;
184
- Transition$1.__esModule = true;
185
- Transition$1.default = Transition$1.EXITING = Transition$1.ENTERED = Transition$1.ENTERING = Transition$1.EXITED = Transition$1.UNMOUNTED = void 0;
186
- var PropTypes$5 = _interopRequireWildcard(require$$0$4);
187
- var _react$1 = _interopRequireDefault$1(require$$1$2);
188
- var _reactDom = _interopRequireDefault$1(require$$2$1);
189
- var _reactLifecyclesCompat = require$$2$2;
190
- var _PropTypes = PropTypes$6;
191
- function _interopRequireDefault$1(obj) {
192
- return obj && obj.__esModule ? obj : {
193
- default: obj
194
- };
195
- }
196
- function _interopRequireWildcard(obj) {
197
- if (obj && obj.__esModule) {
198
- return obj;
199
- } else {
200
- var newObj = {};
201
- if (obj != null) {
202
- for (var key in obj) {
203
- if (Object.prototype.hasOwnProperty.call(obj, key)) {
204
- var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {};
205
- if (desc.get || desc.set) {
206
- Object.defineProperty(newObj, key, desc);
207
- } else {
208
- newObj[key] = obj[key];
209
- }
210
- }
211
- }
212
- }
213
- newObj.default = obj;
214
- return newObj;
215
- }
216
- }
217
- function _objectWithoutPropertiesLoose(source, excluded) {
218
- if (source == null) return {};
219
- var target = {};
220
- var sourceKeys = Object.keys(source);
221
- var key, i;
222
- for (i = 0; i < sourceKeys.length; i++) {
223
- key = sourceKeys[i];
224
- if (excluded.indexOf(key) >= 0) continue;
225
- target[key] = source[key];
226
- }
227
- return target;
228
- }
229
- function _inheritsLoose(subClass, superClass) {
230
- subClass.prototype = Object.create(superClass.prototype);
231
- subClass.prototype.constructor = subClass;
232
- subClass.__proto__ = superClass;
233
- }
234
- var UNMOUNTED = 'unmounted';
235
- Transition$1.UNMOUNTED = UNMOUNTED;
236
- var EXITED = 'exited';
237
- Transition$1.EXITED = EXITED;
238
- var ENTERING = 'entering';
239
- Transition$1.ENTERING = ENTERING;
240
- var ENTERED = 'entered';
241
- Transition$1.ENTERED = ENTERED;
242
- var EXITING = 'exiting';
243
- Transition$1.EXITING = EXITING;
244
- var Transition = (function (_React$Component) {
245
- _inheritsLoose(Transition, _React$Component);
246
- function Transition(props, context) {
247
- var _this;
248
- _this = _React$Component.call(this, props, context) || this;
249
- var parentGroup = context.transitionGroup;
250
- var appear = parentGroup && !parentGroup.isMounting ? props.enter : props.appear;
251
- var initialStatus;
252
- _this.appearStatus = null;
253
- if (props.in) {
254
- if (appear) {
255
- initialStatus = EXITED;
256
- _this.appearStatus = ENTERING;
257
- } else {
258
- initialStatus = ENTERED;
259
- }
260
- } else {
261
- if (props.unmountOnExit || props.mountOnEnter) {
262
- initialStatus = UNMOUNTED;
263
- } else {
264
- initialStatus = EXITED;
265
- }
266
- }
267
- _this.state = {
268
- status: initialStatus
269
- };
270
- _this.nextCallback = null;
271
- return _this;
272
- }
273
- var _proto = Transition.prototype;
274
- _proto.getChildContext = function getChildContext() {
275
- return {
276
- transitionGroup: null
277
- };
278
- };
279
- Transition.getDerivedStateFromProps = function getDerivedStateFromProps(_ref, prevState) {
280
- var nextIn = _ref.in;
281
- if (nextIn && prevState.status === UNMOUNTED) {
282
- return {
283
- status: EXITED
284
- };
285
- }
286
- return null;
287
- };
288
- _proto.componentDidMount = function componentDidMount() {
289
- this.updateStatus(true, this.appearStatus);
290
- };
291
- _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
292
- var nextStatus = null;
293
- if (prevProps !== this.props) {
294
- var status = this.state.status;
295
- if (this.props.in) {
296
- if (status !== ENTERING && status !== ENTERED) {
297
- nextStatus = ENTERING;
298
- }
299
- } else {
300
- if (status === ENTERING || status === ENTERED) {
301
- nextStatus = EXITING;
302
- }
303
- }
304
- }
305
- this.updateStatus(false, nextStatus);
306
- };
307
- _proto.componentWillUnmount = function componentWillUnmount() {
308
- this.cancelNextCallback();
309
- };
310
- _proto.getTimeouts = function getTimeouts() {
311
- var timeout = this.props.timeout;
312
- var exit, enter, appear;
313
- exit = enter = appear = timeout;
314
- if (timeout != null && typeof timeout !== 'number') {
315
- exit = timeout.exit;
316
- enter = timeout.enter;
317
- appear = timeout.appear !== undefined ? timeout.appear : enter;
318
- }
319
- return {
320
- exit: exit,
321
- enter: enter,
322
- appear: appear
323
- };
324
- };
325
- _proto.updateStatus = function updateStatus(mounting, nextStatus) {
326
- if (mounting === void 0) {
327
- mounting = false;
328
- }
329
- if (nextStatus !== null) {
330
- this.cancelNextCallback();
331
- var node = _reactDom.default.findDOMNode(this);
332
- if (nextStatus === ENTERING) {
333
- this.performEnter(node, mounting);
334
- } else {
335
- this.performExit(node);
336
- }
337
- } else if (this.props.unmountOnExit && this.state.status === EXITED) {
338
- this.setState({
339
- status: UNMOUNTED
340
- });
341
- }
342
- };
343
- _proto.performEnter = function performEnter(node, mounting) {
344
- var _this2 = this;
345
- var enter = this.props.enter;
346
- var appearing = this.context.transitionGroup ? this.context.transitionGroup.isMounting : mounting;
347
- var timeouts = this.getTimeouts();
348
- var enterTimeout = appearing ? timeouts.appear : timeouts.enter;
349
- if (!mounting && !enter) {
350
- this.safeSetState({
351
- status: ENTERED
352
- }, function () {
353
- _this2.props.onEntered(node);
354
- });
355
- return;
356
- }
357
- this.props.onEnter(node, appearing);
358
- this.safeSetState({
359
- status: ENTERING
360
- }, function () {
361
- _this2.props.onEntering(node, appearing);
362
- _this2.onTransitionEnd(node, enterTimeout, function () {
363
- _this2.safeSetState({
364
- status: ENTERED
365
- }, function () {
366
- _this2.props.onEntered(node, appearing);
367
- });
368
- });
369
- });
370
- };
371
- _proto.performExit = function performExit(node) {
372
- var _this3 = this;
373
- var exit = this.props.exit;
374
- var timeouts = this.getTimeouts();
375
- if (!exit) {
376
- this.safeSetState({
377
- status: EXITED
378
- }, function () {
379
- _this3.props.onExited(node);
380
- });
381
- return;
382
- }
383
- this.props.onExit(node);
384
- this.safeSetState({
385
- status: EXITING
386
- }, function () {
387
- _this3.props.onExiting(node);
388
- _this3.onTransitionEnd(node, timeouts.exit, function () {
389
- _this3.safeSetState({
390
- status: EXITED
391
- }, function () {
392
- _this3.props.onExited(node);
393
- });
394
- });
395
- });
396
- };
397
- _proto.cancelNextCallback = function cancelNextCallback() {
398
- if (this.nextCallback !== null) {
399
- this.nextCallback.cancel();
400
- this.nextCallback = null;
401
- }
402
- };
403
- _proto.safeSetState = function safeSetState(nextState, callback) {
404
- callback = this.setNextCallback(callback);
405
- this.setState(nextState, callback);
406
- };
407
- _proto.setNextCallback = function setNextCallback(callback) {
408
- var _this4 = this;
409
- var active = true;
410
- this.nextCallback = function (event) {
411
- if (active) {
412
- active = false;
413
- _this4.nextCallback = null;
414
- callback(event);
415
- }
416
- };
417
- this.nextCallback.cancel = function () {
418
- active = false;
419
- };
420
- return this.nextCallback;
421
- };
422
- _proto.onTransitionEnd = function onTransitionEnd(node, timeout, handler) {
423
- this.setNextCallback(handler);
424
- var doesNotHaveTimeoutOrListener = timeout == null && !this.props.addEndListener;
425
- if (!node || doesNotHaveTimeoutOrListener) {
426
- setTimeout(this.nextCallback, 0);
427
- return;
428
- }
429
- if (this.props.addEndListener) {
430
- this.props.addEndListener(node, this.nextCallback);
431
- }
432
- if (timeout != null) {
433
- setTimeout(this.nextCallback, timeout);
434
- }
435
- };
436
- _proto.render = function render() {
437
- var status = this.state.status;
438
- if (status === UNMOUNTED) {
439
- return null;
440
- }
441
- var _this$props = this.props, children = _this$props.children, childProps = _objectWithoutPropertiesLoose(_this$props, ["children"]);
442
- delete childProps.in;
443
- delete childProps.mountOnEnter;
444
- delete childProps.unmountOnExit;
445
- delete childProps.appear;
446
- delete childProps.enter;
447
- delete childProps.exit;
448
- delete childProps.timeout;
449
- delete childProps.addEndListener;
450
- delete childProps.onEnter;
451
- delete childProps.onEntering;
452
- delete childProps.onEntered;
453
- delete childProps.onExit;
454
- delete childProps.onExiting;
455
- delete childProps.onExited;
456
- if (typeof children === 'function') {
457
- return children(status, childProps);
458
- }
459
- var child = _react$1.default.Children.only(children);
460
- return _react$1.default.cloneElement(child, childProps);
461
- };
462
- return Transition;
463
- })(_react$1.default.Component);
464
- Transition.contextTypes = {
465
- transitionGroup: PropTypes$5.object
466
- };
467
- Transition.childContextTypes = {
468
- transitionGroup: function transitionGroup() {}
469
- };
470
- Transition.propTypes = {
471
- children: PropTypes$5.oneOfType([PropTypes$5.func.isRequired, PropTypes$5.element.isRequired]).isRequired,
472
- in: PropTypes$5.bool,
473
- mountOnEnter: PropTypes$5.bool,
474
- unmountOnExit: PropTypes$5.bool,
475
- appear: PropTypes$5.bool,
476
- enter: PropTypes$5.bool,
477
- exit: PropTypes$5.bool,
478
- timeout: function timeout(props) {
479
- var pt = _PropTypes.timeoutsShape;
480
- if (!props.addEndListener) pt = pt.isRequired;
481
- for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
482
- args[_key - 1] = arguments[_key];
483
- }
484
- return pt.apply(void 0, [props].concat(args));
485
- },
486
- addEndListener: PropTypes$5.func,
487
- onEnter: PropTypes$5.func,
488
- onEntering: PropTypes$5.func,
489
- onEntered: PropTypes$5.func,
490
- onExit: PropTypes$5.func,
491
- onExiting: PropTypes$5.func,
492
- onExited: PropTypes$5.func
493
- };
494
- function noop() {}
495
- Transition.defaultProps = {
496
- in: false,
497
- mountOnEnter: false,
498
- unmountOnExit: false,
499
- appear: false,
500
- enter: true,
501
- exit: true,
502
- onEnter: noop,
503
- onEntering: noop,
504
- onEntered: noop,
505
- onExit: noop,
506
- onExiting: noop,
507
- onExited: noop
508
- };
509
- Transition.UNMOUNTED = 0;
510
- Transition.EXITED = 1;
511
- Transition.ENTERING = 2;
512
- Transition.ENTERED = 3;
513
- Transition.EXITING = 4;
514
- var _default = (0, _reactLifecyclesCompat.polyfill)(Transition);
515
- Transition$1.default = _default;
516
- const require$$0$3 = _dll_prop_types;
517
- const require$$3 = _dll_react;
518
- (function (module, exports) {
519
- exports.__esModule = true;
520
- exports.default = void 0;
521
- var PropTypes = _interopRequireWildcard(require$$0$3);
522
- var _addClass = _interopRequireDefault(addClass.exports);
523
- var _removeClass = _interopRequireDefault(removeClass);
524
- var _react = _interopRequireDefault(require$$3);
525
- var _Transition = _interopRequireDefault(Transition$1);
526
- var _PropTypes = PropTypes$6;
527
- function _interopRequireDefault(obj) {
528
- return obj && obj.__esModule ? obj : {
529
- default: obj
530
- };
531
- }
532
- function _interopRequireWildcard(obj) {
533
- if (obj && obj.__esModule) {
534
- return obj;
535
- } else {
536
- var newObj = {};
537
- if (obj != null) {
538
- for (var key in obj) {
539
- if (Object.prototype.hasOwnProperty.call(obj, key)) {
540
- var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {};
541
- if (desc.get || desc.set) {
542
- Object.defineProperty(newObj, key, desc);
543
- } else {
544
- newObj[key] = obj[key];
545
- }
546
- }
547
- }
548
- }
549
- newObj.default = obj;
550
- return newObj;
551
- }
552
- }
553
- function _extends() {
554
- _extends = Object.assign || (function (target) {
555
- for (var i = 1; i < arguments.length; i++) {
556
- var source = arguments[i];
557
- for (var key in source) {
558
- if (Object.prototype.hasOwnProperty.call(source, key)) {
559
- target[key] = source[key];
560
- }
561
- }
562
- }
563
- return target;
564
- });
565
- return _extends.apply(this, arguments);
566
- }
567
- function _inheritsLoose(subClass, superClass) {
568
- subClass.prototype = Object.create(superClass.prototype);
569
- subClass.prototype.constructor = subClass;
570
- subClass.__proto__ = superClass;
571
- }
572
- var addClass$1 = function addClass(node, classes) {
573
- return node && classes && classes.split(' ').forEach(function (c) {
574
- return (0, _addClass.default)(node, c);
575
- });
576
- };
577
- var removeClass$1 = function removeClass(node, classes) {
578
- return node && classes && classes.split(' ').forEach(function (c) {
579
- return (0, _removeClass.default)(node, c);
580
- });
581
- };
582
- var CSSTransition = (function (_React$Component) {
583
- _inheritsLoose(CSSTransition, _React$Component);
584
- function CSSTransition() {
585
- var _this;
586
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
587
- args[_key] = arguments[_key];
588
- }
589
- _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
590
- _this.onEnter = function (node, appearing) {
591
- var _this$getClassNames = _this.getClassNames(appearing ? 'appear' : 'enter'), className = _this$getClassNames.className;
592
- _this.removeClasses(node, 'exit');
593
- addClass$1(node, className);
594
- if (_this.props.onEnter) {
595
- _this.props.onEnter(node, appearing);
596
- }
597
- };
598
- _this.onEntering = function (node, appearing) {
599
- var _this$getClassNames2 = _this.getClassNames(appearing ? 'appear' : 'enter'), activeClassName = _this$getClassNames2.activeClassName;
600
- _this.reflowAndAddClass(node, activeClassName);
601
- if (_this.props.onEntering) {
602
- _this.props.onEntering(node, appearing);
603
- }
604
- };
605
- _this.onEntered = function (node, appearing) {
606
- var appearClassName = _this.getClassNames('appear').doneClassName;
607
- var enterClassName = _this.getClassNames('enter').doneClassName;
608
- var doneClassName = appearing ? appearClassName + " " + enterClassName : enterClassName;
609
- _this.removeClasses(node, appearing ? 'appear' : 'enter');
610
- addClass$1(node, doneClassName);
611
- if (_this.props.onEntered) {
612
- _this.props.onEntered(node, appearing);
613
- }
614
- };
615
- _this.onExit = function (node) {
616
- var _this$getClassNames3 = _this.getClassNames('exit'), className = _this$getClassNames3.className;
617
- _this.removeClasses(node, 'appear');
618
- _this.removeClasses(node, 'enter');
619
- addClass$1(node, className);
620
- if (_this.props.onExit) {
621
- _this.props.onExit(node);
622
- }
623
- };
624
- _this.onExiting = function (node) {
625
- var _this$getClassNames4 = _this.getClassNames('exit'), activeClassName = _this$getClassNames4.activeClassName;
626
- _this.reflowAndAddClass(node, activeClassName);
627
- if (_this.props.onExiting) {
628
- _this.props.onExiting(node);
629
- }
630
- };
631
- _this.onExited = function (node) {
632
- var _this$getClassNames5 = _this.getClassNames('exit'), doneClassName = _this$getClassNames5.doneClassName;
633
- _this.removeClasses(node, 'exit');
634
- addClass$1(node, doneClassName);
635
- if (_this.props.onExited) {
636
- _this.props.onExited(node);
637
- }
638
- };
639
- _this.getClassNames = function (type) {
640
- var classNames = _this.props.classNames;
641
- var isStringClassNames = typeof classNames === 'string';
642
- var prefix = isStringClassNames && classNames ? classNames + '-' : '';
643
- var className = isStringClassNames ? prefix + type : classNames[type];
644
- var activeClassName = isStringClassNames ? className + '-active' : classNames[type + 'Active'];
645
- var doneClassName = isStringClassNames ? className + '-done' : classNames[type + 'Done'];
646
- return {
647
- className: className,
648
- activeClassName: activeClassName,
649
- doneClassName: doneClassName
650
- };
651
- };
652
- return _this;
653
- }
654
- var _proto = CSSTransition.prototype;
655
- _proto.removeClasses = function removeClasses(node, type) {
656
- var _this$getClassNames6 = this.getClassNames(type), className = _this$getClassNames6.className, activeClassName = _this$getClassNames6.activeClassName, doneClassName = _this$getClassNames6.doneClassName;
657
- className && removeClass$1(node, className);
658
- activeClassName && removeClass$1(node, activeClassName);
659
- doneClassName && removeClass$1(node, doneClassName);
660
- };
661
- _proto.reflowAndAddClass = function reflowAndAddClass(node, className) {
662
- if (className) {
663
- node && node.scrollTop;
664
- addClass$1(node, className);
665
- }
666
- };
667
- _proto.render = function render() {
668
- var props = _extends({}, this.props);
669
- delete props.classNames;
670
- return _react.default.createElement(_Transition.default, _extends({}, props, {
671
- onEnter: this.onEnter,
672
- onEntered: this.onEntered,
673
- onEntering: this.onEntering,
674
- onExit: this.onExit,
675
- onExiting: this.onExiting,
676
- onExited: this.onExited
677
- }));
678
- };
679
- return CSSTransition;
680
- })(_react.default.Component);
681
- CSSTransition.defaultProps = {
682
- classNames: ''
683
- };
684
- CSSTransition.propTypes = _extends({}, _Transition.default.propTypes, {
685
- classNames: _PropTypes.classNamesShape,
686
- onEnter: PropTypes.func,
687
- onEntering: PropTypes.func,
688
- onEntered: PropTypes.func,
689
- onExit: PropTypes.func,
690
- onExiting: PropTypes.func,
691
- onExited: PropTypes.func
692
- });
693
- var _default = CSSTransition;
694
- exports.default = _default;
695
- module.exports = exports["default"];
696
- })(CSSTransition, CSSTransition.exports);
697
- getDefaultExportFromCjs(CSSTransition.exports);
698
- var ReplaceTransition = {
699
- exports: {}
700
- };
701
- var TransitionGroup = {
702
- exports: {}
703
- };
704
- var ChildMapping = {};
705
- const require$$0$2 = _dll_react;
706
- ChildMapping.__esModule = true;
707
- ChildMapping.getChildMapping = getChildMapping;
708
- ChildMapping.mergeChildMappings = mergeChildMappings;
709
- ChildMapping.getInitialChildMapping = getInitialChildMapping;
710
- ChildMapping.getNextChildMapping = getNextChildMapping;
711
- var _react = require$$0$2;
712
- function getChildMapping(children, mapFn) {
713
- var mapper = function mapper(child) {
714
- return mapFn && (0, _react.isValidElement)(child) ? mapFn(child) : child;
715
- };
716
- var result = Object.create(null);
717
- if (children) _react.Children.map(children, function (c) {
718
- return c;
719
- }).forEach(function (child) {
720
- result[child.key] = mapper(child);
721
- });
722
- return result;
723
- }
724
- function mergeChildMappings(prev, next) {
725
- prev = prev || ({});
726
- next = next || ({});
727
- function getValueForKey(key) {
728
- return (key in next) ? next[key] : prev[key];
729
- }
730
- var nextKeysPending = Object.create(null);
731
- var pendingKeys = [];
732
- for (var prevKey in prev) {
733
- if ((prevKey in next)) {
734
- if (pendingKeys.length) {
735
- nextKeysPending[prevKey] = pendingKeys;
736
- pendingKeys = [];
737
- }
738
- } else {
739
- pendingKeys.push(prevKey);
740
- }
741
- }
742
- var i;
743
- var childMapping = {};
744
- for (var nextKey in next) {
745
- if (nextKeysPending[nextKey]) {
746
- for (i = 0; i < nextKeysPending[nextKey].length; i++) {
747
- var pendingNextKey = nextKeysPending[nextKey][i];
748
- childMapping[nextKeysPending[nextKey][i]] = getValueForKey(pendingNextKey);
749
- }
750
- }
751
- childMapping[nextKey] = getValueForKey(nextKey);
752
- }
753
- for (i = 0; i < pendingKeys.length; i++) {
754
- childMapping[pendingKeys[i]] = getValueForKey(pendingKeys[i]);
755
- }
756
- return childMapping;
757
- }
758
- function getProp(child, prop, props) {
759
- return props[prop] != null ? props[prop] : child.props[prop];
760
- }
761
- function getInitialChildMapping(props, onExited) {
762
- return getChildMapping(props.children, function (child) {
763
- return (0, _react.cloneElement)(child, {
764
- onExited: onExited.bind(null, child),
765
- in: true,
766
- appear: getProp(child, 'appear', props),
767
- enter: getProp(child, 'enter', props),
768
- exit: getProp(child, 'exit', props)
769
- });
770
- });
771
- }
772
- function getNextChildMapping(nextProps, prevChildMapping, onExited) {
773
- var nextChildMapping = getChildMapping(nextProps.children);
774
- var children = mergeChildMappings(prevChildMapping, nextChildMapping);
775
- Object.keys(children).forEach(function (key) {
776
- var child = children[key];
777
- if (!(0, _react.isValidElement)(child)) return;
778
- var hasPrev = (key in prevChildMapping);
779
- var hasNext = (key in nextChildMapping);
780
- var prevChild = prevChildMapping[key];
781
- var isLeaving = (0, _react.isValidElement)(prevChild) && !prevChild.props.in;
782
- if (hasNext && (!hasPrev || isLeaving)) {
783
- children[key] = (0, _react.cloneElement)(child, {
784
- onExited: onExited.bind(null, child),
785
- in: true,
786
- exit: getProp(child, 'exit', nextProps),
787
- enter: getProp(child, 'enter', nextProps)
788
- });
789
- } else if (!hasNext && hasPrev && !isLeaving) {
790
- children[key] = (0, _react.cloneElement)(child, {
791
- in: false
792
- });
793
- } else if (hasNext && hasPrev && (0, _react.isValidElement)(prevChild)) {
794
- children[key] = (0, _react.cloneElement)(child, {
795
- onExited: onExited.bind(null, child),
796
- in: prevChild.props.in,
797
- exit: getProp(child, 'exit', nextProps),
798
- enter: getProp(child, 'enter', nextProps)
799
- });
800
- }
801
- });
802
- return children;
803
- }
804
- const require$$0$1 = _dll_prop_types;
805
- const require$$1$1 = _dll_react;
806
- (function (module, exports) {
807
- exports.__esModule = true;
808
- exports.default = void 0;
809
- var _propTypes = _interopRequireDefault(require$$0$1);
810
- var _react = _interopRequireDefault(require$$1$1);
811
- var _reactLifecyclesCompat = require$$2$2;
812
- var _ChildMapping = ChildMapping;
813
- function _interopRequireDefault(obj) {
814
- return obj && obj.__esModule ? obj : {
815
- default: obj
816
- };
817
- }
818
- function _objectWithoutPropertiesLoose(source, excluded) {
819
- if (source == null) return {};
820
- var target = {};
821
- var sourceKeys = Object.keys(source);
822
- var key, i;
823
- for (i = 0; i < sourceKeys.length; i++) {
824
- key = sourceKeys[i];
825
- if (excluded.indexOf(key) >= 0) continue;
826
- target[key] = source[key];
827
- }
828
- return target;
829
- }
830
- function _extends() {
831
- _extends = Object.assign || (function (target) {
832
- for (var i = 1; i < arguments.length; i++) {
833
- var source = arguments[i];
834
- for (var key in source) {
835
- if (Object.prototype.hasOwnProperty.call(source, key)) {
836
- target[key] = source[key];
837
- }
838
- }
839
- }
840
- return target;
841
- });
842
- return _extends.apply(this, arguments);
843
- }
844
- function _inheritsLoose(subClass, superClass) {
845
- subClass.prototype = Object.create(superClass.prototype);
846
- subClass.prototype.constructor = subClass;
847
- subClass.__proto__ = superClass;
848
- }
849
- function _assertThisInitialized(self) {
850
- if (self === void 0) {
851
- throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
852
- }
853
- return self;
854
- }
855
- var values = Object.values || (function (obj) {
856
- return Object.keys(obj).map(function (k) {
857
- return obj[k];
858
- });
859
- });
860
- var defaultProps = {
861
- component: 'div',
862
- childFactory: function childFactory(child) {
863
- return child;
864
- }
865
- };
866
- var TransitionGroup = (function (_React$Component) {
867
- _inheritsLoose(TransitionGroup, _React$Component);
868
- function TransitionGroup(props, context) {
869
- var _this;
870
- _this = _React$Component.call(this, props, context) || this;
871
- var handleExited = _this.handleExited.bind(_assertThisInitialized(_assertThisInitialized(_this)));
872
- _this.state = {
873
- handleExited: handleExited,
874
- firstRender: true
875
- };
876
- return _this;
877
- }
878
- var _proto = TransitionGroup.prototype;
879
- _proto.getChildContext = function getChildContext() {
880
- return {
881
- transitionGroup: {
882
- isMounting: !this.appeared
883
- }
884
- };
885
- };
886
- _proto.componentDidMount = function componentDidMount() {
887
- this.appeared = true;
888
- this.mounted = true;
889
- };
890
- _proto.componentWillUnmount = function componentWillUnmount() {
891
- this.mounted = false;
892
- };
893
- TransitionGroup.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, _ref) {
894
- var prevChildMapping = _ref.children, handleExited = _ref.handleExited, firstRender = _ref.firstRender;
895
- return {
896
- children: firstRender ? (0, _ChildMapping.getInitialChildMapping)(nextProps, handleExited) : (0, _ChildMapping.getNextChildMapping)(nextProps, prevChildMapping, handleExited),
897
- firstRender: false
898
- };
899
- };
900
- _proto.handleExited = function handleExited(child, node) {
901
- var currentChildMapping = (0, _ChildMapping.getChildMapping)(this.props.children);
902
- if ((child.key in currentChildMapping)) return;
903
- if (child.props.onExited) {
904
- child.props.onExited(node);
905
- }
906
- if (this.mounted) {
907
- this.setState(function (state) {
908
- var children = _extends({}, state.children);
909
- delete children[child.key];
910
- return {
911
- children: children
912
- };
913
- });
914
- }
915
- };
916
- _proto.render = function render() {
917
- var _this$props = this.props, Component = _this$props.component, childFactory = _this$props.childFactory, props = _objectWithoutPropertiesLoose(_this$props, ["component", "childFactory"]);
918
- var children = values(this.state.children).map(childFactory);
919
- delete props.appear;
920
- delete props.enter;
921
- delete props.exit;
922
- if (Component === null) {
923
- return children;
924
- }
925
- return _react.default.createElement(Component, props, children);
926
- };
927
- return TransitionGroup;
928
- })(_react.default.Component);
929
- TransitionGroup.childContextTypes = {
930
- transitionGroup: _propTypes.default.object.isRequired
931
- };
932
- TransitionGroup.propTypes = {
933
- component: _propTypes.default.any,
934
- children: _propTypes.default.node,
935
- appear: _propTypes.default.bool,
936
- enter: _propTypes.default.bool,
937
- exit: _propTypes.default.bool,
938
- childFactory: _propTypes.default.func
939
- };
940
- TransitionGroup.defaultProps = defaultProps;
941
- var _default = (0, _reactLifecyclesCompat.polyfill)(TransitionGroup);
942
- exports.default = _default;
943
- module.exports = exports["default"];
944
- })(TransitionGroup, TransitionGroup.exports);
945
- getDefaultExportFromCjs(TransitionGroup.exports);
946
- const require$$0 = _dll_prop_types;
947
- const require$$1 = _dll_react;
948
- const require$$2 = _dll_react_dom;
949
- (function (module, exports) {
950
- exports.__esModule = true;
951
- exports.default = void 0;
952
- var _propTypes = _interopRequireDefault(require$$0);
953
- var _react = _interopRequireDefault(require$$1);
954
- var _reactDom = require$$2;
955
- var _TransitionGroup = _interopRequireDefault(TransitionGroup.exports);
956
- function _interopRequireDefault(obj) {
957
- return obj && obj.__esModule ? obj : {
958
- default: obj
959
- };
960
- }
961
- function _objectWithoutPropertiesLoose(source, excluded) {
962
- if (source == null) return {};
963
- var target = {};
964
- var sourceKeys = Object.keys(source);
965
- var key, i;
966
- for (i = 0; i < sourceKeys.length; i++) {
967
- key = sourceKeys[i];
968
- if (excluded.indexOf(key) >= 0) continue;
969
- target[key] = source[key];
970
- }
971
- return target;
972
- }
973
- function _inheritsLoose(subClass, superClass) {
974
- subClass.prototype = Object.create(superClass.prototype);
975
- subClass.prototype.constructor = subClass;
976
- subClass.__proto__ = superClass;
977
- }
978
- var ReplaceTransition = (function (_React$Component) {
979
- _inheritsLoose(ReplaceTransition, _React$Component);
980
- function ReplaceTransition() {
981
- var _this;
982
- for (var _len = arguments.length, _args = new Array(_len), _key = 0; _key < _len; _key++) {
983
- _args[_key] = arguments[_key];
984
- }
985
- _this = _React$Component.call.apply(_React$Component, [this].concat(_args)) || this;
986
- _this.handleEnter = function () {
987
- for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
988
- args[_key2] = arguments[_key2];
989
- }
990
- return _this.handleLifecycle('onEnter', 0, args);
991
- };
992
- _this.handleEntering = function () {
993
- for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
994
- args[_key3] = arguments[_key3];
995
- }
996
- return _this.handleLifecycle('onEntering', 0, args);
997
- };
998
- _this.handleEntered = function () {
999
- for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
1000
- args[_key4] = arguments[_key4];
1001
- }
1002
- return _this.handleLifecycle('onEntered', 0, args);
1003
- };
1004
- _this.handleExit = function () {
1005
- for (var _len5 = arguments.length, args = new Array(_len5), _key5 = 0; _key5 < _len5; _key5++) {
1006
- args[_key5] = arguments[_key5];
1007
- }
1008
- return _this.handleLifecycle('onExit', 1, args);
1009
- };
1010
- _this.handleExiting = function () {
1011
- for (var _len6 = arguments.length, args = new Array(_len6), _key6 = 0; _key6 < _len6; _key6++) {
1012
- args[_key6] = arguments[_key6];
1013
- }
1014
- return _this.handleLifecycle('onExiting', 1, args);
1015
- };
1016
- _this.handleExited = function () {
1017
- for (var _len7 = arguments.length, args = new Array(_len7), _key7 = 0; _key7 < _len7; _key7++) {
1018
- args[_key7] = arguments[_key7];
1019
- }
1020
- return _this.handleLifecycle('onExited', 1, args);
1021
- };
1022
- return _this;
1023
- }
1024
- var _proto = ReplaceTransition.prototype;
1025
- _proto.handleLifecycle = function handleLifecycle(handler, idx, originalArgs) {
1026
- var _child$props;
1027
- var children = this.props.children;
1028
- var child = _react.default.Children.toArray(children)[idx];
1029
- if (child.props[handler]) (_child$props = child.props)[handler].apply(_child$props, originalArgs);
1030
- if (this.props[handler]) this.props[handler]((0, _reactDom.findDOMNode)(this));
1031
- };
1032
- _proto.render = function render() {
1033
- var _this$props = this.props, children = _this$props.children, inProp = _this$props.in, props = _objectWithoutPropertiesLoose(_this$props, ["children", "in"]);
1034
- var _React$Children$toArr = _react.default.Children.toArray(children), first = _React$Children$toArr[0], second = _React$Children$toArr[1];
1035
- delete props.onEnter;
1036
- delete props.onEntering;
1037
- delete props.onEntered;
1038
- delete props.onExit;
1039
- delete props.onExiting;
1040
- delete props.onExited;
1041
- return _react.default.createElement(_TransitionGroup.default, props, inProp ? _react.default.cloneElement(first, {
1042
- key: 'first',
1043
- onEnter: this.handleEnter,
1044
- onEntering: this.handleEntering,
1045
- onEntered: this.handleEntered
1046
- }) : _react.default.cloneElement(second, {
1047
- key: 'second',
1048
- onEnter: this.handleExit,
1049
- onEntering: this.handleExiting,
1050
- onEntered: this.handleExited
1051
- }));
1052
- };
1053
- return ReplaceTransition;
1054
- })(_react.default.Component);
1055
- ReplaceTransition.propTypes = {
1056
- in: _propTypes.default.bool.isRequired,
1057
- children: function children(props, propName) {
1058
- if (_react.default.Children.count(props[propName]) !== 2) return new Error("\"" + propName + "\" must be exactly two transition components.");
1059
- return null;
1060
- }
1061
- };
1062
- var _default = ReplaceTransition;
1063
- exports.default = _default;
1064
- module.exports = exports["default"];
1065
- })(ReplaceTransition, ReplaceTransition.exports);
1066
- getDefaultExportFromCjs(ReplaceTransition.exports);
1067
- var _CSSTransition = _interopRequireDefault(CSSTransition.exports);
1068
- var _ReplaceTransition = _interopRequireDefault(ReplaceTransition.exports);
1069
- var _TransitionGroup = _interopRequireDefault(TransitionGroup.exports);
1070
- var _Transition = _interopRequireDefault(Transition$1);
1071
- function _interopRequireDefault(obj) {
1072
- return obj && obj.__esModule ? obj : {
1073
- default: obj
1074
- };
1075
- }
1076
- var reactTransitionGroup = {
1077
- Transition: _Transition.default,
1078
- TransitionGroup: _TransitionGroup.default,
1079
- ReplaceTransition: _ReplaceTransition.default,
1080
- CSSTransition: _CSSTransition.default
1081
- };
1082
- const React$5 = _dll_react;
1083
- const {withStyles: withStyles$4} = _dll_material_ui__core_styles;
1084
- const PropTypes$4 = _dll_prop_types;
1085
- const {color: color$2} = _dll_pie_lib__render_ui;
1086
- const _jsxFileName$4 = "/home/circleci/repo/packages/multiple-choice/src/feedback-tick.jsx";
1087
- const stylesheet = {
1088
- incorrect: {
1089
- fill: `var(--feedback-incorrect-bg-color, ${color$2.incorrect()})`
1090
- },
1091
- correct: {
1092
- fill: `var(--feedback-correct-bg-color, ${color$2.correct()})`
1093
- },
1094
- feedbackTick: {
1095
- width: '33px',
1096
- height: '33px',
1097
- '& svg': {
1098
- position: 'absolute',
1099
- display: 'inline-block',
1100
- width: '33px',
1101
- height: '33px',
1102
- verticalAlign: 'middle',
1103
- '& hide': {
1104
- display: 'none'
1105
- }
1106
- }
1107
- },
1108
- feedbackTickEnter: {
1109
- opacity: '0',
1110
- left: '-50px'
1111
- },
1112
- feedbackTickEnterActive: {
1113
- opacity: '1',
1114
- left: '0px',
1115
- transition: 'left 500ms ease-in 200ms, opacity 500ms linear 200ms'
1116
- },
1117
- feedbackTickLeave: {
1118
- opacity: '1',
1119
- left: '0px'
1120
- },
1121
- feedbackTickLeaveActive: {
1122
- opacity: '0',
1123
- left: '-50px',
1124
- transition: 'left 300ms ease-in, opacity 300ms'
1125
- }
1126
- };
1127
- class FeedbackTick extends React$5.Component {
1128
- static __initStatic() {
1129
- this.propTypes = {
1130
- classes: PropTypes$4.object.isRequired,
1131
- correctness: PropTypes$4.string
1132
- };
1133
- }
1134
- constructor(props) {
1135
- super(props);
1136
- this.incorrectIcon = React$5.createElement('svg', {
1137
- key: "1",
1138
- preserveAspectRatio: "xMinYMin meet",
1139
- x: "0px",
1140
- y: "0px",
1141
- viewBox: "0 0 44 40",
1142
- style: {
1143
- enableBackground: 'new 0 0 44 40'
1144
- },
1145
- __self: this,
1146
- __source: {
1147
- fileName: _jsxFileName$4,
1148
- lineNumber: 56
1149
- }
1150
- }, React$5.createElement('g', {
1151
- __self: this,
1152
- __source: {
1153
- fileName: _jsxFileName$4,
1154
- lineNumber: 64
1155
- }
1156
- }, React$5.createElement('rect', {
1157
- x: "11",
1158
- y: "17.3",
1159
- transform: "matrix(0.7071 -0.7071 0.7071 0.7071 -7.852 19.2507)",
1160
- className: this.props.classes.incorrect,
1161
- width: "16.6",
1162
- height: "3.7",
1163
- __self: this,
1164
- __source: {
1165
- fileName: _jsxFileName$4,
1166
- lineNumber: 65
1167
- }
1168
- }), React$5.createElement('rect', {
1169
- x: "17.4",
1170
- y: "10.7",
1171
- transform: "matrix(0.7071 -0.7071 0.7071 0.7071 -7.8175 19.209)",
1172
- className: this.props.classes.incorrect,
1173
- width: "3.7",
1174
- height: "16.6",
1175
- __self: this,
1176
- __source: {
1177
- fileName: _jsxFileName$4,
1178
- lineNumber: 73
1179
- }
1180
- })));
1181
- this.correctIcon = React$5.createElement('svg', {
1182
- key: "2",
1183
- preserveAspectRatio: "xMinYMin meet",
1184
- version: "1.1",
1185
- x: "0px",
1186
- y: "0px",
1187
- viewBox: "0 0 44 40",
1188
- style: {
1189
- enableBackground: 'new 0 0 44 40'
1190
- },
1191
- __self: this,
1192
- __source: {
1193
- fileName: _jsxFileName$4,
1194
- lineNumber: 86
1195
- }
1196
- }, React$5.createElement('polygon', {
1197
- className: this.props.classes.correct,
1198
- 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",
1199
- __self: this,
1200
- __source: {
1201
- fileName: _jsxFileName$4,
1202
- lineNumber: 95
1203
- }
1204
- }));
1205
- }
1206
- render() {
1207
- const {correctness, classes} = this.props;
1208
- const icon = (() => {
1209
- if (correctness === 'incorrect') {
1210
- return this.incorrectIcon;
1211
- } else if (correctness === 'correct') {
1212
- return this.correctIcon;
1213
- }
1214
- })();
1215
- return React$5.createElement('div', {
1216
- className: classes.feedbackTick,
1217
- __self: this,
1218
- __source: {
1219
- fileName: _jsxFileName$4,
1220
- lineNumber: 115
1221
- }
1222
- }, React$5.createElement(reactTransitionGroup.TransitionGroup, {
1223
- __self: this,
1224
- __source: {
1225
- fileName: _jsxFileName$4,
1226
- lineNumber: 116
1227
- }
1228
- }, correctness && React$5.createElement(reactTransitionGroup.CSSTransition, {
1229
- classNames: {
1230
- enter: classes.feedbackTickEnter,
1231
- enterActive: classes.feedbackTickEnterActive,
1232
- exit: classes.feedbackTickLeave,
1233
- exitActive: classes.feedbackTickLeaveActive
1234
- },
1235
- timeout: {
1236
- enter: 700,
1237
- exit: 300
1238
- },
1239
- __self: this,
1240
- __source: {
1241
- fileName: _jsxFileName$4,
1242
- lineNumber: 118
1243
- }
1244
- }, icon)));
1245
- }
1246
- }
1247
- FeedbackTick.__initStatic();
1248
- var FeedbackTick$1 = withStyles$4(stylesheet, {
1249
- name: 'FeedbackTick'
1250
- })(FeedbackTick);
1251
- const {FormControlLabel: FormControlLabel} = _dll_material_ui__core;
1252
- const {Checkbox: Checkbox} = _dll_material_ui__core;
1253
- const {Radio: Radio} = _dll_material_ui__core;
1254
- const React$4 = _dll_react;
1255
- const PropTypes$3 = _dll_prop_types;
1256
- const {withStyles: withStyles$3} = _dll_material_ui__core_styles;
1257
- const {Feedback: Feedback} = _dll_pie_lib__render_ui;
1258
- const {color: color$1} = _dll_pie_lib__render_ui;
1259
- const {PreviewPrompt: PreviewPrompt$1} = _dll_pie_lib__render_ui;
1260
- const classNames$3 = _dll_classnames;
1261
- const _jsxFileName$3 = "/home/circleci/repo/packages/multiple-choice/src/choice-input.jsx";
1262
- const CLASS_NAME = 'multiple-choice-component';
1263
- const styleSheet = () => ({
1264
- row: {
1265
- display: 'flex',
1266
- alignItems: 'center',
1267
- backgroundColor: color$1.background()
1268
- },
1269
- checkboxHolder: {
1270
- display: 'flex',
1271
- alignItems: 'center',
1272
- backgroundColor: color$1.background(),
1273
- flex: 1,
1274
- '& label': {
1275
- color: color$1.text()
1276
- }
1277
- },
1278
- horizontalLayout: {
1279
- [`& .${CLASS_NAME}`]: {
1280
- paddingRight: '8px'
1281
- }
1282
- }
1283
- });
1284
- const formStyleSheet = {
1285
- label: {
1286
- color: `${color$1.text()} !important`,
1287
- backgroundColor: color$1.background()
1288
- }
1289
- };
1290
- const StyledFormControlLabel = withStyles$3(formStyleSheet, {
1291
- name: 'FormControlLabel'
1292
- })(props => React$4.createElement(FormControlLabel, {
1293
- ...props,
1294
- classes: {
1295
- label: props.classes.label
1296
- },
1297
- __self: undefined,
1298
- __source: {
1299
- fileName: _jsxFileName$3,
1300
- lineNumber: 46
1301
- }
1302
- }));
1303
- const colorStyle = (varName, fallback) => ({
1304
- [`&.${CLASS_NAME}`]: {
1305
- color: `var(--choice-input-${varName}, ${fallback}) !important`
1306
- }
1307
- });
1308
- const inputStyles = {
1309
- 'correct-root': colorStyle('correct-color', color$1.text()),
1310
- 'correct-checked': colorStyle('correct-selected-color', color$1.correct()),
1311
- 'correct-disabled': colorStyle('correct-disabled-color', color$1.disabled()),
1312
- 'incorrect-root': colorStyle('incorrect-color', color$1.incorrect()),
1313
- 'incorrect-checked': colorStyle('incorrect-checked', color$1.incorrect()),
1314
- 'incorrect-disabled': colorStyle('incorrect-disabled-color', color$1.disabled()),
1315
- root: {
1316
- ...colorStyle('color', color$1.text()),
1317
- '&:hover': {
1318
- color: `${color$1.primaryLight()} !important`
1319
- }
1320
- },
1321
- checked: colorStyle('selected-color', color$1.primary()),
1322
- disabled: {
1323
- ...colorStyle('disabled-color', color$1.text()),
1324
- opacity: 0.6,
1325
- cursor: 'not-allowed !important',
1326
- pointerEvents: 'initial !important'
1327
- }
1328
- };
1329
- const StyledCheckbox = withStyles$3(inputStyles)(props => {
1330
- const {correctness, classes, checked, onChange, disabled, accessibility} = props;
1331
- const key = k => correctness ? `${correctness}-${k}` : k;
1332
- const resolved = {
1333
- root: classes[key('root')],
1334
- checked: classes[key('checked')],
1335
- disabled: classes[key('disabled')]
1336
- };
1337
- const miniProps = {
1338
- checked,
1339
- onChange,
1340
- disabled
1341
- };
1342
- return React$4.createElement(Checkbox, {
1343
- 'aria-label': accessibility,
1344
- ...miniProps,
1345
- className: CLASS_NAME,
1346
- classes: {
1347
- root: resolved.root,
1348
- checked: resolved.checked,
1349
- disabled: `${correctness ? '' : resolved.disabled}`
1350
- },
1351
- __self: undefined,
1352
- __source: {
1353
- fileName: _jsxFileName$3,
1354
- lineNumber: 97
1355
- }
1356
- });
1357
- });
1358
- const StyledRadio = withStyles$3(inputStyles)(props => {
1359
- const {correctness, classes, checked, onChange, disabled, accessibility} = props;
1360
- const key = k => correctness ? `${correctness}-${k}` : k;
1361
- const resolved = {
1362
- root: classes[key('root')],
1363
- checked: classes[key('checked')],
1364
- disabled: classes[key('disabled')]
1365
- };
1366
- const miniProps = {
1367
- checked,
1368
- onChange,
1369
- disabled
1370
- };
1371
- return React$4.createElement(Radio, {
1372
- 'aria-label': accessibility,
1373
- ...miniProps,
1374
- className: CLASS_NAME,
1375
- classes: {
1376
- root: resolved.root,
1377
- checked: resolved.checked,
1378
- disabled: `${correctness ? '' : resolved.disabled}`
1379
- },
1380
- __self: undefined,
1381
- __source: {
1382
- fileName: _jsxFileName$3,
1383
- lineNumber: 130
1384
- }
1385
- });
1386
- });
1387
- class ChoiceInput extends React$4.Component {
1388
- static __initStatic() {
1389
- this.propTypes = {
1390
- choiceMode: PropTypes$3.oneOf(['radio', 'checkbox']),
1391
- displayKey: PropTypes$3.string.isRequired,
1392
- checked: PropTypes$3.bool.isRequired,
1393
- correctness: PropTypes$3.string,
1394
- disabled: PropTypes$3.bool.isRequired,
1395
- feedback: PropTypes$3.string,
1396
- label: PropTypes$3.string.isRequired,
1397
- rationale: PropTypes$3.string,
1398
- accessibility: PropTypes$3.string,
1399
- onChange: PropTypes$3.func.isRequired,
1400
- value: PropTypes$3.string.isRequired,
1401
- classes: PropTypes$3.object,
1402
- className: PropTypes$3.string,
1403
- hideTick: PropTypes$3.bool,
1404
- isEvaluateMode: PropTypes$3.bool,
1405
- choicesLayout: PropTypes$3.oneOf(['vertical', 'grid', 'horizontal'])
1406
- };
1407
- }
1408
- static __initStatic2() {
1409
- this.defaultProps = {
1410
- rationale: null,
1411
- accessibility: null,
1412
- checked: false,
1413
- isEvaluateMode: false
1414
- };
1415
- }
1416
- constructor(props) {
1417
- super(props);
1418
- this.onToggleChoice = this.onToggleChoice.bind(this);
1419
- }
1420
- onToggleChoice() {
1421
- this.props.onChange({
1422
- value: this.props.value,
1423
- selected: !this.props.checked
1424
- });
1425
- }
1426
- render() {
1427
- const {choiceMode, disabled, displayKey, feedback, label, checked, correctness, classes, className, rationale, accessibility, hideTick, isEvaluateMode, choicesLayout} = this.props;
1428
- const Tag = choiceMode === 'checkbox' ? StyledCheckbox : StyledRadio;
1429
- const classSuffix = choiceMode === 'checkbox' ? 'checkbox' : 'radio-button';
1430
- const holderClassNames = classNames$3(classes.checkboxHolder, {
1431
- [classes.horizontalLayout]: choicesLayout === 'horizontal'
1432
- });
1433
- return React$4.createElement('div', {
1434
- className: classNames$3(className, 'corespring-' + classSuffix, 'choice-input'),
1435
- __self: this,
1436
- __source: {
1437
- fileName: _jsxFileName$3,
1438
- lineNumber: 208
1439
- }
1440
- }, React$4.createElement('div', {
1441
- className: classes.row,
1442
- __self: this,
1443
- __source: {
1444
- fileName: _jsxFileName$3,
1445
- lineNumber: 209
1446
- }
1447
- }, !hideTick && isEvaluateMode && React$4.createElement(FeedbackTick$1, {
1448
- correctness: correctness,
1449
- __self: this,
1450
- __source: {
1451
- fileName: _jsxFileName$3,
1452
- lineNumber: 210
1453
- }
1454
- }), React$4.createElement('div', {
1455
- className: classNames$3(holderClassNames, 'checkbox-holder'),
1456
- __self: this,
1457
- __source: {
1458
- fileName: _jsxFileName$3,
1459
- lineNumber: 211
1460
- }
1461
- }, React$4.createElement(StyledFormControlLabel, {
1462
- disabled: disabled,
1463
- label: displayKey ? displayKey + '. ' : '',
1464
- control: React$4.createElement(Tag, {
1465
- accessibility: accessibility,
1466
- checked: checked,
1467
- correctness: correctness,
1468
- onChange: this.onToggleChoice,
1469
- __self: this,
1470
- __source: {
1471
- fileName: _jsxFileName$3,
1472
- lineNumber: 216
1473
- }
1474
- }),
1475
- __self: this,
1476
- __source: {
1477
- fileName: _jsxFileName$3,
1478
- lineNumber: 212
1479
- }
1480
- }), React$4.createElement(PreviewPrompt$1, {
1481
- className: "label",
1482
- onClick: this.onToggleChoice,
1483
- prompt: label,
1484
- tagName: "span",
1485
- __self: this,
1486
- __source: {
1487
- fileName: _jsxFileName$3,
1488
- lineNumber: 224
1489
- }
1490
- }))), rationale && React$4.createElement(PreviewPrompt$1, {
1491
- className: "rationale",
1492
- defaultClassName: "rationale",
1493
- prompt: rationale,
1494
- __self: this,
1495
- __source: {
1496
- fileName: _jsxFileName$3,
1497
- lineNumber: 233
1498
- }
1499
- }), React$4.createElement(Feedback, {
1500
- feedback: feedback,
1501
- correctness: correctness,
1502
- __self: this,
1503
- __source: {
1504
- fileName: _jsxFileName$3,
1505
- lineNumber: 235
1506
- }
1507
- }));
1508
- }
1509
- }
1510
- ChoiceInput.__initStatic();
1511
- ChoiceInput.__initStatic2();
1512
- var ChoiceInput$1 = withStyles$3(styleSheet)(ChoiceInput);
1513
- const React$3 = _dll_react;
1514
- const PropTypes$2 = _dll_prop_types;
1515
- const {withStyles: withStyles$2} = _dll_material_ui__core_styles;
1516
- const classNames$2 = _dll_classnames;
1517
- const _jsxFileName$2 = "/home/circleci/repo/packages/multiple-choice/src/choice.jsx";
1518
- class Choice extends React$3.Component {
1519
- constructor(...args) {
1520
- super(...args);
1521
- Choice.prototype.__init.call(this);
1522
- }
1523
- __init() {
1524
- this.onChange = choice => {
1525
- const {disabled, onChoiceChanged} = this.props;
1526
- if (!disabled) {
1527
- onChoiceChanged(choice);
1528
- }
1529
- };
1530
- }
1531
- render() {
1532
- const {choice, index, choicesLength, showCorrect, isEvaluateMode, choiceMode, disabled, checked, correctness, displayKey, classes, choicesLayout, gridColumns} = this.props;
1533
- const choiceClass = 'choice' + (index === choicesLength - 1 ? ' last' : '');
1534
- const feedback = !isEvaluateMode || showCorrect ? '' : choice.feedback;
1535
- const choiceProps = {
1536
- ...choice,
1537
- checked,
1538
- choiceMode,
1539
- disabled,
1540
- feedback,
1541
- correctness,
1542
- displayKey,
1543
- choicesLayout,
1544
- gridColumns,
1545
- onChange: this.onChange,
1546
- isEvaluateMode
1547
- };
1548
- const names = classNames$2(classes.choice, {
1549
- [classes.noBorder]: index === choicesLength - 1 || choicesLayout !== 'vertical',
1550
- [classes.horizontalLayout]: choicesLayout === 'horizontal'
1551
- });
1552
- return React$3.createElement('div', {
1553
- className: choiceClass,
1554
- key: index,
1555
- __self: this,
1556
- __source: {
1557
- fileName: _jsxFileName$2,
1558
- lineNumber: 57
1559
- }
1560
- }, React$3.createElement(ChoiceInput$1, {
1561
- ...choiceProps,
1562
- className: names,
1563
- __self: this,
1564
- __source: {
1565
- fileName: _jsxFileName$2,
1566
- lineNumber: 58
1567
- }
1568
- }));
1569
- }
1570
- }
1571
- Choice.propTypes = {
1572
- choiceMode: PropTypes$2.oneOf(['radio', 'checkbox']),
1573
- choice: PropTypes$2.object,
1574
- disabled: PropTypes$2.bool.isRequired,
1575
- onChoiceChanged: PropTypes$2.func,
1576
- classes: PropTypes$2.object.isRequired,
1577
- index: PropTypes$2.number,
1578
- choicesLength: PropTypes$2.number,
1579
- showCorrect: PropTypes$2.bool,
1580
- isEvaluateMode: PropTypes$2.bool,
1581
- checked: PropTypes$2.bool,
1582
- correctness: PropTypes$2.string,
1583
- displayKey: PropTypes$2.string,
1584
- choicesLayout: PropTypes$2.oneOf(['vertical', 'grid', 'horizontal']),
1585
- gridColumns: PropTypes$2.string
1586
- };
1587
- var StyledChoice = withStyles$2({
1588
- choice: {
1589
- paddingTop: '20px',
1590
- paddingBottom: '10px',
1591
- borderBottom: '1px solid #E0DEE0'
1592
- },
1593
- noBorder: {
1594
- borderBottom: 'none'
1595
- },
1596
- horizontalLayout: {
1597
- paddingRight: '20px',
1598
- '& label': {
1599
- marginRight: '8px'
1600
- }
1601
- }
1602
- })(Choice);
1603
- const React$2 = _dll_react;
1604
- const PropTypes$1 = _dll_prop_types;
1605
- const CorrectAnswerToggle = _dll_pie_lib__correct_answer_toggle;
1606
- const classNames$1 = _dll_classnames;
1607
- const {withStyles: withStyles$1} = _dll_material_ui__core_styles;
1608
- const {color: color} = _dll_pie_lib__render_ui;
1609
- const {Collapsible: Collapsible} = _dll_pie_lib__render_ui;
1610
- const {PreviewPrompt: PreviewPrompt} = _dll_pie_lib__render_ui;
1611
- const _jsxFileName$1 = "/home/circleci/repo/packages/multiple-choice/src/multiple-choice.jsx";
1612
- const styles = {
1613
- corespringChoice: {
1614
- backgroundColor: color.background(),
1615
- padding: '5px',
1616
- '& *': {
1617
- '-webkit-font-smoothing': 'antialiased'
1618
- }
1619
- },
1620
- horizontalLayout: {
1621
- display: 'flex',
1622
- flexDirection: 'row',
1623
- flexWrap: 'wrap'
1624
- },
1625
- gridLayout: {
1626
- display: 'grid'
1627
- },
1628
- getColumns: function (columns) {
1629
- return columns > 1 ? {
1630
- gridTemplateColumns: `repeat(${columns}, 1fr)`
1631
- } : undefined;
1632
- }
1633
- };
1634
- class MultipleChoice$1 extends React$2.Component {
1635
- static __initStatic() {
1636
- this.propTypes = {
1637
- mode: PropTypes$1.oneOf(['gather', 'view', 'evaluate']),
1638
- choiceMode: PropTypes$1.oneOf(['radio', 'checkbox']),
1639
- keyMode: PropTypes$1.oneOf(['numbers', 'letters', 'none']),
1640
- choices: PropTypes$1.array,
1641
- prompt: PropTypes$1.string,
1642
- teacherInstructions: PropTypes$1.string,
1643
- session: PropTypes$1.object,
1644
- disabled: PropTypes$1.bool,
1645
- onChoiceChanged: PropTypes$1.func,
1646
- responseCorrect: PropTypes$1.bool,
1647
- classes: PropTypes$1.object.isRequired,
1648
- correctResponse: PropTypes$1.array,
1649
- choicesLayout: PropTypes$1.oneOf(['vertical', 'grid', 'horizontal']),
1650
- gridColumns: PropTypes$1.string,
1651
- alwaysShowCorrect: PropTypes$1.bool,
1652
- animationsDisabled: PropTypes$1.bool
1653
- };
1654
- }
1655
- constructor(props) {
1656
- super(props);
1657
- MultipleChoice$1.prototype.__init.call(this);
1658
- this.state = {
1659
- showCorrect: this.props.alwaysShowCorrect || false
1660
- };
1661
- this.onToggle = this.onToggle.bind(this);
1662
- }
1663
- onToggle() {
1664
- if (this.props.mode === 'evaluate') {
1665
- this.setState({
1666
- showCorrect: !this.state.showCorrect
1667
- });
1668
- }
1669
- }
1670
- UNSAFE_componentWillReceiveProps(nextProps) {
1671
- if (!nextProps.correctResponse) {
1672
- this.setState({
1673
- showCorrect: false
1674
- });
1675
- }
1676
- if (nextProps.alwaysShowCorrect) {
1677
- this.setState({
1678
- showCorrect: true
1679
- });
1680
- }
1681
- }
1682
- isSelected(value) {
1683
- const sessionValue = this.props.session && this.props.session.value;
1684
- return sessionValue && sessionValue.indexOf && sessionValue.indexOf(value) >= 0;
1685
- }
1686
- indexToSymbol(index) {
1687
- if (this.props.keyMode === 'numbers') {
1688
- return `${index + 1}`;
1689
- }
1690
- if (this.props.keyMode === 'letters') {
1691
- return String.fromCharCode(97 + index).toUpperCase();
1692
- }
1693
- return '';
1694
- }
1695
- __init() {
1696
- this.getCorrectness = (choice = {}) => {
1697
- const isCorrect = choice.correct;
1698
- const isChecked = this.isSelected(choice.value);
1699
- if (this.state.showCorrect) {
1700
- return isCorrect ? 'correct' : undefined;
1701
- }
1702
- if (isCorrect) {
1703
- if (isChecked) {
1704
- return 'correct';
1705
- } else {
1706
- return 'incorrect';
1707
- }
1708
- } else {
1709
- if (isChecked) {
1710
- return 'incorrect';
1711
- } else {
1712
- return undefined;
1713
- }
1714
- }
1715
- };
1716
- }
1717
- render() {
1718
- const {mode, disabled, choices = [], choiceMode, prompt, onChoiceChanged, responseCorrect, teacherInstructions, classes, alwaysShowCorrect, animationsDisabled} = this.props;
1719
- const {showCorrect} = this.state;
1720
- const isEvaluateMode = mode === 'evaluate';
1721
- const showCorrectAnswerToggle = isEvaluateMode && !responseCorrect;
1722
- return React$2.createElement('div', {
1723
- className: classNames$1(classes.corespringChoice, 'multiple-choice'),
1724
- __self: this,
1725
- __source: {
1726
- fileName: _jsxFileName$1,
1727
- lineNumber: 146
1728
- }
1729
- }, teacherInstructions && React$2.createElement(React$2.Fragment, {
1730
- __self: this,
1731
- __source: {
1732
- fileName: _jsxFileName$1,
1733
- lineNumber: 148
1734
- }
1735
- }, !animationsDisabled ? React$2.createElement(Collapsible, {
1736
- labels: {
1737
- hidden: 'Show Teacher Instructions',
1738
- visible: 'Hide Teacher Instructions'
1739
- },
1740
- __self: this,
1741
- __source: {
1742
- fileName: _jsxFileName$1,
1743
- lineNumber: 150
1744
- }
1745
- }, React$2.createElement(PreviewPrompt, {
1746
- tagName: "div",
1747
- className: "prompt",
1748
- prompt: teacherInstructions,
1749
- __self: this,
1750
- __source: {
1751
- fileName: _jsxFileName$1,
1752
- lineNumber: 156
1753
- }
1754
- })) : React$2.createElement(PreviewPrompt, {
1755
- tagName: "div",
1756
- className: "prompt",
1757
- defaultClassName: "teacher-instructions",
1758
- prompt: teacherInstructions,
1759
- __self: this,
1760
- __source: {
1761
- fileName: _jsxFileName$1,
1762
- lineNumber: 162
1763
- }
1764
- }), React$2.createElement('br', {
1765
- __self: this,
1766
- __source: {
1767
- fileName: _jsxFileName$1,
1768
- lineNumber: 168
1769
- }
1770
- })), !alwaysShowCorrect && React$2.createElement(CorrectAnswerToggle, {
1771
- show: showCorrectAnswerToggle,
1772
- toggled: showCorrect,
1773
- onToggle: this.onToggle.bind(this),
1774
- __self: this,
1775
- __source: {
1776
- fileName: _jsxFileName$1,
1777
- lineNumber: 172
1778
- }
1779
- }), showCorrectAnswerToggle && React$2.createElement('br', {
1780
- __self: this,
1781
- __source: {
1782
- fileName: _jsxFileName$1,
1783
- lineNumber: 178
1784
- }
1785
- }), React$2.createElement(PreviewPrompt, {
1786
- className: "prompt",
1787
- defaultClassName: "prompt",
1788
- prompt: prompt,
1789
- __self: this,
1790
- __source: {
1791
- fileName: _jsxFileName$1,
1792
- lineNumber: 179
1793
- }
1794
- }), React$2.createElement('div', {
1795
- className: classNames$1({
1796
- [classes.gridLayout]: this.props.choicesLayout === 'grid'
1797
- }, {
1798
- [classes.horizontalLayout]: this.props.choicesLayout === 'horizontal'
1799
- }),
1800
- style: styles.getColumns(this.props.gridColumns),
1801
- __self: this,
1802
- __source: {
1803
- fileName: _jsxFileName$1,
1804
- lineNumber: 180
1805
- }
1806
- }, choices.map((choice, index) => React$2.createElement(StyledChoice, {
1807
- choicesLayout: this.props.choicesLayout,
1808
- gridColumns: this.props.gridColumns,
1809
- key: `choice-${index}`,
1810
- choice: choice,
1811
- index: index,
1812
- choicesLength: choices.length,
1813
- showCorrect: showCorrect,
1814
- isEvaluateMode: isEvaluateMode,
1815
- choiceMode: choiceMode,
1816
- disabled: disabled,
1817
- onChoiceChanged: onChoiceChanged,
1818
- hideTick: choice.hideTick,
1819
- checked: showCorrect ? choice.correct || false : this.isSelected(choice.value),
1820
- correctness: isEvaluateMode ? this.getCorrectness(choice) : undefined,
1821
- displayKey: this.indexToSymbol(index),
1822
- __self: this,
1823
- __source: {
1824
- fileName: _jsxFileName$1,
1825
- lineNumber: 191
1826
- }
1827
- }))));
1828
- }
1829
- }
1830
- MultipleChoice$1.__initStatic();
1831
- MultipleChoice$1.defaultProps = {
1832
- session: {
1833
- value: []
1834
- }
1835
- };
1836
- var MultipleChoice$2 = withStyles$1(styles)(MultipleChoice$1);
1837
- const React$1 = _dll_react;
1838
- const PropTypes = _dll_prop_types;
1839
- const {withStyles: withStyles} = _dll_material_ui__core_styles;
1840
- const {createMuiTheme: createMuiTheme} = _dll_material_ui__core_styles;
1841
- const {MuiThemeProvider: MuiThemeProvider} = _dll_material_ui__core_styles;
1842
- const classNames = _dll_classnames;
1843
- const {PreviewLayout: PreviewLayout} = _dll_pie_lib__render_ui;
1844
- const _jsxFileName = "/home/circleci/repo/packages/multiple-choice/src/main.jsx";
1845
- class Main extends React$1.Component {
1846
- static __initStatic() {
1847
- this.propTypes = {
1848
- model: PropTypes.object,
1849
- session: PropTypes.object,
1850
- onChoiceChanged: PropTypes.func,
1851
- classes: PropTypes.object.isRequired
1852
- };
1853
- }
1854
- static __initStatic2() {
1855
- this.defaultProps = {
1856
- model: {},
1857
- session: {}
1858
- };
1859
- }
1860
- constructor(props) {
1861
- super(props);
1862
- }
1863
- render() {
1864
- const {model, onChoiceChanged, session, classes} = this.props;
1865
- return React$1.createElement(PreviewLayout, {
1866
- __self: this,
1867
- __source: {
1868
- fileName: _jsxFileName,
1869
- lineNumber: 30
1870
- }
1871
- }, model.partLabel && React$1.createElement('p', {
1872
- __self: this,
1873
- __source: {
1874
- fileName: _jsxFileName,
1875
- lineNumber: 31
1876
- }
1877
- }, model.partLabel), React$1.createElement('div', {
1878
- className: classNames(classes.root, classes[model.className]),
1879
- __self: this,
1880
- __source: {
1881
- fileName: _jsxFileName,
1882
- lineNumber: 32
1883
- }
1884
- }, React$1.createElement(MultipleChoice$2, {
1885
- ...model,
1886
- session: session,
1887
- onChoiceChanged: onChoiceChanged,
1888
- __self: this,
1889
- __source: {
1890
- fileName: _jsxFileName,
1891
- lineNumber: 33
1892
- }
1893
- })));
1894
- }
1895
- }
1896
- Main.__initStatic();
1897
- Main.__initStatic2();
1898
- const Styled = withStyles({}, {
1899
- name: 'Main'
1900
- })(Main);
1901
- const theme = createMuiTheme({
1902
- typography: {
1903
- useNextVariants: true
1904
- }
1905
- });
1906
- const Root = props => React$1.createElement(MuiThemeProvider, {
1907
- theme: theme,
1908
- __self: undefined,
1909
- __source: {
1910
- fileName: _jsxFileName,
1911
- lineNumber: 53
1912
- }
1913
- }, React$1.createElement(Styled, {
1914
- ...props,
1915
- __self: undefined,
1916
- __source: {
1917
- fileName: _jsxFileName,
1918
- lineNumber: 54
1919
- }
1920
- }));
1921
- const {concat: concat} = _dll_lodash;
1922
- const {uniq: uniq} = _dll_lodash;
1923
- const {without: without} = _dll_lodash;
1924
- function updateSessionValue(session, choiceMode, data) {
1925
- session.value = session.value || [];
1926
- if (choiceMode === 'checkbox') {
1927
- if (data.selected) {
1928
- session.value = uniq(concat(session.value, [data.value]));
1929
- } else {
1930
- session.value = without(session.value, data.value);
1931
- }
1932
- }
1933
- if (choiceMode === 'radio') {
1934
- if (data.selected) {
1935
- session.value = [data.value];
1936
- } else {
1937
- session.value = [];
1938
- }
1939
- }
1940
- }
1941
- const React = _dll_react;
1942
- const ReactDOM = _dll_react_dom;
1943
- const {debounce: debounce} = _dll_lodash;
1944
- const debug$1 = _dll_debug;
1945
- const {renderMath: renderMath} = _dll_pie_lib__math_rendering;
1946
- const log$1 = debug$1('pie-ui:multiple-choice');
1947
- const isComplete = session => !!(session && session.value && session.value.length);
1948
- class MultipleChoice extends HTMLElement {
1949
- constructor() {
1950
- super();
1951
- this._model = null;
1952
- this._session = null;
1953
- this._rerender = debounce(() => {
1954
- if (this._model && this._session) {
1955
- var element = React.createElement(Root, {
1956
- model: this._model,
1957
- session: this._session,
1958
- onChoiceChanged: this._onChange.bind(this)
1959
- });
1960
- ReactDOM.render(element, this, () => {
1961
- log$1('render complete - render math');
1962
- renderMath(this);
1963
- });
1964
- } else {
1965
- log$1('skip');
1966
- }
1967
- }, 50, {
1968
- leading: false,
1969
- trailing: true
1970
- });
1971
- this._dispatchResponseChanged = debounce(() => {
1972
- var event = new CustomEvent('session-changed', {
1973
- bubbles: true,
1974
- composed: true,
1975
- detail: {
1976
- complete: isComplete(this._session),
1977
- component: this.tagName.toLowerCase()
1978
- }
1979
- });
1980
- this.dispatchEvent(event);
1981
- });
1982
- this._dispatchModelSet = debounce(() => {
1983
- this.dispatchEvent(new CustomEvent('model-set', {
1984
- bubbles: true,
1985
- composed: true,
1986
- detail: {
1987
- complete: isComplete(this._session),
1988
- component: this.tagName.toLowerCase(),
1989
- hasModel: this._model !== undefined
1990
- }
1991
- }));
1992
- }, 50, {
1993
- leading: false,
1994
- trailing: true
1995
- });
1996
- }
1997
- set model(s) {
1998
- this._model = s;
1999
- this._rerender();
2000
- this._dispatchModelSet();
2001
- }
2002
- get session() {
2003
- return this._session;
2004
- }
2005
- set session(s) {
2006
- this._session = s;
2007
- this._rerender();
2008
- this._dispatchResponseChanged();
2009
- }
2010
- _onChange(data) {
2011
- updateSessionValue(this._session, this._model.choiceMode, data);
2012
- this._dispatchResponseChanged();
2013
- this._rerender();
2014
- }
2015
- connectedCallback() {
2016
- this._rerender();
2017
- }
2018
- }
2019
- var lib = {};
2020
- Object.defineProperty(lib, "__esModule", {
2021
- value: true
2022
- });
2023
- class ModelSetEvent extends CustomEvent {
2024
- constructor(component, complete, hasModel) {
2025
- super(ModelSetEvent.TYPE, {
2026
- bubbles: true,
2027
- composed: true,
2028
- detail: {
2029
- complete,
2030
- component,
2031
- hasModel
2032
- }
2033
- });
2034
- this.component = component;
2035
- this.complete = complete;
2036
- }
2037
- }
2038
- ModelSetEvent.TYPE = 'model-set';
2039
- lib.ModelSetEvent = ModelSetEvent;
2040
- class SessionChangedEvent extends CustomEvent {
2041
- constructor(component, complete) {
2042
- super(SessionChangedEvent.TYPE, {
2043
- bubbles: true,
2044
- composed: true,
2045
- detail: {
2046
- complete,
2047
- component
2048
- }
2049
- });
2050
- this.component = component;
2051
- this.complete = complete;
2052
- }
2053
- }
2054
- SessionChangedEvent.TYPE = 'session-changed';
2055
- var SessionChangedEvent_1 = lib.SessionChangedEvent = SessionChangedEvent;
2056
- const {cloneDeep: cloneDeep} = _dll_lodash;
2057
- const {get: get} = _dll_lodash;
2058
- const debug = _dll_debug;
2059
- const MC_TAG_NAME = 'ebsr-multiple-choice';
2060
- const SESSION_CHANGED = SessionChangedEvent_1.TYPE;
2061
- const log = debug('pie-element:ebsr:print');
2062
- const preparePrintModel = (model, opts) => {
2063
- const instr = opts.role === 'instructor';
2064
- model.prompt = model.promptEnabled !== false ? model.prompt : undefined;
2065
- model.teacherInstructions = instr && model.teacherInstructionsEnabled !== false ? model.teacherInstructions : undefined;
2066
- model.showTeacherInstructions = instr;
2067
- model.alwaysShowCorrect = instr;
2068
- model.mode = instr ? 'evaluate' : 'gather';
2069
- model.disabled = true;
2070
- model.animationsDisabled = true;
2071
- model.lockChoiceOrder = true;
2072
- model.choicesLayout = model.choicesLayout || 'vertical';
2073
- const choices = cloneDeep(model.choices);
2074
- model.choices = choices.map(c => {
2075
- c.rationale = instr && model.rationaleEnabled !== false ? c.rationale : undefined;
2076
- c.hideTick = instr;
2077
- c.feedback = undefined;
2078
- return c;
2079
- });
2080
- model.keyMode = model.choicePrefix || 'letters';
2081
- return model;
2082
- };
2083
- class EbsrMC extends MultipleChoice {}
2084
- const defineMultipleChoice = () => {
2085
- if (!customElements.get(MC_TAG_NAME)) {
2086
- customElements.define(MC_TAG_NAME, EbsrMC);
2087
- }
2088
- };
2089
- defineMultipleChoice();
2090
- const isNonEmptyArray = a => Array.isArray(a) && a.length > 0;
2091
- const isSessionComplete = session => {
2092
- const a = get(session, 'value.partA.value');
2093
- const b = get(session, 'value.partB.value');
2094
- return isNonEmptyArray(a) && isNonEmptyArray(b);
2095
- };
2096
- class Ebsr extends HTMLElement {
2097
- constructor() {
2098
- super();
2099
- Ebsr.prototype.__init.call(this);
2100
- this._model = {};
2101
- this._session = {};
2102
- this._options = null;
2103
- }
2104
- __init() {
2105
- this.onSessionUpdated = e => {
2106
- if (e.target === this) {
2107
- return;
2108
- }
2109
- e.preventDefault();
2110
- e.stopImmediatePropagation();
2111
- const id = e.target.getAttribute('id');
2112
- if (id) {
2113
- const key = `part${id.toUpperCase()}`;
2114
- if (e.update) {
2115
- this._model[key] = e.update;
2116
- }
2117
- this.dispatchSessionChanged(e.srcElement._session, key);
2118
- }
2119
- };
2120
- }
2121
- set model(m) {
2122
- this._model = m;
2123
- customElements.whenDefined(MC_TAG_NAME).then(() => {
2124
- this.setPartModel(this.partA, 'partA');
2125
- this.setPartModel(this.partB, 'partB');
2126
- });
2127
- }
2128
- set session(s) {
2129
- this._session = s;
2130
- customElements.whenDefined(MC_TAG_NAME).then(() => {
2131
- this.setPartSession(this.partA, 'partA');
2132
- this.setPartSession(this.partB, 'partB');
2133
- });
2134
- }
2135
- setPartModel(part, key) {
2136
- if (this._model && this._model[key]) {
2137
- part.model = {
2138
- ...preparePrintModel(this._model[key], this._options),
2139
- keyMode: this._model[key].choicePrefix
2140
- };
2141
- if (!part._session) {
2142
- part.session = {};
2143
- }
2144
- }
2145
- }
2146
- set options(o) {
2147
- this._options = o;
2148
- }
2149
- setPartSession(part, key) {
2150
- if (this._session && this._model) {
2151
- const {value} = this._session;
2152
- part.session = value && value[key] ? value[key] : {
2153
- id: key
2154
- };
2155
- }
2156
- }
2157
- dispatchSessionChanged(partSession, key) {
2158
- this._session.value = {
2159
- ...this._session.value,
2160
- [key]: partSession
2161
- };
2162
- log('[onSessionChanged] session: ', this._session);
2163
- const complete = isSessionComplete(this._session);
2164
- this.dispatchEvent(new SessionChangedEvent_1(this.tagName.toLowerCase(), complete));
2165
- }
2166
- get partA() {
2167
- return this.querySelector(`${MC_TAG_NAME}#a`);
2168
- }
2169
- get partB() {
2170
- return this.querySelector(`${MC_TAG_NAME}#b`);
2171
- }
2172
- connectedCallback() {
2173
- this._render();
2174
- this.addEventListener(SESSION_CHANGED, this.onSessionUpdated);
2175
- }
2176
- disconnectedCallback() {
2177
- this.removeEventListener(SESSION_CHANGED, this.onSessionUpdated);
2178
- }
2179
- _render() {
2180
- this.innerHTML = `
2181
- <div>
2182
- <${MC_TAG_NAME} id="a"></${MC_TAG_NAME}>
2183
- <${MC_TAG_NAME} id="b"></${MC_TAG_NAME}>
2184
- </div>
2185
- `;
2186
- }
2187
- }
2188
- export {Ebsr as default, isSessionComplete};