@pie-element/ebsr 7.0.25 → 7.0.26

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