@pie-element/match 10.0.2-esm.0 → 10.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/esm/configure.js DELETED
@@ -1,3557 +0,0 @@
1
- import lodash, { isEmpty, set } from 'lodash';
2
- import * as React from 'react';
3
- import React__default, { createContext, isValidElement, cloneElement, createRef, Component } from 'react';
4
- import ReactDOM from 'react-dom';
5
- import { withStyles } from '@material-ui/core/styles';
6
- import { InputContainer, NumberTextField, Checkbox, AlertDialog, layout, FeedbackConfig, settings } from '@pie-lib/config-ui';
7
- import EditableHtml, { DEFAULT_PLUGINS } from '@pie-lib/editable-html';
8
- import { withDragContext } from '@pie-lib/drag';
9
- import PropTypes from 'prop-types';
10
- import debug from 'debug';
11
- import Select from '@material-ui/core/Select';
12
- import MenuItem from '@material-ui/core/MenuItem';
13
- import Typography from '@material-ui/core/Typography';
14
- import Info from '@material-ui/icons/Info';
15
- import Tooltip from '@material-ui/core/Tooltip';
16
- import classNames from 'classnames';
17
- import Button from '@material-ui/core/Button';
18
- import AddButton from '@material-ui/icons/Add';
19
- import DragHandle from '@material-ui/icons/DragHandle';
20
- import Radio from '@material-ui/core/Radio';
21
- import IconButton from '@material-ui/core/IconButton';
22
- import Delete from '@material-ui/icons/Delete';
23
- import { color } from '@pie-lib/render-ui';
24
- import { jsx } from 'react/jsx-runtime';
25
- import { ModelUpdatedEvent, InsertImageEvent, DeleteImageEvent, InsertSoundEvent, DeleteSoundEvent } from '@pie-framework/pie-configure-events';
26
- import cloneDeep from 'lodash/cloneDeep';
27
-
28
- function _extends() {
29
- _extends = Object.assign || function (target) {
30
- for (var i = 1; i < arguments.length; i++) {
31
- var source = arguments[i];
32
-
33
- for (var key in source) {
34
- if (Object.prototype.hasOwnProperty.call(source, key)) {
35
- target[key] = source[key];
36
- }
37
- }
38
- }
39
-
40
- return target;
41
- };
42
-
43
- return _extends.apply(this, arguments);
44
- }
45
-
46
- const getPluginProps = (props = {}, baseInputConfiguration = {}) => _extends({}, baseInputConfiguration, props);
47
-
48
- const generateValidationMessage = (model, configuration) => {
49
- const {
50
- choiceMode
51
- } = model;
52
- const {
53
- minQuestions,
54
- maxQuestions,
55
- maxAnswers
56
- } = configuration;
57
- const baselineValidationMessage = `\nThere should be at least ${minQuestions}` + (maxQuestions ? ` and at most ${maxQuestions}` : '') + ' question row' + (minQuestions > 1 || maxQuestions ? 's.' : '.') + '\nRow and column headings should be non-blank and unique. \nFirst column heading is excluded from validation.' + (maxAnswers ? `\nThere should be at most ${maxAnswers} answer choices.` : '');
58
- const correctResponseMessage = choiceMode === 'radio' ? '\nThere should be a correct response defined for every row.' : '\nThere should be at least one correct response defined for every row.';
59
- return 'Validation requirements:' + baselineValidationMessage + correctResponseMessage;
60
- };
61
-
62
- const styles$4 = theme => ({
63
- container: {
64
- marginTop: theme.spacing.unit * 2,
65
- display: 'flex'
66
- },
67
- input: {
68
- flex: 1
69
- },
70
- numberTextField: {
71
- flexDirection: 'unset'
72
- },
73
- inputContainer: {
74
- width: '65%'
75
- },
76
- flexContainer: {
77
- display: 'flex',
78
- alignItems: 'center'
79
- },
80
- titleText: {
81
- fontSize: theme.typography.fontSize + 2,
82
- marginRight: theme.spacing.unit
83
- },
84
- tooltip: {
85
- fontSize: theme.typography.fontSize - 2,
86
- whiteSpace: 'pre',
87
- maxWidth: '500px'
88
- }
89
- });
90
-
91
- class GeneralConfigBlock extends React.Component {
92
- constructor(...args) {
93
- super(...args);
94
-
95
- this.onChangeResponseType = name => event => {
96
- const {
97
- model,
98
- onResponseTypeChange
99
- } = this.props;
100
-
101
- const newModel = _extends({}, model);
102
-
103
- newModel[name] = event.target.value;
104
- onResponseTypeChange(newModel[name]);
105
- };
106
-
107
- this.onChangeColumns = (name, value) => {
108
- const {
109
- model,
110
- onLayoutChange
111
- } = this.props;
112
-
113
- const newModel = _extends({}, model);
114
-
115
- newModel[name] = value;
116
- onLayoutChange(newModel[name]);
117
- };
118
- }
119
-
120
- render() {
121
- const {
122
- classes,
123
- model,
124
- configuration
125
- } = this.props;
126
- const {
127
- layout = {},
128
- choiceMode = {},
129
- maxAnswers
130
- } = configuration || {};
131
- const validationMessage = generateValidationMessage(model, configuration);
132
- return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
133
- className: classes.flexContainer
134
- }, /*#__PURE__*/React.createElement(Typography, {
135
- className: classes.titleText,
136
- component: 'div'
137
- }, "Define questions"), /*#__PURE__*/React.createElement(Tooltip, {
138
- classes: {
139
- tooltip: classes.tooltip
140
- },
141
- disableFocusListener: true,
142
- disableTouchListener: true,
143
- placement: 'right',
144
- title: validationMessage
145
- }, /*#__PURE__*/React.createElement(Info, {
146
- fontSize: 'small',
147
- color: 'primary'
148
- }))), /*#__PURE__*/React.createElement("div", {
149
- className: classes.container
150
- }, /*#__PURE__*/React.createElement("div", {
151
- className: classes.input
152
- }, layout.settings && /*#__PURE__*/React.createElement(InputContainer, {
153
- label: layout.label,
154
- className: classes.inputContainer
155
- }, /*#__PURE__*/React.createElement(NumberTextField, {
156
- type: "number",
157
- min: 3,
158
- max: maxAnswers || 10,
159
- value: model.layout,
160
- onChange: (e, v) => this.onChangeColumns('layout', v),
161
- suffix: 'Columns',
162
- className: classes.numberTextField
163
- }))), /*#__PURE__*/React.createElement("div", {
164
- className: classes.input
165
- }, choiceMode.settings && /*#__PURE__*/React.createElement(InputContainer, {
166
- label: choiceMode.label,
167
- className: classes.inputContainer
168
- }, /*#__PURE__*/React.createElement(Select, {
169
- onChange: this.onChangeResponseType('choiceMode'),
170
- value: model.choiceMode
171
- }, /*#__PURE__*/React.createElement(MenuItem, {
172
- value: "radio"
173
- }, "Radio - One Answer"), /*#__PURE__*/React.createElement(MenuItem, {
174
- value: "checkbox"
175
- }, "Checkbox - Multiple Answers"))))));
176
- }
177
-
178
- }
179
-
180
- GeneralConfigBlock.propTypes = {
181
- classes: PropTypes.object.isRequired,
182
- model: PropTypes.object.isRequired,
183
- configuration: PropTypes.object.isRequired,
184
- onResponseTypeChange: PropTypes.func.isRequired,
185
- onLayoutChange: PropTypes.func.isRequired
186
- };
187
- var GeneralConfigBlock$1 = withStyles(styles$4)(GeneralConfigBlock);
188
-
189
- class AddRowButton extends React__default.Component {
190
- render() {
191
- const {
192
- classes,
193
- onAddClick
194
- } = this.props;
195
- return /*#__PURE__*/React__default.createElement(Button, {
196
- className: classes.button,
197
- disabled: false,
198
- onClick: onAddClick
199
- }, /*#__PURE__*/React__default.createElement(AddButton, {
200
- className: classes.icon
201
- }), "Add Another Row");
202
- }
203
-
204
- }
205
- AddRowButton.propTypes = {
206
- classes: PropTypes.object.isRequired,
207
- onAddClick: PropTypes.func.isRequired
208
- };
209
-
210
- const styles$3 = theme => ({
211
- button: {
212
- display: 'flex',
213
- alignSelf: 'flex-start',
214
- margin: 0
215
- },
216
- icon: {
217
- marginRight: theme.spacing.unit / 2
218
- }
219
- });
220
-
221
- var AddRow = withStyles(styles$3)(AddRowButton);
222
-
223
- /**
224
- * Create the React Context
225
- */
226
-
227
- var DndContext = createContext({
228
- dragDropManager: undefined
229
- });
230
-
231
- /**
232
- * Use invariant() to assert state which your program assumes to be true.
233
- *
234
- * Provide sprintf-style format (only %s is supported) and arguments
235
- * to provide information about what broke and what you were
236
- * expecting.
237
- *
238
- * The invariant message will be stripped in production, but the invariant
239
- * will remain to ensure logic does not differ in production.
240
- */
241
- function invariant(condition, format) {
242
- for (var _len = arguments.length, args = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
243
- args[_key - 2] = arguments[_key];
244
- }
245
-
246
- if (process.env.NODE_ENV !== 'production') {
247
- if (format === undefined) {
248
- throw new Error('invariant requires an error message argument');
249
- }
250
- }
251
-
252
- if (!condition) {
253
- var error;
254
-
255
- if (format === undefined) {
256
- error = new Error('Minified exception occurred; use the non-minified dev environment ' + 'for the full error message and additional helpful warnings.');
257
- } else {
258
- var argIndex = 0;
259
- error = new Error(format.replace(/%s/g, function () {
260
- return args[argIndex++];
261
- }));
262
- error.name = 'Invariant Violation';
263
- }
264
-
265
- error.framesToPop = 1; // we don't care about invariant's own frame
266
-
267
- throw error;
268
- }
269
- }
270
-
271
- function _classCallCheck$7(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
272
-
273
- function _defineProperties$7(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
274
-
275
- function _createClass$7(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$7(Constructor.prototype, protoProps); if (staticProps) _defineProperties$7(Constructor, staticProps); return Constructor; }
276
-
277
- function _defineProperty$7(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
278
- var isCallingCanDrag = false;
279
- var isCallingIsDragging = false;
280
- var DragSourceMonitorImpl = /*#__PURE__*/function () {
281
- function DragSourceMonitorImpl(manager) {
282
- _classCallCheck$7(this, DragSourceMonitorImpl);
283
-
284
- _defineProperty$7(this, "internalMonitor", void 0);
285
-
286
- _defineProperty$7(this, "sourceId", null);
287
-
288
- this.internalMonitor = manager.getMonitor();
289
- }
290
-
291
- _createClass$7(DragSourceMonitorImpl, [{
292
- key: "receiveHandlerId",
293
- value: function receiveHandlerId(sourceId) {
294
- this.sourceId = sourceId;
295
- }
296
- }, {
297
- key: "getHandlerId",
298
- value: function getHandlerId() {
299
- return this.sourceId;
300
- }
301
- }, {
302
- key: "canDrag",
303
- value: function canDrag() {
304
- invariant(!isCallingCanDrag, 'You may not call monitor.canDrag() inside your canDrag() implementation. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source-monitor');
305
-
306
- try {
307
- isCallingCanDrag = true;
308
- return this.internalMonitor.canDragSource(this.sourceId);
309
- } finally {
310
- isCallingCanDrag = false;
311
- }
312
- }
313
- }, {
314
- key: "isDragging",
315
- value: function isDragging() {
316
- if (!this.sourceId) {
317
- return false;
318
- }
319
-
320
- invariant(!isCallingIsDragging, 'You may not call monitor.isDragging() inside your isDragging() implementation. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source-monitor');
321
-
322
- try {
323
- isCallingIsDragging = true;
324
- return this.internalMonitor.isDraggingSource(this.sourceId);
325
- } finally {
326
- isCallingIsDragging = false;
327
- }
328
- }
329
- }, {
330
- key: "subscribeToStateChange",
331
- value: function subscribeToStateChange(listener, options) {
332
- return this.internalMonitor.subscribeToStateChange(listener, options);
333
- }
334
- }, {
335
- key: "isDraggingSource",
336
- value: function isDraggingSource(sourceId) {
337
- return this.internalMonitor.isDraggingSource(sourceId);
338
- }
339
- }, {
340
- key: "isOverTarget",
341
- value: function isOverTarget(targetId, options) {
342
- return this.internalMonitor.isOverTarget(targetId, options);
343
- }
344
- }, {
345
- key: "getTargetIds",
346
- value: function getTargetIds() {
347
- return this.internalMonitor.getTargetIds();
348
- }
349
- }, {
350
- key: "isSourcePublic",
351
- value: function isSourcePublic() {
352
- return this.internalMonitor.isSourcePublic();
353
- }
354
- }, {
355
- key: "getSourceId",
356
- value: function getSourceId() {
357
- return this.internalMonitor.getSourceId();
358
- }
359
- }, {
360
- key: "subscribeToOffsetChange",
361
- value: function subscribeToOffsetChange(listener) {
362
- return this.internalMonitor.subscribeToOffsetChange(listener);
363
- }
364
- }, {
365
- key: "canDragSource",
366
- value: function canDragSource(sourceId) {
367
- return this.internalMonitor.canDragSource(sourceId);
368
- }
369
- }, {
370
- key: "canDropOnTarget",
371
- value: function canDropOnTarget(targetId) {
372
- return this.internalMonitor.canDropOnTarget(targetId);
373
- }
374
- }, {
375
- key: "getItemType",
376
- value: function getItemType() {
377
- return this.internalMonitor.getItemType();
378
- }
379
- }, {
380
- key: "getItem",
381
- value: function getItem() {
382
- return this.internalMonitor.getItem();
383
- }
384
- }, {
385
- key: "getDropResult",
386
- value: function getDropResult() {
387
- return this.internalMonitor.getDropResult();
388
- }
389
- }, {
390
- key: "didDrop",
391
- value: function didDrop() {
392
- return this.internalMonitor.didDrop();
393
- }
394
- }, {
395
- key: "getInitialClientOffset",
396
- value: function getInitialClientOffset() {
397
- return this.internalMonitor.getInitialClientOffset();
398
- }
399
- }, {
400
- key: "getInitialSourceClientOffset",
401
- value: function getInitialSourceClientOffset() {
402
- return this.internalMonitor.getInitialSourceClientOffset();
403
- }
404
- }, {
405
- key: "getSourceClientOffset",
406
- value: function getSourceClientOffset() {
407
- return this.internalMonitor.getSourceClientOffset();
408
- }
409
- }, {
410
- key: "getClientOffset",
411
- value: function getClientOffset() {
412
- return this.internalMonitor.getClientOffset();
413
- }
414
- }, {
415
- key: "getDifferenceFromInitialOffset",
416
- value: function getDifferenceFromInitialOffset() {
417
- return this.internalMonitor.getDifferenceFromInitialOffset();
418
- }
419
- }]);
420
-
421
- return DragSourceMonitorImpl;
422
- }();
423
-
424
- function _classCallCheck$6(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
425
-
426
- function _defineProperties$6(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
427
-
428
- function _createClass$6(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$6(Constructor.prototype, protoProps); if (staticProps) _defineProperties$6(Constructor, staticProps); return Constructor; }
429
-
430
- function _defineProperty$6(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
431
- var isCallingCanDrop = false;
432
- var DropTargetMonitorImpl = /*#__PURE__*/function () {
433
- function DropTargetMonitorImpl(manager) {
434
- _classCallCheck$6(this, DropTargetMonitorImpl);
435
-
436
- _defineProperty$6(this, "internalMonitor", void 0);
437
-
438
- _defineProperty$6(this, "targetId", null);
439
-
440
- this.internalMonitor = manager.getMonitor();
441
- }
442
-
443
- _createClass$6(DropTargetMonitorImpl, [{
444
- key: "receiveHandlerId",
445
- value: function receiveHandlerId(targetId) {
446
- this.targetId = targetId;
447
- }
448
- }, {
449
- key: "getHandlerId",
450
- value: function getHandlerId() {
451
- return this.targetId;
452
- }
453
- }, {
454
- key: "subscribeToStateChange",
455
- value: function subscribeToStateChange(listener, options) {
456
- return this.internalMonitor.subscribeToStateChange(listener, options);
457
- }
458
- }, {
459
- key: "canDrop",
460
- value: function canDrop() {
461
- // Cut out early if the target id has not been set. This should prevent errors
462
- // where the user has an older version of dnd-core like in
463
- // https://github.com/react-dnd/react-dnd/issues/1310
464
- if (!this.targetId) {
465
- return false;
466
- }
467
-
468
- invariant(!isCallingCanDrop, 'You may not call monitor.canDrop() inside your canDrop() implementation. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target-monitor');
469
-
470
- try {
471
- isCallingCanDrop = true;
472
- return this.internalMonitor.canDropOnTarget(this.targetId);
473
- } finally {
474
- isCallingCanDrop = false;
475
- }
476
- }
477
- }, {
478
- key: "isOver",
479
- value: function isOver(options) {
480
- if (!this.targetId) {
481
- return false;
482
- }
483
-
484
- return this.internalMonitor.isOverTarget(this.targetId, options);
485
- }
486
- }, {
487
- key: "getItemType",
488
- value: function getItemType() {
489
- return this.internalMonitor.getItemType();
490
- }
491
- }, {
492
- key: "getItem",
493
- value: function getItem() {
494
- return this.internalMonitor.getItem();
495
- }
496
- }, {
497
- key: "getDropResult",
498
- value: function getDropResult() {
499
- return this.internalMonitor.getDropResult();
500
- }
501
- }, {
502
- key: "didDrop",
503
- value: function didDrop() {
504
- return this.internalMonitor.didDrop();
505
- }
506
- }, {
507
- key: "getInitialClientOffset",
508
- value: function getInitialClientOffset() {
509
- return this.internalMonitor.getInitialClientOffset();
510
- }
511
- }, {
512
- key: "getInitialSourceClientOffset",
513
- value: function getInitialSourceClientOffset() {
514
- return this.internalMonitor.getInitialSourceClientOffset();
515
- }
516
- }, {
517
- key: "getSourceClientOffset",
518
- value: function getSourceClientOffset() {
519
- return this.internalMonitor.getSourceClientOffset();
520
- }
521
- }, {
522
- key: "getClientOffset",
523
- value: function getClientOffset() {
524
- return this.internalMonitor.getClientOffset();
525
- }
526
- }, {
527
- key: "getDifferenceFromInitialOffset",
528
- value: function getDifferenceFromInitialOffset() {
529
- return this.internalMonitor.getDifferenceFromInitialOffset();
530
- }
531
- }]);
532
-
533
- return DropTargetMonitorImpl;
534
- }();
535
-
536
- function throwIfCompositeComponentElement(element) {
537
- // Custom components can no longer be wrapped directly in React DnD 2.0
538
- // so that we don't need to depend on findDOMNode() from react-dom.
539
- if (typeof element.type === 'string') {
540
- return;
541
- }
542
-
543
- var displayName = element.type.displayName || element.type.name || 'the component';
544
- throw new Error('Only native element nodes can now be passed to React DnD connectors.' + "You can either wrap ".concat(displayName, " into a <div>, or turn it into a ") + 'drag source or a drop target itself.');
545
- }
546
-
547
- function wrapHookToRecognizeElement(hook) {
548
- return function () {
549
- var elementOrNode = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
550
- var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
551
-
552
- // When passed a node, call the hook straight away.
553
- if (!isValidElement(elementOrNode)) {
554
- var node = elementOrNode;
555
- hook(node, options); // return the node so it can be chained (e.g. when within callback refs
556
- // <div ref={node => connectDragSource(connectDropTarget(node))}/>
557
-
558
- return node;
559
- } // If passed a ReactElement, clone it and attach this function as a ref.
560
- // This helps us achieve a neat API where user doesn't even know that refs
561
- // are being used under the hood.
562
-
563
-
564
- var element = elementOrNode;
565
- throwIfCompositeComponentElement(element); // When no options are passed, use the hook directly
566
-
567
- var ref = options ? function (node) {
568
- return hook(node, options);
569
- } : hook;
570
- return cloneWithRef(element, ref);
571
- };
572
- }
573
-
574
- function wrapConnectorHooks(hooks) {
575
- var wrappedHooks = {};
576
- Object.keys(hooks).forEach(function (key) {
577
- var hook = hooks[key]; // ref objects should be passed straight through without wrapping
578
-
579
- if (key.endsWith('Ref')) {
580
- wrappedHooks[key] = hooks[key];
581
- } else {
582
- var wrappedHook = wrapHookToRecognizeElement(hook);
583
-
584
- wrappedHooks[key] = function () {
585
- return wrappedHook;
586
- };
587
- }
588
- });
589
- return wrappedHooks;
590
- }
591
-
592
- function setRef(ref, node) {
593
- if (typeof ref === 'function') {
594
- ref(node);
595
- } else {
596
- ref.current = node;
597
- }
598
- }
599
-
600
- function cloneWithRef(element, newRef) {
601
- var previousRef = element.ref;
602
- invariant(typeof previousRef !== 'string', 'Cannot connect React DnD to an element with an existing string ref. ' + 'Please convert it to use a callback ref instead, or wrap it into a <span> or <div>. ' + 'Read more: https://reactjs.org/docs/refs-and-the-dom.html#callback-refs');
603
-
604
- if (!previousRef) {
605
- // When there is no ref on the element, use the new ref directly
606
- return cloneElement(element, {
607
- ref: newRef
608
- });
609
- } else {
610
- return cloneElement(element, {
611
- ref: function ref(node) {
612
- setRef(previousRef, node);
613
- setRef(newRef, node);
614
- }
615
- });
616
- }
617
- }
618
-
619
- function _typeof$2(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$2 = function _typeof(obj) { return typeof obj; }; } else { _typeof$2 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$2(obj); }
620
-
621
- function isRef(obj) {
622
- return (// eslint-disable-next-line no-prototype-builtins
623
- obj !== null && _typeof$2(obj) === 'object' && Object.prototype.hasOwnProperty.call(obj, 'current')
624
- );
625
- }
626
-
627
- function shallowEqual(objA, objB, compare, compareContext) {
628
- var compareResult = compare ? compare.call(compareContext, objA, objB) : void 0;
629
-
630
- if (compareResult !== void 0) {
631
- return !!compareResult;
632
- }
633
-
634
- if (objA === objB) {
635
- return true;
636
- }
637
-
638
- if (typeof objA !== 'object' || !objA || typeof objB !== 'object' || !objB) {
639
- return false;
640
- }
641
-
642
- var keysA = Object.keys(objA);
643
- var keysB = Object.keys(objB);
644
-
645
- if (keysA.length !== keysB.length) {
646
- return false;
647
- }
648
-
649
- var bHasOwnProperty = Object.prototype.hasOwnProperty.bind(objB); // Test for A's keys different from B.
650
-
651
- for (var idx = 0; idx < keysA.length; idx++) {
652
- var key = keysA[idx];
653
-
654
- if (!bHasOwnProperty(key)) {
655
- return false;
656
- }
657
-
658
- var valueA = objA[key];
659
- var valueB = objB[key];
660
- compareResult = compare ? compare.call(compareContext, valueA, valueB, key) : void 0;
661
-
662
- if (compareResult === false || compareResult === void 0 && valueA !== valueB) {
663
- return false;
664
- }
665
- }
666
-
667
- return true;
668
- }
669
-
670
- function _classCallCheck$5(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
671
-
672
- function _defineProperties$5(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
673
-
674
- function _createClass$5(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$5(Constructor.prototype, protoProps); if (staticProps) _defineProperties$5(Constructor, staticProps); return Constructor; }
675
-
676
- function _defineProperty$5(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
677
- var SourceConnector = /*#__PURE__*/function () {
678
- // The drop target may either be attached via ref or connect function
679
- // The drag preview may either be attached via ref or connect function
680
- function SourceConnector(backend) {
681
- var _this = this;
682
-
683
- _classCallCheck$5(this, SourceConnector);
684
-
685
- _defineProperty$5(this, "hooks", wrapConnectorHooks({
686
- dragSource: function dragSource(node, options) {
687
- _this.clearDragSource();
688
-
689
- _this.dragSourceOptions = options || null;
690
-
691
- if (isRef(node)) {
692
- _this.dragSourceRef = node;
693
- } else {
694
- _this.dragSourceNode = node;
695
- }
696
-
697
- _this.reconnectDragSource();
698
- },
699
- dragPreview: function dragPreview(node, options) {
700
- _this.clearDragPreview();
701
-
702
- _this.dragPreviewOptions = options || null;
703
-
704
- if (isRef(node)) {
705
- _this.dragPreviewRef = node;
706
- } else {
707
- _this.dragPreviewNode = node;
708
- }
709
-
710
- _this.reconnectDragPreview();
711
- }
712
- }));
713
-
714
- _defineProperty$5(this, "handlerId", null);
715
-
716
- _defineProperty$5(this, "dragSourceRef", null);
717
-
718
- _defineProperty$5(this, "dragSourceNode", void 0);
719
-
720
- _defineProperty$5(this, "dragSourceOptionsInternal", null);
721
-
722
- _defineProperty$5(this, "dragSourceUnsubscribe", void 0);
723
-
724
- _defineProperty$5(this, "dragPreviewRef", null);
725
-
726
- _defineProperty$5(this, "dragPreviewNode", void 0);
727
-
728
- _defineProperty$5(this, "dragPreviewOptionsInternal", null);
729
-
730
- _defineProperty$5(this, "dragPreviewUnsubscribe", void 0);
731
-
732
- _defineProperty$5(this, "lastConnectedHandlerId", null);
733
-
734
- _defineProperty$5(this, "lastConnectedDragSource", null);
735
-
736
- _defineProperty$5(this, "lastConnectedDragSourceOptions", null);
737
-
738
- _defineProperty$5(this, "lastConnectedDragPreview", null);
739
-
740
- _defineProperty$5(this, "lastConnectedDragPreviewOptions", null);
741
-
742
- _defineProperty$5(this, "backend", void 0);
743
-
744
- this.backend = backend;
745
- }
746
-
747
- _createClass$5(SourceConnector, [{
748
- key: "receiveHandlerId",
749
- value: function receiveHandlerId(newHandlerId) {
750
- if (this.handlerId === newHandlerId) {
751
- return;
752
- }
753
-
754
- this.handlerId = newHandlerId;
755
- this.reconnect();
756
- }
757
- }, {
758
- key: "connectTarget",
759
- get: function get() {
760
- return this.dragSource;
761
- }
762
- }, {
763
- key: "dragSourceOptions",
764
- get: function get() {
765
- return this.dragSourceOptionsInternal;
766
- },
767
- set: function set(options) {
768
- this.dragSourceOptionsInternal = options;
769
- }
770
- }, {
771
- key: "dragPreviewOptions",
772
- get: function get() {
773
- return this.dragPreviewOptionsInternal;
774
- },
775
- set: function set(options) {
776
- this.dragPreviewOptionsInternal = options;
777
- }
778
- }, {
779
- key: "reconnect",
780
- value: function reconnect() {
781
- this.reconnectDragSource();
782
- this.reconnectDragPreview();
783
- }
784
- }, {
785
- key: "reconnectDragSource",
786
- value: function reconnectDragSource() {
787
- var dragSource = this.dragSource; // if nothing has changed then don't resubscribe
788
-
789
- var didChange = this.didHandlerIdChange() || this.didConnectedDragSourceChange() || this.didDragSourceOptionsChange();
790
-
791
- if (didChange) {
792
- this.disconnectDragSource();
793
- }
794
-
795
- if (!this.handlerId) {
796
- return;
797
- }
798
-
799
- if (!dragSource) {
800
- this.lastConnectedDragSource = dragSource;
801
- return;
802
- }
803
-
804
- if (didChange) {
805
- this.lastConnectedHandlerId = this.handlerId;
806
- this.lastConnectedDragSource = dragSource;
807
- this.lastConnectedDragSourceOptions = this.dragSourceOptions;
808
- this.dragSourceUnsubscribe = this.backend.connectDragSource(this.handlerId, dragSource, this.dragSourceOptions);
809
- }
810
- }
811
- }, {
812
- key: "reconnectDragPreview",
813
- value: function reconnectDragPreview() {
814
- var dragPreview = this.dragPreview; // if nothing has changed then don't resubscribe
815
-
816
- var didChange = this.didHandlerIdChange() || this.didConnectedDragPreviewChange() || this.didDragPreviewOptionsChange();
817
-
818
- if (didChange) {
819
- this.disconnectDragPreview();
820
- }
821
-
822
- if (!this.handlerId) {
823
- return;
824
- }
825
-
826
- if (!dragPreview) {
827
- this.lastConnectedDragPreview = dragPreview;
828
- return;
829
- }
830
-
831
- if (didChange) {
832
- this.lastConnectedHandlerId = this.handlerId;
833
- this.lastConnectedDragPreview = dragPreview;
834
- this.lastConnectedDragPreviewOptions = this.dragPreviewOptions;
835
- this.dragPreviewUnsubscribe = this.backend.connectDragPreview(this.handlerId, dragPreview, this.dragPreviewOptions);
836
- }
837
- }
838
- }, {
839
- key: "didHandlerIdChange",
840
- value: function didHandlerIdChange() {
841
- return this.lastConnectedHandlerId !== this.handlerId;
842
- }
843
- }, {
844
- key: "didConnectedDragSourceChange",
845
- value: function didConnectedDragSourceChange() {
846
- return this.lastConnectedDragSource !== this.dragSource;
847
- }
848
- }, {
849
- key: "didConnectedDragPreviewChange",
850
- value: function didConnectedDragPreviewChange() {
851
- return this.lastConnectedDragPreview !== this.dragPreview;
852
- }
853
- }, {
854
- key: "didDragSourceOptionsChange",
855
- value: function didDragSourceOptionsChange() {
856
- return !shallowEqual(this.lastConnectedDragSourceOptions, this.dragSourceOptions);
857
- }
858
- }, {
859
- key: "didDragPreviewOptionsChange",
860
- value: function didDragPreviewOptionsChange() {
861
- return !shallowEqual(this.lastConnectedDragPreviewOptions, this.dragPreviewOptions);
862
- }
863
- }, {
864
- key: "disconnectDragSource",
865
- value: function disconnectDragSource() {
866
- if (this.dragSourceUnsubscribe) {
867
- this.dragSourceUnsubscribe();
868
- this.dragSourceUnsubscribe = undefined;
869
- }
870
- }
871
- }, {
872
- key: "disconnectDragPreview",
873
- value: function disconnectDragPreview() {
874
- if (this.dragPreviewUnsubscribe) {
875
- this.dragPreviewUnsubscribe();
876
- this.dragPreviewUnsubscribe = undefined;
877
- this.dragPreviewNode = null;
878
- this.dragPreviewRef = null;
879
- }
880
- }
881
- }, {
882
- key: "dragSource",
883
- get: function get() {
884
- return this.dragSourceNode || this.dragSourceRef && this.dragSourceRef.current;
885
- }
886
- }, {
887
- key: "dragPreview",
888
- get: function get() {
889
- return this.dragPreviewNode || this.dragPreviewRef && this.dragPreviewRef.current;
890
- }
891
- }, {
892
- key: "clearDragSource",
893
- value: function clearDragSource() {
894
- this.dragSourceNode = null;
895
- this.dragSourceRef = null;
896
- }
897
- }, {
898
- key: "clearDragPreview",
899
- value: function clearDragPreview() {
900
- this.dragPreviewNode = null;
901
- this.dragPreviewRef = null;
902
- }
903
- }]);
904
-
905
- return SourceConnector;
906
- }();
907
-
908
- function _classCallCheck$4(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
909
-
910
- function _defineProperties$4(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
911
-
912
- function _createClass$4(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$4(Constructor.prototype, protoProps); if (staticProps) _defineProperties$4(Constructor, staticProps); return Constructor; }
913
-
914
- function _defineProperty$4(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
915
- var TargetConnector = /*#__PURE__*/function () {
916
- // The drop target may either be attached via ref or connect function
917
- function TargetConnector(backend) {
918
- var _this = this;
919
-
920
- _classCallCheck$4(this, TargetConnector);
921
-
922
- _defineProperty$4(this, "hooks", wrapConnectorHooks({
923
- dropTarget: function dropTarget(node, options) {
924
- _this.clearDropTarget();
925
-
926
- _this.dropTargetOptions = options;
927
-
928
- if (isRef(node)) {
929
- _this.dropTargetRef = node;
930
- } else {
931
- _this.dropTargetNode = node;
932
- }
933
-
934
- _this.reconnect();
935
- }
936
- }));
937
-
938
- _defineProperty$4(this, "handlerId", null);
939
-
940
- _defineProperty$4(this, "dropTargetRef", null);
941
-
942
- _defineProperty$4(this, "dropTargetNode", void 0);
943
-
944
- _defineProperty$4(this, "dropTargetOptionsInternal", null);
945
-
946
- _defineProperty$4(this, "unsubscribeDropTarget", void 0);
947
-
948
- _defineProperty$4(this, "lastConnectedHandlerId", null);
949
-
950
- _defineProperty$4(this, "lastConnectedDropTarget", null);
951
-
952
- _defineProperty$4(this, "lastConnectedDropTargetOptions", null);
953
-
954
- _defineProperty$4(this, "backend", void 0);
955
-
956
- this.backend = backend;
957
- }
958
-
959
- _createClass$4(TargetConnector, [{
960
- key: "connectTarget",
961
- get: function get() {
962
- return this.dropTarget;
963
- }
964
- }, {
965
- key: "reconnect",
966
- value: function reconnect() {
967
- // if nothing has changed then don't resubscribe
968
- var didChange = this.didHandlerIdChange() || this.didDropTargetChange() || this.didOptionsChange();
969
-
970
- if (didChange) {
971
- this.disconnectDropTarget();
972
- }
973
-
974
- var dropTarget = this.dropTarget;
975
-
976
- if (!this.handlerId) {
977
- return;
978
- }
979
-
980
- if (!dropTarget) {
981
- this.lastConnectedDropTarget = dropTarget;
982
- return;
983
- }
984
-
985
- if (didChange) {
986
- this.lastConnectedHandlerId = this.handlerId;
987
- this.lastConnectedDropTarget = dropTarget;
988
- this.lastConnectedDropTargetOptions = this.dropTargetOptions;
989
- this.unsubscribeDropTarget = this.backend.connectDropTarget(this.handlerId, dropTarget, this.dropTargetOptions);
990
- }
991
- }
992
- }, {
993
- key: "receiveHandlerId",
994
- value: function receiveHandlerId(newHandlerId) {
995
- if (newHandlerId === this.handlerId) {
996
- return;
997
- }
998
-
999
- this.handlerId = newHandlerId;
1000
- this.reconnect();
1001
- }
1002
- }, {
1003
- key: "dropTargetOptions",
1004
- get: function get() {
1005
- return this.dropTargetOptionsInternal;
1006
- },
1007
- set: function set(options) {
1008
- this.dropTargetOptionsInternal = options;
1009
- }
1010
- }, {
1011
- key: "didHandlerIdChange",
1012
- value: function didHandlerIdChange() {
1013
- return this.lastConnectedHandlerId !== this.handlerId;
1014
- }
1015
- }, {
1016
- key: "didDropTargetChange",
1017
- value: function didDropTargetChange() {
1018
- return this.lastConnectedDropTarget !== this.dropTarget;
1019
- }
1020
- }, {
1021
- key: "didOptionsChange",
1022
- value: function didOptionsChange() {
1023
- return !shallowEqual(this.lastConnectedDropTargetOptions, this.dropTargetOptions);
1024
- }
1025
- }, {
1026
- key: "disconnectDropTarget",
1027
- value: function disconnectDropTarget() {
1028
- if (this.unsubscribeDropTarget) {
1029
- this.unsubscribeDropTarget();
1030
- this.unsubscribeDropTarget = undefined;
1031
- }
1032
- }
1033
- }, {
1034
- key: "dropTarget",
1035
- get: function get() {
1036
- return this.dropTargetNode || this.dropTargetRef && this.dropTargetRef.current;
1037
- }
1038
- }, {
1039
- key: "clearDropTarget",
1040
- value: function clearDropTarget() {
1041
- this.dropTargetRef = null;
1042
- this.dropTargetNode = null;
1043
- }
1044
- }]);
1045
-
1046
- return TargetConnector;
1047
- }();
1048
-
1049
- function registerTarget(type, target, manager) {
1050
- var registry = manager.getRegistry();
1051
- var targetId = registry.addTarget(type, target);
1052
- return [targetId, function () {
1053
- return registry.removeTarget(targetId);
1054
- }];
1055
- }
1056
- function registerSource(type, source, manager) {
1057
- var registry = manager.getRegistry();
1058
- var sourceId = registry.addSource(type, source);
1059
- return [sourceId, function () {
1060
- return registry.removeSource(sourceId);
1061
- }];
1062
- }
1063
-
1064
- function _typeof$1(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$1 = function _typeof(obj) { return typeof obj; }; } else { _typeof$1 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$1(obj); }
1065
-
1066
- function getDecoratedComponent(instanceRef) {
1067
- var currentRef = instanceRef.current;
1068
-
1069
- if (currentRef == null) {
1070
- return null;
1071
- } else if (currentRef.decoratedRef) {
1072
- // go through the private field in decorateHandler to avoid the invariant hit
1073
- return currentRef.decoratedRef.current;
1074
- } else {
1075
- return currentRef;
1076
- }
1077
- }
1078
- function isClassComponent(Component) {
1079
- return Component && Component.prototype && typeof Component.prototype.render === 'function';
1080
- }
1081
- function isRefForwardingComponent(C) {
1082
- var _item$$$typeof;
1083
-
1084
- var item = C;
1085
- return (item === null || item === void 0 ? void 0 : (_item$$$typeof = item.$$typeof) === null || _item$$$typeof === void 0 ? void 0 : _item$$$typeof.toString()) === 'Symbol(react.forward_ref)';
1086
- }
1087
- function isRefable(C) {
1088
- return isClassComponent(C) || isRefForwardingComponent(C);
1089
- }
1090
- function checkDecoratorArguments(functionName, signature) {
1091
- if (process.env.NODE_ENV !== 'production') {
1092
- for (var i = 0; i < (arguments.length <= 2 ? 0 : arguments.length - 2); i++) {
1093
- var arg = i + 2 < 2 || arguments.length <= i + 2 ? undefined : arguments[i + 2];
1094
-
1095
- if (arg && arg.prototype && arg.prototype.render) {
1096
- // eslint-disable-next-line no-console
1097
- console.error('You seem to be applying the arguments in the wrong order. ' + "It should be ".concat(functionName, "(").concat(signature, ")(Component), not the other way around. ") + 'Read more: http://react-dnd.github.io/react-dnd/docs/troubleshooting#you-seem-to-be-applying-the-arguments-in-the-wrong-order');
1098
- return;
1099
- }
1100
- }
1101
- }
1102
- }
1103
- function isFunction(input) {
1104
- return typeof input === 'function';
1105
- }
1106
- function noop() {// noop
1107
- }
1108
-
1109
- function isObjectLike(input) {
1110
- return _typeof$1(input) === 'object' && input !== null;
1111
- }
1112
-
1113
- function isPlainObject(input) {
1114
- if (!isObjectLike(input)) {
1115
- return false;
1116
- }
1117
-
1118
- if (Object.getPrototypeOf(input) === null) {
1119
- return true;
1120
- }
1121
-
1122
- var proto = input;
1123
-
1124
- while (Object.getPrototypeOf(proto) !== null) {
1125
- proto = Object.getPrototypeOf(proto);
1126
- }
1127
-
1128
- return Object.getPrototypeOf(input) === proto;
1129
- }
1130
- function isValidType(type, allowArray) {
1131
- return typeof type === 'string' || _typeof$1(type) === 'symbol' || !!allowArray && Array.isArray(type) && type.every(function (t) {
1132
- return isValidType(t, false);
1133
- });
1134
- }
1135
-
1136
- function _classCallCheck$3(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
1137
-
1138
- function _defineProperties$3(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
1139
-
1140
- function _createClass$3(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$3(Constructor.prototype, protoProps); if (staticProps) _defineProperties$3(Constructor, staticProps); return Constructor; }
1141
-
1142
- function _defineProperty$3(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
1143
- /**
1144
- * Provides a set of static methods for creating Disposables.
1145
- * @param {Function} action Action to run during the first call to dispose.
1146
- * The action is guaranteed to be run at most once.
1147
- */
1148
-
1149
- var Disposable = /*#__PURE__*/function () {
1150
- function Disposable(action) {
1151
- _classCallCheck$3(this, Disposable);
1152
-
1153
- _defineProperty$3(this, "isDisposed", false);
1154
-
1155
- _defineProperty$3(this, "action", void 0);
1156
-
1157
- this.action = isFunction(action) ? action : noop;
1158
- }
1159
- /** Performs the task of cleaning up resources. */
1160
-
1161
-
1162
- _createClass$3(Disposable, [{
1163
- key: "dispose",
1164
- value: function dispose() {
1165
- if (!this.isDisposed) {
1166
- this.action();
1167
- this.isDisposed = true;
1168
- }
1169
- }
1170
- }], [{
1171
- key: "isDisposable",
1172
- value:
1173
- /**
1174
- * Gets the disposable that does nothing when disposed.
1175
- */
1176
-
1177
- /**
1178
- * Validates whether the given object is a disposable
1179
- * @param {Object} Object to test whether it has a dispose method
1180
- * @returns {Boolean} true if a disposable object, else false.
1181
- */
1182
- function isDisposable(d) {
1183
- return Boolean(d && isFunction(d.dispose));
1184
- }
1185
- }, {
1186
- key: "_fixup",
1187
- value: function _fixup(result) {
1188
- return Disposable.isDisposable(result) ? result : Disposable.empty;
1189
- }
1190
- /**
1191
- * Creates a disposable object that invokes the specified action when disposed.
1192
- * @param {Function} dispose Action to run during the first call to dispose.
1193
- * The action is guaranteed to be run at most once.
1194
- * @return {Disposable} The disposable object that runs the given action upon disposal.
1195
- */
1196
-
1197
- }, {
1198
- key: "create",
1199
- value: function create(action) {
1200
- return new Disposable(action);
1201
- }
1202
- }]);
1203
-
1204
- return Disposable;
1205
- }();
1206
- /**
1207
- * Represents a group of disposable resources that are disposed together.
1208
- * @constructor
1209
- */
1210
-
1211
- _defineProperty$3(Disposable, "empty", {
1212
- dispose: noop
1213
- });
1214
-
1215
- var CompositeDisposable = /*#__PURE__*/function () {
1216
- function CompositeDisposable() {
1217
- _classCallCheck$3(this, CompositeDisposable);
1218
-
1219
- _defineProperty$3(this, "isDisposed", false);
1220
-
1221
- _defineProperty$3(this, "disposables", void 0);
1222
-
1223
- for (var _len = arguments.length, disposables = new Array(_len), _key = 0; _key < _len; _key++) {
1224
- disposables[_key] = arguments[_key];
1225
- }
1226
-
1227
- this.disposables = disposables;
1228
- }
1229
- /**
1230
- * Adds a disposable to the CompositeDisposable or disposes the disposable if the CompositeDisposable is disposed.
1231
- * @param {Any} item Disposable to add.
1232
- */
1233
-
1234
-
1235
- _createClass$3(CompositeDisposable, [{
1236
- key: "add",
1237
- value: function add(item) {
1238
- if (this.isDisposed) {
1239
- item.dispose();
1240
- } else {
1241
- this.disposables.push(item);
1242
- }
1243
- }
1244
- /**
1245
- * Removes and disposes the first occurrence of a disposable from the CompositeDisposable.
1246
- * @param {Any} item Disposable to remove.
1247
- * @returns {Boolean} true if found; false otherwise.
1248
- */
1249
-
1250
- }, {
1251
- key: "remove",
1252
- value: function remove(item) {
1253
- var shouldDispose = false;
1254
-
1255
- if (!this.isDisposed) {
1256
- var idx = this.disposables.indexOf(item);
1257
-
1258
- if (idx !== -1) {
1259
- shouldDispose = true;
1260
- this.disposables.splice(idx, 1);
1261
- item.dispose();
1262
- }
1263
- }
1264
-
1265
- return shouldDispose;
1266
- }
1267
- /**
1268
- * Disposes all disposables in the group and removes them from the group but
1269
- * does not dispose the CompositeDisposable.
1270
- */
1271
-
1272
- }, {
1273
- key: "clear",
1274
- value: function clear() {
1275
- if (!this.isDisposed) {
1276
- var len = this.disposables.length;
1277
- var currentDisposables = new Array(len);
1278
-
1279
- for (var i = 0; i < len; i++) {
1280
- currentDisposables[i] = this.disposables[i];
1281
- }
1282
-
1283
- this.disposables = [];
1284
-
1285
- for (var _i = 0; _i < len; _i++) {
1286
- currentDisposables[_i].dispose();
1287
- }
1288
- }
1289
- }
1290
- /**
1291
- * Disposes all disposables in the group and removes them from the group.
1292
- */
1293
-
1294
- }, {
1295
- key: "dispose",
1296
- value: function dispose() {
1297
- if (!this.isDisposed) {
1298
- this.isDisposed = true;
1299
- var len = this.disposables.length;
1300
- var currentDisposables = new Array(len);
1301
-
1302
- for (var i = 0; i < len; i++) {
1303
- currentDisposables[i] = this.disposables[i];
1304
- }
1305
-
1306
- this.disposables = [];
1307
-
1308
- for (var _i2 = 0; _i2 < len; _i2++) {
1309
- currentDisposables[_i2].dispose();
1310
- }
1311
- }
1312
- }
1313
- }]);
1314
-
1315
- return CompositeDisposable;
1316
- }();
1317
- /**
1318
- * Represents a disposable resource whose underlying disposable resource can
1319
- * be replaced by another disposable resource, causing automatic disposal of
1320
- * the previous underlying disposable resource.
1321
- */
1322
-
1323
- var SerialDisposable = /*#__PURE__*/function () {
1324
- function SerialDisposable() {
1325
- _classCallCheck$3(this, SerialDisposable);
1326
-
1327
- _defineProperty$3(this, "isDisposed", false);
1328
-
1329
- _defineProperty$3(this, "current", void 0);
1330
- }
1331
-
1332
- _createClass$3(SerialDisposable, [{
1333
- key: "getDisposable",
1334
- value:
1335
- /**
1336
- * Gets the underlying disposable.
1337
- * @returns {Any} the underlying disposable.
1338
- */
1339
- function getDisposable() {
1340
- return this.current;
1341
- }
1342
- }, {
1343
- key: "setDisposable",
1344
- value: function setDisposable(value) {
1345
- var shouldDispose = this.isDisposed;
1346
-
1347
- if (!shouldDispose) {
1348
- var old = this.current;
1349
- this.current = value;
1350
-
1351
- if (old) {
1352
- old.dispose();
1353
- }
1354
- }
1355
-
1356
- if (shouldDispose && value) {
1357
- value.dispose();
1358
- }
1359
- }
1360
- /** Performs the task of cleaning up resources. */
1361
-
1362
- }, {
1363
- key: "dispose",
1364
- value: function dispose() {
1365
- if (!this.isDisposed) {
1366
- this.isDisposed = true;
1367
- var old = this.current;
1368
- this.current = undefined;
1369
-
1370
- if (old) {
1371
- old.dispose();
1372
- }
1373
- }
1374
- }
1375
- }]);
1376
-
1377
- return SerialDisposable;
1378
- }();
1379
-
1380
- var reactIs$1 = {exports: {}};
1381
-
1382
- var reactIs_production_min = {};
1383
-
1384
- /** @license React v16.13.1
1385
- * react-is.production.min.js
1386
- *
1387
- * Copyright (c) Facebook, Inc. and its affiliates.
1388
- *
1389
- * This source code is licensed under the MIT license found in the
1390
- * LICENSE file in the root directory of this source tree.
1391
- */
1392
- var b="function"===typeof Symbol&&Symbol.for,c=b?Symbol.for("react.element"):60103,d=b?Symbol.for("react.portal"):60106,e=b?Symbol.for("react.fragment"):60107,f=b?Symbol.for("react.strict_mode"):60108,g=b?Symbol.for("react.profiler"):60114,h=b?Symbol.for("react.provider"):60109,k=b?Symbol.for("react.context"):60110,l=b?Symbol.for("react.async_mode"):60111,m=b?Symbol.for("react.concurrent_mode"):60111,n=b?Symbol.for("react.forward_ref"):60112,p=b?Symbol.for("react.suspense"):60113,q=b?
1393
- Symbol.for("react.suspense_list"):60120,r=b?Symbol.for("react.memo"):60115,t=b?Symbol.for("react.lazy"):60116,v=b?Symbol.for("react.block"):60121,w=b?Symbol.for("react.fundamental"):60117,x=b?Symbol.for("react.responder"):60118,y=b?Symbol.for("react.scope"):60119;
1394
- function z(a){if("object"===typeof a&&null!==a){var u=a.$$typeof;switch(u){case c:switch(a=a.type,a){case l:case m:case e:case g:case f:case p:return a;default:switch(a=a&&a.$$typeof,a){case k:case n:case t:case r:case h:return a;default:return u}}case d:return u}}}function A(a){return z(a)===m}reactIs_production_min.AsyncMode=l;reactIs_production_min.ConcurrentMode=m;reactIs_production_min.ContextConsumer=k;reactIs_production_min.ContextProvider=h;reactIs_production_min.Element=c;reactIs_production_min.ForwardRef=n;reactIs_production_min.Fragment=e;reactIs_production_min.Lazy=t;reactIs_production_min.Memo=r;reactIs_production_min.Portal=d;
1395
- reactIs_production_min.Profiler=g;reactIs_production_min.StrictMode=f;reactIs_production_min.Suspense=p;reactIs_production_min.isAsyncMode=function(a){return A(a)||z(a)===l};reactIs_production_min.isConcurrentMode=A;reactIs_production_min.isContextConsumer=function(a){return z(a)===k};reactIs_production_min.isContextProvider=function(a){return z(a)===h};reactIs_production_min.isElement=function(a){return "object"===typeof a&&null!==a&&a.$$typeof===c};reactIs_production_min.isForwardRef=function(a){return z(a)===n};reactIs_production_min.isFragment=function(a){return z(a)===e};reactIs_production_min.isLazy=function(a){return z(a)===t};
1396
- reactIs_production_min.isMemo=function(a){return z(a)===r};reactIs_production_min.isPortal=function(a){return z(a)===d};reactIs_production_min.isProfiler=function(a){return z(a)===g};reactIs_production_min.isStrictMode=function(a){return z(a)===f};reactIs_production_min.isSuspense=function(a){return z(a)===p};
1397
- reactIs_production_min.isValidElementType=function(a){return "string"===typeof a||"function"===typeof a||a===e||a===m||a===g||a===f||a===p||a===q||"object"===typeof a&&null!==a&&(a.$$typeof===t||a.$$typeof===r||a.$$typeof===h||a.$$typeof===k||a.$$typeof===n||a.$$typeof===w||a.$$typeof===x||a.$$typeof===y||a.$$typeof===v)};reactIs_production_min.typeOf=z;
1398
-
1399
- var reactIs_development = {};
1400
-
1401
- /** @license React v16.13.1
1402
- * react-is.development.js
1403
- *
1404
- * Copyright (c) Facebook, Inc. and its affiliates.
1405
- *
1406
- * This source code is licensed under the MIT license found in the
1407
- * LICENSE file in the root directory of this source tree.
1408
- */
1409
-
1410
-
1411
-
1412
- if (process.env.NODE_ENV !== "production") {
1413
- (function() {
1414
-
1415
- // The Symbol used to tag the ReactElement-like types. If there is no native Symbol
1416
- // nor polyfill, then a plain number is used for performance.
1417
- var hasSymbol = typeof Symbol === 'function' && Symbol.for;
1418
- var REACT_ELEMENT_TYPE = hasSymbol ? Symbol.for('react.element') : 0xeac7;
1419
- var REACT_PORTAL_TYPE = hasSymbol ? Symbol.for('react.portal') : 0xeaca;
1420
- var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol.for('react.fragment') : 0xeacb;
1421
- var REACT_STRICT_MODE_TYPE = hasSymbol ? Symbol.for('react.strict_mode') : 0xeacc;
1422
- var REACT_PROFILER_TYPE = hasSymbol ? Symbol.for('react.profiler') : 0xead2;
1423
- var REACT_PROVIDER_TYPE = hasSymbol ? Symbol.for('react.provider') : 0xeacd;
1424
- var REACT_CONTEXT_TYPE = hasSymbol ? Symbol.for('react.context') : 0xeace; // TODO: We don't use AsyncMode or ConcurrentMode anymore. They were temporary
1425
- // (unstable) APIs that have been removed. Can we remove the symbols?
1426
-
1427
- var REACT_ASYNC_MODE_TYPE = hasSymbol ? Symbol.for('react.async_mode') : 0xeacf;
1428
- var REACT_CONCURRENT_MODE_TYPE = hasSymbol ? Symbol.for('react.concurrent_mode') : 0xeacf;
1429
- var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for('react.forward_ref') : 0xead0;
1430
- var REACT_SUSPENSE_TYPE = hasSymbol ? Symbol.for('react.suspense') : 0xead1;
1431
- var REACT_SUSPENSE_LIST_TYPE = hasSymbol ? Symbol.for('react.suspense_list') : 0xead8;
1432
- var REACT_MEMO_TYPE = hasSymbol ? Symbol.for('react.memo') : 0xead3;
1433
- var REACT_LAZY_TYPE = hasSymbol ? Symbol.for('react.lazy') : 0xead4;
1434
- var REACT_BLOCK_TYPE = hasSymbol ? Symbol.for('react.block') : 0xead9;
1435
- var REACT_FUNDAMENTAL_TYPE = hasSymbol ? Symbol.for('react.fundamental') : 0xead5;
1436
- var REACT_RESPONDER_TYPE = hasSymbol ? Symbol.for('react.responder') : 0xead6;
1437
- var REACT_SCOPE_TYPE = hasSymbol ? Symbol.for('react.scope') : 0xead7;
1438
-
1439
- function isValidElementType(type) {
1440
- return typeof type === 'string' || typeof type === 'function' || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
1441
- type === REACT_FRAGMENT_TYPE || type === REACT_CONCURRENT_MODE_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || typeof type === 'object' && type !== null && (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_RESPONDER_TYPE || type.$$typeof === REACT_SCOPE_TYPE || type.$$typeof === REACT_BLOCK_TYPE);
1442
- }
1443
-
1444
- function typeOf(object) {
1445
- if (typeof object === 'object' && object !== null) {
1446
- var $$typeof = object.$$typeof;
1447
-
1448
- switch ($$typeof) {
1449
- case REACT_ELEMENT_TYPE:
1450
- var type = object.type;
1451
-
1452
- switch (type) {
1453
- case REACT_ASYNC_MODE_TYPE:
1454
- case REACT_CONCURRENT_MODE_TYPE:
1455
- case REACT_FRAGMENT_TYPE:
1456
- case REACT_PROFILER_TYPE:
1457
- case REACT_STRICT_MODE_TYPE:
1458
- case REACT_SUSPENSE_TYPE:
1459
- return type;
1460
-
1461
- default:
1462
- var $$typeofType = type && type.$$typeof;
1463
-
1464
- switch ($$typeofType) {
1465
- case REACT_CONTEXT_TYPE:
1466
- case REACT_FORWARD_REF_TYPE:
1467
- case REACT_LAZY_TYPE:
1468
- case REACT_MEMO_TYPE:
1469
- case REACT_PROVIDER_TYPE:
1470
- return $$typeofType;
1471
-
1472
- default:
1473
- return $$typeof;
1474
- }
1475
-
1476
- }
1477
-
1478
- case REACT_PORTAL_TYPE:
1479
- return $$typeof;
1480
- }
1481
- }
1482
-
1483
- return undefined;
1484
- } // AsyncMode is deprecated along with isAsyncMode
1485
-
1486
- var AsyncMode = REACT_ASYNC_MODE_TYPE;
1487
- var ConcurrentMode = REACT_CONCURRENT_MODE_TYPE;
1488
- var ContextConsumer = REACT_CONTEXT_TYPE;
1489
- var ContextProvider = REACT_PROVIDER_TYPE;
1490
- var Element = REACT_ELEMENT_TYPE;
1491
- var ForwardRef = REACT_FORWARD_REF_TYPE;
1492
- var Fragment = REACT_FRAGMENT_TYPE;
1493
- var Lazy = REACT_LAZY_TYPE;
1494
- var Memo = REACT_MEMO_TYPE;
1495
- var Portal = REACT_PORTAL_TYPE;
1496
- var Profiler = REACT_PROFILER_TYPE;
1497
- var StrictMode = REACT_STRICT_MODE_TYPE;
1498
- var Suspense = REACT_SUSPENSE_TYPE;
1499
- var hasWarnedAboutDeprecatedIsAsyncMode = false; // AsyncMode should be deprecated
1500
-
1501
- function isAsyncMode(object) {
1502
- {
1503
- if (!hasWarnedAboutDeprecatedIsAsyncMode) {
1504
- hasWarnedAboutDeprecatedIsAsyncMode = true; // Using console['warn'] to evade Babel and ESLint
1505
-
1506
- console['warn']('The ReactIs.isAsyncMode() alias has been deprecated, ' + 'and will be removed in React 17+. Update your code to use ' + 'ReactIs.isConcurrentMode() instead. It has the exact same API.');
1507
- }
1508
- }
1509
-
1510
- return isConcurrentMode(object) || typeOf(object) === REACT_ASYNC_MODE_TYPE;
1511
- }
1512
- function isConcurrentMode(object) {
1513
- return typeOf(object) === REACT_CONCURRENT_MODE_TYPE;
1514
- }
1515
- function isContextConsumer(object) {
1516
- return typeOf(object) === REACT_CONTEXT_TYPE;
1517
- }
1518
- function isContextProvider(object) {
1519
- return typeOf(object) === REACT_PROVIDER_TYPE;
1520
- }
1521
- function isElement(object) {
1522
- return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
1523
- }
1524
- function isForwardRef(object) {
1525
- return typeOf(object) === REACT_FORWARD_REF_TYPE;
1526
- }
1527
- function isFragment(object) {
1528
- return typeOf(object) === REACT_FRAGMENT_TYPE;
1529
- }
1530
- function isLazy(object) {
1531
- return typeOf(object) === REACT_LAZY_TYPE;
1532
- }
1533
- function isMemo(object) {
1534
- return typeOf(object) === REACT_MEMO_TYPE;
1535
- }
1536
- function isPortal(object) {
1537
- return typeOf(object) === REACT_PORTAL_TYPE;
1538
- }
1539
- function isProfiler(object) {
1540
- return typeOf(object) === REACT_PROFILER_TYPE;
1541
- }
1542
- function isStrictMode(object) {
1543
- return typeOf(object) === REACT_STRICT_MODE_TYPE;
1544
- }
1545
- function isSuspense(object) {
1546
- return typeOf(object) === REACT_SUSPENSE_TYPE;
1547
- }
1548
-
1549
- reactIs_development.AsyncMode = AsyncMode;
1550
- reactIs_development.ConcurrentMode = ConcurrentMode;
1551
- reactIs_development.ContextConsumer = ContextConsumer;
1552
- reactIs_development.ContextProvider = ContextProvider;
1553
- reactIs_development.Element = Element;
1554
- reactIs_development.ForwardRef = ForwardRef;
1555
- reactIs_development.Fragment = Fragment;
1556
- reactIs_development.Lazy = Lazy;
1557
- reactIs_development.Memo = Memo;
1558
- reactIs_development.Portal = Portal;
1559
- reactIs_development.Profiler = Profiler;
1560
- reactIs_development.StrictMode = StrictMode;
1561
- reactIs_development.Suspense = Suspense;
1562
- reactIs_development.isAsyncMode = isAsyncMode;
1563
- reactIs_development.isConcurrentMode = isConcurrentMode;
1564
- reactIs_development.isContextConsumer = isContextConsumer;
1565
- reactIs_development.isContextProvider = isContextProvider;
1566
- reactIs_development.isElement = isElement;
1567
- reactIs_development.isForwardRef = isForwardRef;
1568
- reactIs_development.isFragment = isFragment;
1569
- reactIs_development.isLazy = isLazy;
1570
- reactIs_development.isMemo = isMemo;
1571
- reactIs_development.isPortal = isPortal;
1572
- reactIs_development.isProfiler = isProfiler;
1573
- reactIs_development.isStrictMode = isStrictMode;
1574
- reactIs_development.isSuspense = isSuspense;
1575
- reactIs_development.isValidElementType = isValidElementType;
1576
- reactIs_development.typeOf = typeOf;
1577
- })();
1578
- }
1579
-
1580
- if (process.env.NODE_ENV === 'production') {
1581
- reactIs$1.exports = reactIs_production_min;
1582
- } else {
1583
- reactIs$1.exports = reactIs_development;
1584
- }
1585
-
1586
- var reactIs = reactIs$1.exports;
1587
-
1588
- /**
1589
- * Copyright 2015, Yahoo! Inc.
1590
- * Copyrights licensed under the New BSD License. See the accompanying LICENSE file for terms.
1591
- */
1592
- var REACT_STATICS = {
1593
- childContextTypes: true,
1594
- contextType: true,
1595
- contextTypes: true,
1596
- defaultProps: true,
1597
- displayName: true,
1598
- getDefaultProps: true,
1599
- getDerivedStateFromError: true,
1600
- getDerivedStateFromProps: true,
1601
- mixins: true,
1602
- propTypes: true,
1603
- type: true
1604
- };
1605
- var KNOWN_STATICS = {
1606
- name: true,
1607
- length: true,
1608
- prototype: true,
1609
- caller: true,
1610
- callee: true,
1611
- arguments: true,
1612
- arity: true
1613
- };
1614
- var FORWARD_REF_STATICS = {
1615
- '$$typeof': true,
1616
- render: true,
1617
- defaultProps: true,
1618
- displayName: true,
1619
- propTypes: true
1620
- };
1621
- var MEMO_STATICS = {
1622
- '$$typeof': true,
1623
- compare: true,
1624
- defaultProps: true,
1625
- displayName: true,
1626
- propTypes: true,
1627
- type: true
1628
- };
1629
- var TYPE_STATICS = {};
1630
- TYPE_STATICS[reactIs.ForwardRef] = FORWARD_REF_STATICS;
1631
- TYPE_STATICS[reactIs.Memo] = MEMO_STATICS;
1632
-
1633
- function getStatics(component) {
1634
- // React v16.11 and below
1635
- if (reactIs.isMemo(component)) {
1636
- return MEMO_STATICS;
1637
- } // React v16.12 and above
1638
-
1639
-
1640
- return TYPE_STATICS[component['$$typeof']] || REACT_STATICS;
1641
- }
1642
-
1643
- var defineProperty = Object.defineProperty;
1644
- var getOwnPropertyNames = Object.getOwnPropertyNames;
1645
- var getOwnPropertySymbols = Object.getOwnPropertySymbols;
1646
- var getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
1647
- var getPrototypeOf = Object.getPrototypeOf;
1648
- var objectPrototype = Object.prototype;
1649
- function hoistNonReactStatics(targetComponent, sourceComponent, blacklist) {
1650
- if (typeof sourceComponent !== 'string') {
1651
- // don't hoist over string (html) components
1652
- if (objectPrototype) {
1653
- var inheritedComponent = getPrototypeOf(sourceComponent);
1654
-
1655
- if (inheritedComponent && inheritedComponent !== objectPrototype) {
1656
- hoistNonReactStatics(targetComponent, inheritedComponent, blacklist);
1657
- }
1658
- }
1659
-
1660
- var keys = getOwnPropertyNames(sourceComponent);
1661
-
1662
- if (getOwnPropertySymbols) {
1663
- keys = keys.concat(getOwnPropertySymbols(sourceComponent));
1664
- }
1665
-
1666
- var targetStatics = getStatics(targetComponent);
1667
- var sourceStatics = getStatics(sourceComponent);
1668
-
1669
- for (var i = 0; i < keys.length; ++i) {
1670
- var key = keys[i];
1671
-
1672
- if (!KNOWN_STATICS[key] && !(blacklist && blacklist[key]) && !(sourceStatics && sourceStatics[key]) && !(targetStatics && targetStatics[key])) {
1673
- var descriptor = getOwnPropertyDescriptor(sourceComponent, key);
1674
-
1675
- try {
1676
- // Avoid failures from read-only properties
1677
- defineProperty(targetComponent, key, descriptor);
1678
- } catch (e) {}
1679
- }
1680
- }
1681
- }
1682
-
1683
- return targetComponent;
1684
- }
1685
-
1686
- var hoistNonReactStatics_cjs = hoistNonReactStatics;
1687
-
1688
- var hoistStatics = hoistNonReactStatics_cjs;
1689
-
1690
- function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
1691
-
1692
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
1693
-
1694
- function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
1695
-
1696
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
1697
-
1698
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
1699
-
1700
- function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
1701
-
1702
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
1703
-
1704
- function _classCallCheck$2(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
1705
-
1706
- function _defineProperties$2(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
1707
-
1708
- function _createClass$2(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$2(Constructor.prototype, protoProps); if (staticProps) _defineProperties$2(Constructor, staticProps); return Constructor; }
1709
-
1710
- function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
1711
-
1712
- function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
1713
-
1714
- function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
1715
-
1716
- function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
1717
-
1718
- function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
1719
-
1720
- function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
1721
-
1722
- function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
1723
-
1724
- function _defineProperty$2(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
1725
- function decorateHandler(_ref) {
1726
- var DecoratedComponent = _ref.DecoratedComponent,
1727
- createHandler = _ref.createHandler,
1728
- createMonitor = _ref.createMonitor,
1729
- createConnector = _ref.createConnector,
1730
- registerHandler = _ref.registerHandler,
1731
- containerDisplayName = _ref.containerDisplayName,
1732
- getType = _ref.getType,
1733
- collect = _ref.collect,
1734
- options = _ref.options;
1735
- var _options$arePropsEqua = options.arePropsEqual,
1736
- arePropsEqual = _options$arePropsEqua === void 0 ? shallowEqual : _options$arePropsEqua;
1737
- var Decorated = DecoratedComponent;
1738
- var displayName = DecoratedComponent.displayName || DecoratedComponent.name || 'Component';
1739
-
1740
- var DragDropContainer = /*#__PURE__*/function (_Component) {
1741
- _inherits(DragDropContainer, _Component);
1742
-
1743
- var _super = _createSuper(DragDropContainer);
1744
-
1745
- function DragDropContainer(props) {
1746
- var _this;
1747
-
1748
- _classCallCheck$2(this, DragDropContainer);
1749
-
1750
- _this = _super.call(this, props);
1751
-
1752
- _defineProperty$2(_assertThisInitialized(_this), "decoratedRef", createRef());
1753
-
1754
- _defineProperty$2(_assertThisInitialized(_this), "handlerId", void 0);
1755
-
1756
- _defineProperty$2(_assertThisInitialized(_this), "manager", void 0);
1757
-
1758
- _defineProperty$2(_assertThisInitialized(_this), "handlerMonitor", void 0);
1759
-
1760
- _defineProperty$2(_assertThisInitialized(_this), "handlerConnector", void 0);
1761
-
1762
- _defineProperty$2(_assertThisInitialized(_this), "handler", void 0);
1763
-
1764
- _defineProperty$2(_assertThisInitialized(_this), "disposable", void 0);
1765
-
1766
- _defineProperty$2(_assertThisInitialized(_this), "currentType", void 0);
1767
-
1768
- _defineProperty$2(_assertThisInitialized(_this), "handleChange", function () {
1769
- var nextState = _this.getCurrentState();
1770
-
1771
- if (!shallowEqual(nextState, _this.state)) {
1772
- _this.setState(nextState);
1773
- }
1774
- });
1775
-
1776
- _this.disposable = new SerialDisposable();
1777
-
1778
- _this.receiveProps(props);
1779
-
1780
- _this.dispose();
1781
-
1782
- return _this;
1783
- }
1784
-
1785
- _createClass$2(DragDropContainer, [{
1786
- key: "getHandlerId",
1787
- value: function getHandlerId() {
1788
- return this.handlerId;
1789
- }
1790
- }, {
1791
- key: "getDecoratedComponentInstance",
1792
- value: function getDecoratedComponentInstance() {
1793
- invariant(this.decoratedRef.current, 'In order to access an instance of the decorated component, it must either be a class component or use React.forwardRef()');
1794
- return this.decoratedRef.current;
1795
- }
1796
- }, {
1797
- key: "shouldComponentUpdate",
1798
- value: function shouldComponentUpdate(nextProps, nextState) {
1799
- return !arePropsEqual(nextProps, this.props) || !shallowEqual(nextState, this.state);
1800
- }
1801
- }, {
1802
- key: "componentDidMount",
1803
- value: function componentDidMount() {
1804
- this.disposable = new SerialDisposable();
1805
- this.currentType = undefined;
1806
- this.receiveProps(this.props);
1807
- this.handleChange();
1808
- }
1809
- }, {
1810
- key: "componentDidUpdate",
1811
- value: function componentDidUpdate(prevProps) {
1812
- if (!arePropsEqual(this.props, prevProps)) {
1813
- this.receiveProps(this.props);
1814
- this.handleChange();
1815
- }
1816
- }
1817
- }, {
1818
- key: "componentWillUnmount",
1819
- value: function componentWillUnmount() {
1820
- this.dispose();
1821
- }
1822
- }, {
1823
- key: "receiveProps",
1824
- value: function receiveProps(props) {
1825
- if (!this.handler) {
1826
- return;
1827
- }
1828
-
1829
- this.handler.receiveProps(props);
1830
- this.receiveType(getType(props));
1831
- }
1832
- }, {
1833
- key: "receiveType",
1834
- value: function receiveType(type) {
1835
- if (!this.handlerMonitor || !this.manager || !this.handlerConnector) {
1836
- return;
1837
- }
1838
-
1839
- if (type === this.currentType) {
1840
- return;
1841
- }
1842
-
1843
- this.currentType = type;
1844
-
1845
- var _registerHandler = registerHandler(type, this.handler, this.manager),
1846
- _registerHandler2 = _slicedToArray(_registerHandler, 2),
1847
- handlerId = _registerHandler2[0],
1848
- unregister = _registerHandler2[1];
1849
-
1850
- this.handlerId = handlerId;
1851
- this.handlerMonitor.receiveHandlerId(handlerId);
1852
- this.handlerConnector.receiveHandlerId(handlerId);
1853
- var globalMonitor = this.manager.getMonitor();
1854
- var unsubscribe = globalMonitor.subscribeToStateChange(this.handleChange, {
1855
- handlerIds: [handlerId]
1856
- });
1857
- this.disposable.setDisposable(new CompositeDisposable(new Disposable(unsubscribe), new Disposable(unregister)));
1858
- }
1859
- }, {
1860
- key: "dispose",
1861
- value: function dispose() {
1862
- this.disposable.dispose();
1863
-
1864
- if (this.handlerConnector) {
1865
- this.handlerConnector.receiveHandlerId(null);
1866
- }
1867
- }
1868
- }, {
1869
- key: "getCurrentState",
1870
- value: function getCurrentState() {
1871
- if (!this.handlerConnector) {
1872
- return {};
1873
- }
1874
-
1875
- var nextState = collect(this.handlerConnector.hooks, this.handlerMonitor, this.props);
1876
-
1877
- if (process.env.NODE_ENV !== 'production') {
1878
- invariant(isPlainObject(nextState), 'Expected `collect` specified as the second argument to ' + '%s for %s to return a plain object of props to inject. ' + 'Instead, received %s.', containerDisplayName, displayName, nextState);
1879
- }
1880
-
1881
- return nextState;
1882
- }
1883
- }, {
1884
- key: "render",
1885
- value: function render() {
1886
- var _this2 = this;
1887
-
1888
- return jsx(DndContext.Consumer, {
1889
- children: function children(_ref2) {
1890
- var dragDropManager = _ref2.dragDropManager;
1891
-
1892
- _this2.receiveDragDropManager(dragDropManager);
1893
-
1894
- if (typeof requestAnimationFrame !== 'undefined') {
1895
- requestAnimationFrame(function () {
1896
- var _this2$handlerConnect;
1897
-
1898
- return (_this2$handlerConnect = _this2.handlerConnector) === null || _this2$handlerConnect === void 0 ? void 0 : _this2$handlerConnect.reconnect();
1899
- });
1900
- }
1901
-
1902
- return jsx(Decorated, Object.assign({}, _this2.props, _this2.getCurrentState(), {
1903
- // NOTE: if Decorated is a Function Component, decoratedRef will not be populated unless it's a refforwarding component.
1904
- ref: isRefable(Decorated) ? _this2.decoratedRef : null
1905
- }), void 0);
1906
- }
1907
- }, void 0);
1908
- }
1909
- }, {
1910
- key: "receiveDragDropManager",
1911
- value: function receiveDragDropManager(dragDropManager) {
1912
- if (this.manager !== undefined) {
1913
- return;
1914
- }
1915
-
1916
- invariant(dragDropManager !== undefined, 'Could not find the drag and drop manager in the context of %s. ' + 'Make sure to render a DndProvider component in your top-level component. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/troubleshooting#could-not-find-the-drag-and-drop-manager-in-the-context', displayName, displayName);
1917
-
1918
- if (dragDropManager === undefined) {
1919
- return;
1920
- }
1921
-
1922
- this.manager = dragDropManager;
1923
- this.handlerMonitor = createMonitor(dragDropManager);
1924
- this.handlerConnector = createConnector(dragDropManager.getBackend());
1925
- this.handler = createHandler(this.handlerMonitor, this.decoratedRef);
1926
- }
1927
- }]);
1928
-
1929
- return DragDropContainer;
1930
- }(Component);
1931
-
1932
- _defineProperty$2(DragDropContainer, "DecoratedComponent", DecoratedComponent);
1933
-
1934
- _defineProperty$2(DragDropContainer, "displayName", "".concat(containerDisplayName, "(").concat(displayName, ")"));
1935
-
1936
- return hoistStatics(DragDropContainer, DecoratedComponent);
1937
- }
1938
-
1939
- function _classCallCheck$1(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
1940
-
1941
- function _defineProperties$1(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
1942
-
1943
- function _createClass$1(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties$1(Constructor.prototype, protoProps); if (staticProps) _defineProperties$1(Constructor, staticProps); return Constructor; }
1944
-
1945
- function _defineProperty$1(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
1946
- var ALLOWED_SPEC_METHODS$1 = ['canDrag', 'beginDrag', 'isDragging', 'endDrag'];
1947
- var REQUIRED_SPEC_METHODS = ['beginDrag'];
1948
-
1949
- var SourceImpl = /*#__PURE__*/function () {
1950
- function SourceImpl(spec, monitor, ref) {
1951
- var _this = this;
1952
-
1953
- _classCallCheck$1(this, SourceImpl);
1954
-
1955
- _defineProperty$1(this, "props", null);
1956
-
1957
- _defineProperty$1(this, "spec", void 0);
1958
-
1959
- _defineProperty$1(this, "monitor", void 0);
1960
-
1961
- _defineProperty$1(this, "ref", void 0);
1962
-
1963
- _defineProperty$1(this, "beginDrag", function () {
1964
- if (!_this.props) {
1965
- return;
1966
- }
1967
-
1968
- var item = _this.spec.beginDrag(_this.props, _this.monitor, _this.ref.current);
1969
-
1970
- if (process.env.NODE_ENV !== 'production') {
1971
- invariant(isPlainObject(item), 'beginDrag() must return a plain object that represents the dragged item. ' + 'Instead received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', item);
1972
- }
1973
-
1974
- return item;
1975
- });
1976
-
1977
- this.spec = spec;
1978
- this.monitor = monitor;
1979
- this.ref = ref;
1980
- }
1981
-
1982
- _createClass$1(SourceImpl, [{
1983
- key: "receiveProps",
1984
- value: function receiveProps(props) {
1985
- this.props = props;
1986
- }
1987
- }, {
1988
- key: "canDrag",
1989
- value: function canDrag() {
1990
- if (!this.props) {
1991
- return false;
1992
- }
1993
-
1994
- if (!this.spec.canDrag) {
1995
- return true;
1996
- }
1997
-
1998
- return this.spec.canDrag(this.props, this.monitor);
1999
- }
2000
- }, {
2001
- key: "isDragging",
2002
- value: function isDragging(globalMonitor, sourceId) {
2003
- if (!this.props) {
2004
- return false;
2005
- }
2006
-
2007
- if (!this.spec.isDragging) {
2008
- return sourceId === globalMonitor.getSourceId();
2009
- }
2010
-
2011
- return this.spec.isDragging(this.props, this.monitor);
2012
- }
2013
- }, {
2014
- key: "endDrag",
2015
- value: function endDrag() {
2016
- if (!this.props) {
2017
- return;
2018
- }
2019
-
2020
- if (!this.spec.endDrag) {
2021
- return;
2022
- }
2023
-
2024
- this.spec.endDrag(this.props, this.monitor, getDecoratedComponent(this.ref));
2025
- }
2026
- }]);
2027
-
2028
- return SourceImpl;
2029
- }();
2030
-
2031
- function createSourceFactory(spec) {
2032
- Object.keys(spec).forEach(function (key) {
2033
- invariant(ALLOWED_SPEC_METHODS$1.indexOf(key) > -1, 'Expected the drag source specification to only have ' + 'some of the following keys: %s. ' + 'Instead received a specification with an unexpected "%s" key. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', ALLOWED_SPEC_METHODS$1.join(', '), key);
2034
- invariant(typeof spec[key] === 'function', 'Expected %s in the drag source specification to be a function. ' + 'Instead received a specification with %s: %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', key, key, spec[key]);
2035
- });
2036
- REQUIRED_SPEC_METHODS.forEach(function (key) {
2037
- invariant(typeof spec[key] === 'function', 'Expected %s in the drag source specification to be a function. ' + 'Instead received a specification with %s: %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', key, key, spec[key]);
2038
- });
2039
- return function createSource(monitor, ref) {
2040
- return new SourceImpl(spec, monitor, ref);
2041
- };
2042
- }
2043
-
2044
- /**
2045
- * Decorates a component as a dragsource
2046
- * @param type The dragsource type
2047
- * @param spec The drag source specification
2048
- * @param collect The props collector function
2049
- * @param options DnD options
2050
- */
2051
-
2052
- function DragSource(type, spec, collect) {
2053
- var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
2054
- checkDecoratorArguments('DragSource', 'type, spec, collect[, options]', type, spec, collect, options);
2055
- var getType = type;
2056
-
2057
- if (typeof type !== 'function') {
2058
- invariant(isValidType(type), 'Expected "type" provided as the first argument to DragSource to be ' + 'a string, or a function that returns a string given the current props. ' + 'Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', type);
2059
-
2060
- getType = function getType() {
2061
- return type;
2062
- };
2063
- }
2064
-
2065
- invariant(isPlainObject(spec), 'Expected "spec" provided as the second argument to DragSource to be ' + 'a plain object. Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', spec);
2066
- var createSource = createSourceFactory(spec);
2067
- invariant(typeof collect === 'function', 'Expected "collect" provided as the third argument to DragSource to be ' + 'a function that returns a plain object of props to inject. ' + 'Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', collect);
2068
- invariant(isPlainObject(options), 'Expected "options" provided as the fourth argument to DragSource to be ' + 'a plain object when specified. ' + 'Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drag-source', collect);
2069
- return function decorateSource(DecoratedComponent) {
2070
- return decorateHandler({
2071
- containerDisplayName: 'DragSource',
2072
- createHandler: createSource,
2073
- registerHandler: registerSource,
2074
- createConnector: function createConnector(backend) {
2075
- return new SourceConnector(backend);
2076
- },
2077
- createMonitor: function createMonitor(manager) {
2078
- return new DragSourceMonitorImpl(manager);
2079
- },
2080
- DecoratedComponent: DecoratedComponent,
2081
- getType: getType,
2082
- collect: collect,
2083
- options: options
2084
- });
2085
- };
2086
- }
2087
-
2088
- function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
2089
-
2090
- function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
2091
-
2092
- function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
2093
-
2094
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
2095
- var ALLOWED_SPEC_METHODS = ['canDrop', 'hover', 'drop'];
2096
-
2097
- var TargetImpl = /*#__PURE__*/function () {
2098
- function TargetImpl(spec, monitor, ref) {
2099
- _classCallCheck(this, TargetImpl);
2100
-
2101
- _defineProperty(this, "props", null);
2102
-
2103
- _defineProperty(this, "spec", void 0);
2104
-
2105
- _defineProperty(this, "monitor", void 0);
2106
-
2107
- _defineProperty(this, "ref", void 0);
2108
-
2109
- this.spec = spec;
2110
- this.monitor = monitor;
2111
- this.ref = ref;
2112
- }
2113
-
2114
- _createClass(TargetImpl, [{
2115
- key: "receiveProps",
2116
- value: function receiveProps(props) {
2117
- this.props = props;
2118
- }
2119
- }, {
2120
- key: "receiveMonitor",
2121
- value: function receiveMonitor(monitor) {
2122
- this.monitor = monitor;
2123
- }
2124
- }, {
2125
- key: "canDrop",
2126
- value: function canDrop() {
2127
- if (!this.spec.canDrop) {
2128
- return true;
2129
- }
2130
-
2131
- return this.spec.canDrop(this.props, this.monitor);
2132
- }
2133
- }, {
2134
- key: "hover",
2135
- value: function hover() {
2136
- if (!this.spec.hover || !this.props) {
2137
- return;
2138
- }
2139
-
2140
- this.spec.hover(this.props, this.monitor, getDecoratedComponent(this.ref));
2141
- }
2142
- }, {
2143
- key: "drop",
2144
- value: function drop() {
2145
- if (!this.spec.drop) {
2146
- return undefined;
2147
- }
2148
-
2149
- var dropResult = this.spec.drop(this.props, this.monitor, this.ref.current);
2150
-
2151
- if (process.env.NODE_ENV !== 'production') {
2152
- invariant(typeof dropResult === 'undefined' || isPlainObject(dropResult), 'drop() must either return undefined, or an object that represents the drop result. ' + 'Instead received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target', dropResult);
2153
- }
2154
-
2155
- return dropResult;
2156
- }
2157
- }]);
2158
-
2159
- return TargetImpl;
2160
- }();
2161
-
2162
- function createTargetFactory(spec) {
2163
- Object.keys(spec).forEach(function (key) {
2164
- invariant(ALLOWED_SPEC_METHODS.indexOf(key) > -1, 'Expected the drop target specification to only have ' + 'some of the following keys: %s. ' + 'Instead received a specification with an unexpected "%s" key. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target', ALLOWED_SPEC_METHODS.join(', '), key);
2165
- invariant(typeof spec[key] === 'function', 'Expected %s in the drop target specification to be a function. ' + 'Instead received a specification with %s: %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target', key, key, spec[key]);
2166
- });
2167
- return function createTarget(monitor, ref) {
2168
- return new TargetImpl(spec, monitor, ref);
2169
- };
2170
- }
2171
-
2172
- /**
2173
- * @param type The accepted target type
2174
- * @param spec The DropTarget specification
2175
- * @param collect The props collector function
2176
- * @param options Options
2177
- */
2178
-
2179
- function DropTarget(type, spec, collect) {
2180
- var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
2181
- checkDecoratorArguments('DropTarget', 'type, spec, collect[, options]', type, spec, collect, options);
2182
- var getType = type;
2183
-
2184
- if (typeof type !== 'function') {
2185
- invariant(isValidType(type, true), 'Expected "type" provided as the first argument to DropTarget to be ' + 'a string, an array of strings, or a function that returns either given ' + 'the current props. Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target', type);
2186
-
2187
- getType = function getType() {
2188
- return type;
2189
- };
2190
- }
2191
-
2192
- invariant(isPlainObject(spec), 'Expected "spec" provided as the second argument to DropTarget to be ' + 'a plain object. Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target', spec);
2193
- var createTarget = createTargetFactory(spec);
2194
- invariant(typeof collect === 'function', 'Expected "collect" provided as the third argument to DropTarget to be ' + 'a function that returns a plain object of props to inject. ' + 'Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target', collect);
2195
- invariant(isPlainObject(options), 'Expected "options" provided as the fourth argument to DropTarget to be ' + 'a plain object when specified. ' + 'Instead, received %s. ' + 'Read more: http://react-dnd.github.io/react-dnd/docs/api/drop-target', collect);
2196
- return function decorateTarget(DecoratedComponent) {
2197
- return decorateHandler({
2198
- containerDisplayName: 'DropTarget',
2199
- createHandler: createTarget,
2200
- registerHandler: registerTarget,
2201
- createMonitor: function createMonitor(manager) {
2202
- return new DropTargetMonitorImpl(manager);
2203
- },
2204
- createConnector: function createConnector(backend) {
2205
- return new TargetConnector(backend);
2206
- },
2207
- DecoratedComponent: DecoratedComponent,
2208
- getType: getType,
2209
- collect: collect,
2210
- options: options
2211
- });
2212
- };
2213
- }
2214
-
2215
- const log$3 = debug('@pie-element:categorize:configure:choice');
2216
- let canDrag = false;
2217
- class Row extends React__default.Component {
2218
- constructor(...args) {
2219
- super(...args);
2220
- this.state = {
2221
- dialog: {
2222
- open: false,
2223
- text: ''
2224
- }
2225
- };
2226
-
2227
- this.onRowTitleChange = rowIndex => value => {
2228
- const {
2229
- model,
2230
- onChange
2231
- } = this.props;
2232
-
2233
- const newModel = _extends({}, model);
2234
-
2235
- newModel.rows[rowIndex].title = value;
2236
- onChange(newModel);
2237
- };
2238
-
2239
- this.onRowValueChange = (rowIndex, rowValueIndex) => event => {
2240
- const {
2241
- model,
2242
- onChange
2243
- } = this.props;
2244
-
2245
- const newModel = _extends({}, model);
2246
-
2247
- if (model.choiceMode === 'radio') {
2248
- for (let i = 0; i < newModel.rows[rowIndex].values.length; i++) {
2249
- newModel.rows[rowIndex].values[i] = false;
2250
- }
2251
- }
2252
-
2253
- newModel.rows[rowIndex].values[rowValueIndex] = event.target.checked;
2254
- onChange(newModel);
2255
- };
2256
-
2257
- this.onDeleteRow = idx => () => {
2258
- const {
2259
- model,
2260
- onDeleteRow,
2261
- minQuestions
2262
- } = this.props;
2263
-
2264
- if (model.rows && model.rows.length === minQuestions) {
2265
- this.setState({
2266
- dialog: {
2267
- open: true,
2268
- text: `There should be at least ${minQuestions} question row` + (minQuestions > 1 ? 's' : '') + '.'
2269
- }
2270
- });
2271
- } else {
2272
- onDeleteRow(idx);
2273
- }
2274
- };
2275
-
2276
- this.onMouseDownOnHandle = () => {
2277
- canDrag = true;
2278
- };
2279
-
2280
- this.onMouseUpOnHandle = () => {
2281
- canDrag = false;
2282
- };
2283
- }
2284
-
2285
- componentDidMount() {
2286
- document.addEventListener('mouseup', this.onMouseUpOnHandle);
2287
- }
2288
-
2289
- render() {
2290
- const {
2291
- classes,
2292
- imageSupport,
2293
- connectDragSource,
2294
- connectDropTarget,
2295
- isDragging,
2296
- model,
2297
- row,
2298
- idx,
2299
- inputConfiguration = {},
2300
- toolbarOpts,
2301
- spellCheck,
2302
- error,
2303
- maxImageWidth,
2304
- maxImageHeight,
2305
- uploadSoundSupport,
2306
- mathMlOptions = {}
2307
- } = this.props;
2308
- const {
2309
- dialog
2310
- } = this.state;
2311
- const opacity = isDragging ? 0 : 1;
2312
- const filteredDefaultPlugins = (DEFAULT_PLUGINS || []).filter(p => p !== 'bulleted-list' && p !== 'numbered-list');
2313
- const content = /*#__PURE__*/React__default.createElement("div", {
2314
- style: {
2315
- opacity: opacity,
2316
- width: '100%'
2317
- }
2318
- }, /*#__PURE__*/React__default.createElement("span", {
2319
- itemID: 'handle',
2320
- className: classes.dragHandle,
2321
- onMouseDown: this.onMouseDownOnHandle
2322
- }, /*#__PURE__*/React__default.createElement(DragHandle, {
2323
- color: 'primary'
2324
- })), /*#__PURE__*/React__default.createElement("div", {
2325
- className: classes.rowContainer
2326
- }, /*#__PURE__*/React__default.createElement("div", {
2327
- className: classNames(classes.rowItem, classes.questionText)
2328
- }, /*#__PURE__*/React__default.createElement(EditableHtml, {
2329
- imageSupport: imageSupport,
2330
- autoWidthToolbar: true,
2331
- disableUnderline: true,
2332
- label: 'label',
2333
- markup: row.title,
2334
- onChange: this.onRowTitleChange(idx),
2335
- className: classes.editor,
2336
- pluginProps: inputConfiguration,
2337
- toolbarOpts: toolbarOpts,
2338
- activePlugins: filteredDefaultPlugins,
2339
- spellCheck: spellCheck,
2340
- maxImageWidth: maxImageWidth,
2341
- maxImageHeight: maxImageHeight,
2342
- uploadSoundSupport: uploadSoundSupport,
2343
- languageCharactersProps: [{
2344
- language: 'spanish'
2345
- }, {
2346
- language: 'special'
2347
- }],
2348
- error: error && error !== 'No correct response defined.',
2349
- mathMlOptions: mathMlOptions
2350
- })), row.values.map((rowValue, rowIdx) => /*#__PURE__*/React__default.createElement("div", {
2351
- key: rowIdx,
2352
- className: classes.rowItem
2353
- }, model.choiceMode === 'radio' ? /*#__PURE__*/React__default.createElement(Radio, {
2354
- className: classNames(classes.radioButton, classes.customColor, {
2355
- [classes.errorResponse]: error == null ? void 0 : error.includes('No correct response defined.')
2356
- }),
2357
- onChange: this.onRowValueChange(idx, rowIdx),
2358
- checked: rowValue === true
2359
- }) : /*#__PURE__*/React__default.createElement(Checkbox, {
2360
- onChange: this.onRowValueChange(idx, rowIdx),
2361
- checked: rowValue === true,
2362
- label: '',
2363
- error: error == null ? void 0 : error.includes('No correct response defined.')
2364
- }))), /*#__PURE__*/React__default.createElement("div", {
2365
- className: classes.deleteIcon
2366
- }, /*#__PURE__*/React__default.createElement(IconButton, {
2367
- onClick: this.onDeleteRow(idx),
2368
- "aria-label": "Delete"
2369
- }, /*#__PURE__*/React__default.createElement(Delete, null)))), error && /*#__PURE__*/React__default.createElement("div", {
2370
- className: classes.errorText
2371
- }, error), /*#__PURE__*/React__default.createElement("hr", {
2372
- className: classes.separator
2373
- }), /*#__PURE__*/React__default.createElement(AlertDialog, {
2374
- open: dialog.open,
2375
- title: "Warning",
2376
- text: dialog.text,
2377
- onConfirm: () => this.setState({
2378
- dialog: {
2379
- open: false
2380
- }
2381
- })
2382
- }));
2383
- return connectDragSource(connectDropTarget(content));
2384
- }
2385
-
2386
- }
2387
- Row.propTypes = {
2388
- classes: PropTypes.object.isRequired,
2389
- model: PropTypes.object.isRequired,
2390
- row: PropTypes.object.isRequired,
2391
- idx: PropTypes.number.isRequired,
2392
- isDragging: PropTypes.bool.isRequired,
2393
- maxImageWidth: PropTypes.object,
2394
- maxImageHeight: PropTypes.object,
2395
- onDeleteRow: PropTypes.func.isRequired,
2396
- onChange: PropTypes.func.isRequired,
2397
- connectDragSource: PropTypes.func.isRequired,
2398
- connectDropTarget: PropTypes.func.isRequired,
2399
- onMoveRow: PropTypes.func.isRequired,
2400
- imageSupport: PropTypes.shape({
2401
- add: PropTypes.func.isRequired,
2402
- delete: PropTypes.func.isRequired
2403
- }),
2404
- uploadSoundSupport: PropTypes.shape({
2405
- add: PropTypes.func.isRequired,
2406
- delete: PropTypes.func.isRequired
2407
- }),
2408
- inputConfiguration: PropTypes.object,
2409
- toolbarOpts: PropTypes.object,
2410
- error: PropTypes.string,
2411
- spellCheck: PropTypes.bool,
2412
- minQuestions: PropTypes.number
2413
- };
2414
- Row.defaultProps = {};
2415
-
2416
- const styles$2 = theme => ({
2417
- actions: {
2418
- padding: 0,
2419
- justifyContent: 'space-between'
2420
- },
2421
- choice: {
2422
- padding: theme.spacing.unit,
2423
- overflow: 'visible'
2424
- },
2425
- dragHandle: {
2426
- cursor: 'move'
2427
- },
2428
- dragDisabled: {
2429
- cursor: 'inherit'
2430
- },
2431
- container: {
2432
- marginTop: theme.spacing.unit * 2,
2433
- display: 'flex',
2434
- flexDirection: 'column'
2435
- },
2436
- rowContainer: {
2437
- marginTop: theme.spacing.unit * 2,
2438
- display: 'flex',
2439
- alignItems: 'center',
2440
- flex: 1
2441
- },
2442
- rowItem: {
2443
- flex: 1,
2444
- display: 'flex',
2445
- justifyContent: 'center',
2446
- alignItems: 'center',
2447
- minWidth: '120px',
2448
- padding: `0 ${theme.spacing.unit}px`
2449
- },
2450
- radioButton: {
2451
- '& input': {
2452
- width: '100% !important'
2453
- }
2454
- },
2455
- customColor: {
2456
- color: `${color.tertiary()} !important`
2457
- },
2458
- deleteIcon: {
2459
- flex: 0.5,
2460
- display: 'flex',
2461
- justifyContent: 'center',
2462
- minWidth: '45px',
2463
- padding: `0 ${theme.spacing.unit}px`
2464
- },
2465
- questionText: {
2466
- flex: 2,
2467
- display: 'flex',
2468
- justifyContent: 'flex-start',
2469
- padding: 0,
2470
- maxWidth: 'unset',
2471
- textAlign: 'left',
2472
- minWidth: '200px',
2473
- marginRight: theme.spacing.unit,
2474
- '&> div': {
2475
- width: '100%'
2476
- }
2477
- },
2478
- separator: {
2479
- marginTop: theme.spacing.unit * 2,
2480
- border: 0,
2481
- borderTop: `2px solid ${theme.palette.grey['A100']}`,
2482
- width: '100%'
2483
- },
2484
- errorText: {
2485
- fontSize: theme.typography.fontSize - 2,
2486
- color: theme.palette.error.main,
2487
- paddingTop: theme.spacing.unit
2488
- },
2489
- errorResponse: {
2490
- color: theme.palette.error.main
2491
- }
2492
- });
2493
-
2494
- const StyledRow = withStyles(styles$2)(Row);
2495
- const NAME = 'row-config';
2496
- const choiceSource = {
2497
- canDrag() {
2498
- return canDrag;
2499
- },
2500
-
2501
- beginDrag(props) {
2502
- return {
2503
- id: props.row.id,
2504
- index: props.idx
2505
- };
2506
- }
2507
-
2508
- };
2509
- const StyledSource = DragSource(NAME, choiceSource, (connect, monitor) => ({
2510
- connectDragSource: connect.dragSource(),
2511
- isDragging: monitor.isDragging()
2512
- }))(StyledRow);
2513
- const choiceTarget = {
2514
- hover() {
2515
- log$3('[hover]');
2516
- },
2517
-
2518
- drop(props, monitor) {
2519
- const item = monitor.getItem();
2520
- log$3('[drop] item: ', item, 'didDrop?', monitor.didDrop());
2521
- props.onMoveRow(item.index, props.idx);
2522
- }
2523
-
2524
- };
2525
- const StyledSourceAndTarget = DropTarget(NAME, choiceTarget, connect => ({
2526
- connectDropTarget: connect.dropTarget()
2527
- }))(StyledSource);
2528
-
2529
- const log$2 = debug('pie-elements:match:configure');
2530
-
2531
- const styles$1 = theme => ({
2532
- container: {
2533
- marginBottom: theme.spacing.unit * 2.5,
2534
- display: 'flex',
2535
- flexDirection: 'column'
2536
- },
2537
- rowContainer: {
2538
- display: 'flex',
2539
- alignItems: 'center',
2540
- flex: 1,
2541
- width: '100%',
2542
- borderBottom: `2px solid ${theme.palette.grey['A100']}`,
2543
- paddingBottom: theme.spacing.unit * 2,
2544
- marginTop: theme.spacing.unit * 2,
2545
- marginBottom: theme.spacing.unit
2546
- },
2547
- rowItem: {
2548
- flex: 1,
2549
- display: 'flex',
2550
- justifyContent: 'center',
2551
- alignItems: 'center',
2552
- flexDirection: 'column',
2553
- '&> div': {
2554
- width: '120px',
2555
- padding: `0 ${theme.spacing.unit}px`,
2556
- textAlign: 'center'
2557
- }
2558
- },
2559
- deleteIcon: {
2560
- flex: 0.5,
2561
- minWidth: '45px',
2562
- padding: `0 ${theme.spacing.unit}px`
2563
- },
2564
- questionText: {
2565
- flex: 2,
2566
- display: 'flex',
2567
- justifyContent: 'flex-start',
2568
- marginRight: theme.spacing.unit,
2569
- '&> div': {
2570
- width: '100%',
2571
- padding: 0,
2572
- maxWidth: 'unset',
2573
- textAlign: 'left',
2574
- minWidth: '200px'
2575
- }
2576
- },
2577
- rowTable: {
2578
- display: 'flex',
2579
- flexDirection: 'column'
2580
- },
2581
- headerInput: {
2582
- '&> div': {
2583
- fontWeight: 'bold'
2584
- }
2585
- },
2586
- marginBottom: {
2587
- marginBottom: theme.typography.fontSize - 2 + theme.spacing.unit
2588
- },
2589
- columnErrorText: {
2590
- fontSize: theme.typography.fontSize - 2,
2591
- color: theme.palette.error.main,
2592
- paddingTop: `${theme.spacing.unit}px !important`,
2593
- width: 'fit-content !important'
2594
- },
2595
- errorText: {
2596
- fontSize: theme.typography.fontSize - 2,
2597
- color: theme.palette.error.main,
2598
- paddingBottom: theme.spacing.unit
2599
- }
2600
- });
2601
-
2602
- class AnswerConfigBlock extends React.Component {
2603
- constructor(...args) {
2604
- super(...args);
2605
-
2606
- this.moveRow = (from, to) => {
2607
- const {
2608
- model,
2609
- onChange
2610
- } = this.props;
2611
-
2612
- const newModel = _extends({}, model);
2613
-
2614
- const rows = newModel.rows || [];
2615
- log$2('[moveRow]: ', from, to);
2616
- const {
2617
- movedRow,
2618
- remainingRows
2619
- } = rows.reduce((acc, item, index) => {
2620
- if (index === from) {
2621
- acc.movedRow = item;
2622
- } else {
2623
- acc.remainingRows.push(item);
2624
- }
2625
-
2626
- return acc;
2627
- }, {
2628
- movedRow: null,
2629
- remainingRows: []
2630
- });
2631
- const update = [...remainingRows.slice(0, to), movedRow, ...remainingRows.slice(to)];
2632
- log$2('update: ', update);
2633
- newModel.rows = update;
2634
- onChange(newModel);
2635
- };
2636
-
2637
- this.onChange = (name, isBoolean) => ({
2638
- target
2639
- }) => {
2640
- const {
2641
- model,
2642
- onChange
2643
- } = this.props;
2644
- let value;
2645
-
2646
- if (isBoolean) {
2647
- value = target.checked;
2648
- } else {
2649
- value = target.value;
2650
- }
2651
-
2652
- lodash.set(model, name, value);
2653
- onChange(model, name);
2654
- };
2655
-
2656
- this.onHeaderChange = headerIndex => value => {
2657
- const {
2658
- model,
2659
- onChange
2660
- } = this.props;
2661
-
2662
- const newModel = _extends({}, model);
2663
-
2664
- if (headerIndex === 0) {
2665
- newModel.headers[headerIndex] = value;
2666
- onChange(newModel);
2667
- return;
2668
- }
2669
-
2670
- newModel.headers[headerIndex] = value;
2671
- onChange(newModel);
2672
- };
2673
- }
2674
-
2675
- render() {
2676
- const {
2677
- classes,
2678
- model,
2679
- onAddRow,
2680
- imageSupport,
2681
- configuration,
2682
- toolbarOpts,
2683
- spellCheck,
2684
- uploadSoundSupport
2685
- } = this.props;
2686
- const {
2687
- baseInputConfiguration = {},
2688
- headers = {},
2689
- rows = {},
2690
- maxImageWidth = {},
2691
- maxImageHeight = {},
2692
- mathMlOptions = {},
2693
- minQuestions
2694
- } = configuration || {};
2695
- const {
2696
- errors
2697
- } = model || {};
2698
- const {
2699
- correctResponseError,
2700
- rowsErrors,
2701
- columnsErrors,
2702
- noOfRowsError,
2703
- columnsLengthError
2704
- } = errors || {};
2705
- const filteredDefaultPlugins = (DEFAULT_PLUGINS || []).filter(p => p !== 'table' && p !== 'bulleted-list' && p !== 'numbered-list');
2706
- const defaultImageMaxWidth = maxImageWidth && maxImageWidth.prompt;
2707
- const defaultImageMaxHeight = maxImageHeight && maxImageHeight.prompt;
2708
- return /*#__PURE__*/React.createElement("div", {
2709
- className: classes.container
2710
- }, /*#__PURE__*/React.createElement(Typography, {
2711
- type: "body1",
2712
- component: "div"
2713
- }, "Click on the labels to edit or remove. Set the correct answers by clicking each correct answer per row."), /*#__PURE__*/React.createElement("div", {
2714
- className: classes.rowTable,
2715
- style: configuration.width ? {
2716
- width: configuration.width,
2717
- overflow: 'scroll'
2718
- } : {}
2719
- }, /*#__PURE__*/React.createElement("div", {
2720
- className: classes.rowContainer
2721
- }, headers.settings && (model.headers || []).map((header, idx) => /*#__PURE__*/React.createElement("div", {
2722
- key: idx,
2723
- className: classNames(classes.rowItem, {
2724
- [classes.questionText]: idx === 0
2725
- })
2726
- }, /*#__PURE__*/React.createElement(EditableHtml, {
2727
- onChange: this.onHeaderChange(idx),
2728
- markup: header,
2729
- className: columnsErrors && !columnsErrors[idx] ? classes.marginBottom : classes.headerInput,
2730
- label: 'column label',
2731
- activePlugins: filteredDefaultPlugins,
2732
- pluginProps: getPluginProps(headers == null ? void 0 : headers.inputConfiguration, baseInputConfiguration),
2733
- autoWidthToolbar: true,
2734
- spellCheck: spellCheck,
2735
- uploadSoundSupport: uploadSoundSupport,
2736
- languageCharactersProps: [{
2737
- language: 'spanish'
2738
- }, {
2739
- language: 'special'
2740
- }],
2741
- error: columnsErrors && columnsErrors[idx]
2742
- }), columnsErrors && columnsErrors[idx] && /*#__PURE__*/React.createElement("div", {
2743
- className: classes.columnErrorText
2744
- }, columnsErrors[idx]))), /*#__PURE__*/React.createElement("div", {
2745
- className: classes.deleteIcon
2746
- })), model.rows.map((row, idx) => /*#__PURE__*/React.createElement(StyledSourceAndTarget, {
2747
- key: idx,
2748
- model: model,
2749
- row: row,
2750
- idx: idx,
2751
- onDeleteRow: this.props.onDeleteRow,
2752
- onChange: this.props.onChange,
2753
- onMoveRow: this.moveRow,
2754
- imageSupport: imageSupport,
2755
- toolbarOpts: toolbarOpts,
2756
- spellCheck: spellCheck,
2757
- error: rowsErrors == null ? void 0 : rowsErrors[row.id],
2758
- maxImageWidth: maxImageWidth && maxImageWidth.rowTitles || defaultImageMaxWidth,
2759
- maxImageHeight: maxImageHeight && maxImageHeight.rowTitles || defaultImageMaxHeight,
2760
- uploadSoundSupport: uploadSoundSupport,
2761
- mathMlOptions: mathMlOptions,
2762
- minQuestions: minQuestions,
2763
- inputConfiguration: getPluginProps(rows == null ? void 0 : rows.inputConfiguration, baseInputConfiguration)
2764
- })), correctResponseError && /*#__PURE__*/React.createElement("div", {
2765
- className: classes.errorText
2766
- }, correctResponseError), noOfRowsError && /*#__PURE__*/React.createElement("div", {
2767
- className: classes.errorText
2768
- }, noOfRowsError), columnsLengthError && /*#__PURE__*/React.createElement("div", {
2769
- className: classes.errorText
2770
- }, columnsLengthError), /*#__PURE__*/React.createElement(AddRow, {
2771
- onAddClick: onAddRow
2772
- })));
2773
- }
2774
-
2775
- }
2776
-
2777
- AnswerConfigBlock.propTypes = {
2778
- classes: PropTypes.object.isRequired,
2779
- model: PropTypes.object.isRequired,
2780
- configuration: PropTypes.object.isRequired,
2781
- onChange: PropTypes.func.isRequired,
2782
- onDeleteRow: PropTypes.func.isRequired,
2783
- onAddRow: PropTypes.func.isRequired,
2784
- imageSupport: PropTypes.shape({
2785
- add: PropTypes.func.isRequired,
2786
- delete: PropTypes.func.isRequired
2787
- }),
2788
- uploadSoundSupport: PropTypes.shape({
2789
- add: PropTypes.func.isRequired,
2790
- delete: PropTypes.func.isRequired
2791
- }),
2792
- toolbarOpts: PropTypes.object,
2793
- spellCheck: PropTypes.bool
2794
- };
2795
- var AnswerConfigBlock$1 = withStyles(styles$1)(AnswerConfigBlock);
2796
-
2797
- const log$1 = debug('@pie-element:match:configure');
2798
- const {
2799
- Panel,
2800
- toggle,
2801
- radio,
2802
- dropdown
2803
- } = settings;
2804
-
2805
- const styles = theme => ({
2806
- promptHolder: {
2807
- width: '100%',
2808
- paddingTop: theme.spacing.unit * 2,
2809
- marginBottom: theme.spacing.unit * 2
2810
- },
2811
- errorText: {
2812
- fontSize: theme.typography.fontSize - 2,
2813
- color: theme.palette.error.main,
2814
- paddingTop: theme.spacing.unit
2815
- }
2816
- });
2817
-
2818
- class Configure extends React__default.Component {
2819
- constructor(props) {
2820
- super(props);
2821
-
2822
- this.onTabChange = (event, value) => {
2823
- this.setState({
2824
- activeTab: value
2825
- });
2826
- };
2827
-
2828
- this.onChangeTabIndex = index => {
2829
- this.setState({
2830
- activeTab: index
2831
- });
2832
- };
2833
-
2834
- this.onChange = model => {
2835
- this.props.onModelChanged(model);
2836
- };
2837
-
2838
- this.onFeedbackChange = feedback => {
2839
- const {
2840
- model,
2841
- onModelChanged
2842
- } = this.props;
2843
- model.feedback = feedback;
2844
- onModelChanged(model);
2845
- };
2846
-
2847
- this.onDeleteRow = rowIndex => {
2848
- const {
2849
- model
2850
- } = this.props;
2851
-
2852
- const newModel = _extends({}, model);
2853
-
2854
- newModel.rows.splice(rowIndex, 1);
2855
- this.onChange(newModel);
2856
- };
2857
-
2858
- this.onAddRow = () => {
2859
- const {
2860
- model,
2861
- configuration
2862
- } = this.props;
2863
-
2864
- const newModel = _extends({}, model);
2865
-
2866
- const {
2867
- maxQuestions
2868
- } = configuration || {};
2869
-
2870
- if (maxQuestions && (newModel.rows || []).length >= maxQuestions) {
2871
- this.setState({
2872
- dialog: {
2873
- open: true,
2874
- text: `There can be maximum ${maxQuestions} question row` + (maxQuestions > 1 ? 's' : '') + '.'
2875
- }
2876
- });
2877
- return;
2878
- }
2879
-
2880
- newModel.rows = newModel.rows.concat({
2881
- id: this.rowIdCounter + 1,
2882
- title: `Question Text ${(newModel.rows || []).length + 1}`,
2883
- values: new Array(model.layout - 1).fill(false)
2884
- });
2885
- this.rowIdCounter += 1;
2886
- this.onChange(newModel);
2887
- };
2888
-
2889
- this.onLayoutChange = newLayout => {
2890
- const {
2891
- model
2892
- } = this.props;
2893
- const oldLayout = model.layout;
2894
-
2895
- const newModel = _extends({}, model);
2896
-
2897
- if (newLayout > oldLayout) {
2898
- for (let i = 0; i < newLayout - oldLayout; i++) {
2899
- newModel.headers.push(`Column ${newModel.headers.length + 1}`);
2900
- }
2901
-
2902
- newModel.rows.forEach(row => {
2903
- for (let i = 0; i < newLayout - oldLayout; i++) {
2904
- row.values.push(false);
2905
- }
2906
- });
2907
- } else if (newLayout < oldLayout) {
2908
- newModel.headers.splice(newLayout);
2909
- newModel.rows.forEach(row => {
2910
- row.values.splice(newLayout - 1);
2911
- });
2912
- }
2913
-
2914
- newModel.layout = newLayout;
2915
- this.onChange(newModel);
2916
- };
2917
-
2918
- this.onResponseTypeChange = newChoiceMode => {
2919
- const {
2920
- model
2921
- } = this.props;
2922
-
2923
- const newModel = _extends({}, model); // if we're switching to radio and we have more than one true, reset
2924
-
2925
-
2926
- if (newChoiceMode === 'radio') {
2927
- newModel.rows.forEach(row => {
2928
- const trueCount = row.values.reduce((total, current) => current === true ? total + 1 : total);
2929
-
2930
- if (trueCount > 1) {
2931
- row.values = new Array(model.layout - 1).fill(false);
2932
- }
2933
- });
2934
- }
2935
-
2936
- newModel.choiceMode = newChoiceMode;
2937
- this.onChange(newModel);
2938
- };
2939
-
2940
- this.onPartialScoringChange = partialScoring => {
2941
- this.props.model.partialScoring = partialScoring;
2942
- this.props.onModelChanged(this.props.model);
2943
- };
2944
-
2945
- this.onPromptChanged = prompt => {
2946
- this.props.onModelChanged(_extends({}, this.props.model, {
2947
- prompt
2948
- }));
2949
- };
2950
-
2951
- this.onTeacherInstructionsChanged = teacherInstructions => {
2952
- this.props.onModelChanged(_extends({}, this.props.model, {
2953
- teacherInstructions
2954
- }));
2955
- };
2956
-
2957
- this.onRationaleChanged = rationale => {
2958
- this.props.onModelChanged(_extends({}, this.props.model, {
2959
- rationale
2960
- }));
2961
- };
2962
-
2963
- let maxId = 0;
2964
-
2965
- if (props.model.rows && props.model.rows.length > 0) {
2966
- maxId = Math.max(...props.model.rows.map(row => row.id));
2967
- }
2968
-
2969
- this.rowIdCounter = maxId + 1;
2970
- this.state = {
2971
- activeTab: 0,
2972
- dialog: {
2973
- open: false,
2974
- text: ''
2975
- }
2976
- };
2977
- }
2978
-
2979
- componentDidMount() {
2980
- const {
2981
- updatedRows,
2982
- wasChanged
2983
- } = this.validateRowsID(this.props.model.rows);
2984
-
2985
- if (wasChanged) {
2986
- const newModel = _extends({}, this.props.model, {
2987
- rows: updatedRows
2988
- });
2989
-
2990
- this.props.onModelChanged(newModel);
2991
- }
2992
- }
2993
-
2994
- validateRowsID(rows) {
2995
- let wasChanged = false;
2996
- const updatedRows = (rows || []).map((row, index) => {
2997
- if (row.id !== index + 1) {
2998
- wasChanged = true;
2999
- return _extends({}, row, {
3000
- id: index + 1
3001
- });
3002
- }
3003
-
3004
- return row;
3005
- });
3006
- return {
3007
- updatedRows,
3008
- wasChanged
3009
- };
3010
- }
3011
-
3012
- render() {
3013
- const {
3014
- classes,
3015
- model,
3016
- imageSupport,
3017
- onModelChanged,
3018
- configuration,
3019
- onConfigurationChanged,
3020
- uploadSoundSupport
3021
- } = this.props;
3022
- const {
3023
- baseInputConfiguration = {},
3024
- contentDimensions = {},
3025
- feedback = {},
3026
- lockChoiceOrder = {},
3027
- maxImageWidth = {},
3028
- maxImageHeight = {},
3029
- partialScoring = {},
3030
- prompt = {},
3031
- rationale = {},
3032
- settingsPanelDisabled,
3033
- scoringType = {},
3034
- spellCheck = {},
3035
- studentInstructions = {},
3036
- teacherInstructions = {},
3037
- withRubric = {},
3038
- language = {},
3039
- languageChoices = {}
3040
- } = configuration || {};
3041
- const {
3042
- errors,
3043
- extraCSSRules,
3044
- feedbackEnabled,
3045
- promptEnabled,
3046
- rationaleEnabled,
3047
- spellCheckEnabled,
3048
- teacherInstructionsEnabled,
3049
- toolbarEditorPosition
3050
- } = model || {};
3051
- const {
3052
- prompt: promptError,
3053
- rationale: rationaleError,
3054
- teacherInstructions: teacherInstructionsError
3055
- } = errors || {};
3056
- const {
3057
- dialog
3058
- } = this.state;
3059
- const toolbarOpts = {
3060
- position: toolbarEditorPosition === 'top' ? 'top' : 'bottom'
3061
- };
3062
- const defaultImageMaxWidth = maxImageWidth && maxImageWidth.prompt;
3063
- const defaultImageMaxHeight = maxImageHeight && maxImageHeight.prompt;
3064
- const panelSettings = {
3065
- partialScoring: partialScoring.settings && toggle(partialScoring.label),
3066
- lockChoiceOrder: lockChoiceOrder.settings && toggle(lockChoiceOrder.label),
3067
- feedbackEnabled: feedback.settings && toggle(feedback.label),
3068
- 'language.enabled': language.settings && toggle(language.label, true),
3069
- language: language.settings && language.enabled && dropdown(languageChoices.label, languageChoices.options)
3070
- };
3071
- const panelProperties = {
3072
- teacherInstructionsEnabled: teacherInstructions.settings && toggle(teacherInstructions.label),
3073
- studentInstructionsEnabled: studentInstructions.settings && toggle(studentInstructions.label),
3074
- promptEnabled: prompt.settings && toggle(prompt.label),
3075
- rationaleEnabled: rationale.settings && toggle(rationale.label),
3076
- spellCheckEnabled: spellCheck.settings && toggle(spellCheck.label),
3077
- scoringType: scoringType.settings && radio(scoringType.label, ['auto', 'rubric']),
3078
- rubricEnabled: (withRubric == null ? void 0 : withRubric.settings) && toggle(withRubric == null ? void 0 : withRubric.label)
3079
- };
3080
- log$1('[render] model', model);
3081
- return /*#__PURE__*/React__default.createElement(layout.ConfigLayout, {
3082
- extraCSSRules: extraCSSRules,
3083
- dimensions: contentDimensions,
3084
- hideSettings: settingsPanelDisabled,
3085
- settings: /*#__PURE__*/React__default.createElement(Panel, {
3086
- model: model,
3087
- configuration: configuration,
3088
- onChangeModel: model => onModelChanged(model),
3089
- onChangeConfiguration: config => onConfigurationChanged(config),
3090
- groups: {
3091
- Settings: panelSettings,
3092
- Properties: panelProperties
3093
- }
3094
- })
3095
- }, teacherInstructionsEnabled && /*#__PURE__*/React__default.createElement(InputContainer, {
3096
- label: teacherInstructions.label,
3097
- className: classes.promptHolder
3098
- }, /*#__PURE__*/React__default.createElement(EditableHtml, {
3099
- className: classes.prompt,
3100
- markup: model.teacherInstructions || '',
3101
- onChange: this.onTeacherInstructionsChanged,
3102
- imageSupport: imageSupport,
3103
- error: teacherInstructionsError,
3104
- nonEmpty: false,
3105
- toolbarOpts: toolbarOpts,
3106
- pluginProps: getPluginProps(teacherInstructions == null ? void 0 : teacherInstructions.inputConfiguration, baseInputConfiguration),
3107
- spellCheck: spellCheckEnabled,
3108
- maxImageWidth: maxImageWidth && maxImageWidth.teacherInstructions || defaultImageMaxWidth,
3109
- maxImageHeight: maxImageHeight && maxImageHeight.teacherInstructions || defaultImageMaxHeight,
3110
- uploadSoundSupport: uploadSoundSupport,
3111
- languageCharactersProps: [{
3112
- language: 'spanish'
3113
- }, {
3114
- language: 'special'
3115
- }]
3116
- }), teacherInstructionsError && /*#__PURE__*/React__default.createElement("div", {
3117
- className: classes.errorText
3118
- }, teacherInstructionsError)), promptEnabled && /*#__PURE__*/React__default.createElement(InputContainer, {
3119
- label: prompt.label,
3120
- className: classes.promptHolder
3121
- }, /*#__PURE__*/React__default.createElement(EditableHtml, {
3122
- className: classes.prompt,
3123
- markup: model.prompt,
3124
- onChange: this.onPromptChanged,
3125
- imageSupport: imageSupport,
3126
- error: promptError,
3127
- nonEmpty: false,
3128
- disableUnderline: true,
3129
- toolbarOpts: toolbarOpts,
3130
- pluginProps: getPluginProps(prompt == null ? void 0 : prompt.inputConfiguration, baseInputConfiguration),
3131
- spellCheck: spellCheckEnabled,
3132
- maxImageWidth: maxImageWidth && maxImageWidth.prompt,
3133
- maxImageHeight: maxImageHeight && maxImageHeight.prompt,
3134
- uploadSoundSupport: uploadSoundSupport,
3135
- languageCharactersProps: [{
3136
- language: 'spanish'
3137
- }, {
3138
- language: 'special'
3139
- }]
3140
- }), promptError && /*#__PURE__*/React__default.createElement("div", {
3141
- className: classes.errorText
3142
- }, promptError)), /*#__PURE__*/React__default.createElement(GeneralConfigBlock$1, {
3143
- model: model,
3144
- configuration: configuration,
3145
- onResponseTypeChange: this.onResponseTypeChange,
3146
- onLayoutChange: this.onLayoutChange
3147
- }), /*#__PURE__*/React__default.createElement(AnswerConfigBlock$1, {
3148
- model: model,
3149
- configuration: configuration,
3150
- imageSupport: imageSupport,
3151
- onChange: this.onChange,
3152
- onAddRow: this.onAddRow,
3153
- onDeleteRow: this.onDeleteRow,
3154
- toolbarOpts: toolbarOpts,
3155
- spellCheck: spellCheckEnabled,
3156
- uploadSoundSupport: uploadSoundSupport
3157
- }), rationaleEnabled && /*#__PURE__*/React__default.createElement(InputContainer, {
3158
- label: rationale.label,
3159
- className: classes.promptHolder
3160
- }, /*#__PURE__*/React__default.createElement(EditableHtml, {
3161
- className: classes.prompt,
3162
- markup: model.rationale || '',
3163
- onChange: this.onRationaleChanged,
3164
- imageSupport: imageSupport,
3165
- error: rationaleError,
3166
- toolbarOpts: toolbarOpts,
3167
- pluginProps: getPluginProps(rationale == null ? void 0 : rationale.inputConfiguration, baseInputConfiguration),
3168
- spellCheck: spellCheckEnabled,
3169
- maxImageWidth: maxImageWidth && maxImageWidth.rationale || defaultImageMaxWidth,
3170
- maxImageHeight: maxImageHeight && maxImageHeight.rationale || defaultImageMaxHeight,
3171
- uploadSoundSupport: uploadSoundSupport,
3172
- languageCharactersProps: [{
3173
- language: 'spanish'
3174
- }, {
3175
- language: 'special'
3176
- }]
3177
- }), rationaleError && /*#__PURE__*/React__default.createElement("div", {
3178
- className: classes.errorText
3179
- }, rationaleError)), feedbackEnabled && /*#__PURE__*/React__default.createElement(FeedbackConfig, {
3180
- feedback: model.feedback,
3181
- onChange: this.onFeedbackChange,
3182
- toolbarOpts: toolbarOpts
3183
- }), /*#__PURE__*/React__default.createElement(AlertDialog, {
3184
- open: dialog.open,
3185
- title: "Warning",
3186
- text: dialog.text,
3187
- onConfirm: () => this.setState({
3188
- dialog: {
3189
- open: false
3190
- }
3191
- })
3192
- }));
3193
- }
3194
-
3195
- }
3196
-
3197
- Configure.propTypes = {
3198
- onModelChanged: PropTypes.func,
3199
- onConfigurationChanged: PropTypes.func,
3200
- classes: PropTypes.object,
3201
- model: PropTypes.object.isRequired,
3202
- configuration: PropTypes.object.isRequired,
3203
- imageSupport: PropTypes.shape({
3204
- add: PropTypes.func.isRequired,
3205
- delete: PropTypes.func.isRequired
3206
- }),
3207
- uploadSoundSupport: PropTypes.shape({
3208
- add: PropTypes.func.isRequired,
3209
- delete: PropTypes.func.isRequired
3210
- })
3211
- };
3212
- Configure.defaultProps = {
3213
- classes: {}
3214
- };
3215
- var Configure$1 = withDragContext(withStyles(styles)(Configure));
3216
-
3217
- /** NOTE: teacherInstructions, studentInstructions, rationale & scoringType
3218
- * functionalities are not defined yet - the value for those can belong to
3219
- * model or to configuration
3220
- */
3221
- var defaultValues = {
3222
- model: {
3223
- choiceMode: 'radio',
3224
- feedbackEnabled: false,
3225
- headers: ['Column 1', 'Column 2', 'Column 3'],
3226
- layout: 3,
3227
- lockChoiceOrder: true,
3228
- partialScoring: false,
3229
- prompt: '',
3230
- promptEnabled: true,
3231
- rationale: '',
3232
- rationaleEnabled: true,
3233
- rows: [],
3234
- scoringType: 'auto',
3235
- studentInstructionsEnabled: true,
3236
- teacherInstructions: '',
3237
- teacherInstructionsEnabled: true,
3238
- toolbarEditorPosition: 'bottom'
3239
- },
3240
- configuration: {
3241
- baseInputConfiguration: {
3242
- audio: {
3243
- disabled: false
3244
- },
3245
- video: {
3246
- disabled: false
3247
- },
3248
- image: {
3249
- disabled: false
3250
- },
3251
- textAlign: {
3252
- disabled: true
3253
- },
3254
- showParagraphs: {
3255
- disabled: false
3256
- },
3257
- separateParagraphs: {
3258
- disabled: true
3259
- }
3260
- },
3261
- rows: {
3262
- inputConfiguration: {
3263
- audio: {
3264
- disabled: true
3265
- },
3266
- video: {
3267
- disabled: true
3268
- },
3269
- image: {
3270
- disabled: false
3271
- }
3272
- }
3273
- },
3274
- feedback: {
3275
- settings: true,
3276
- label: 'Feedback',
3277
- enabled: true
3278
- },
3279
- headers: {
3280
- settings: true,
3281
- inputConfiguration: {
3282
- audio: {
3283
- disabled: true
3284
- },
3285
- video: {
3286
- disabled: true
3287
- },
3288
- image: {
3289
- disabled: false
3290
- }
3291
- }
3292
- },
3293
- layout: {
3294
- settings: true,
3295
- label: 'Layout'
3296
- },
3297
- lockChoiceOrder: {
3298
- settings: false,
3299
- label: 'Lock Choice Order'
3300
- },
3301
- partialScoring: {
3302
- settings: false,
3303
- label: 'Allow Partial Scoring'
3304
- },
3305
- choiceMode: {
3306
- settings: true,
3307
- label: 'Response Type'
3308
- },
3309
- prompt: {
3310
- settings: true,
3311
- label: 'Prompt',
3312
- inputConfiguration: {
3313
- audio: {
3314
- disabled: false
3315
- },
3316
- video: {
3317
- disabled: false
3318
- },
3319
- image: {
3320
- disabled: false
3321
- }
3322
- },
3323
- required: false
3324
- },
3325
- rationale: {
3326
- settings: true,
3327
- label: 'Rationale',
3328
- inputConfiguration: {
3329
- audio: {
3330
- disabled: false
3331
- },
3332
- video: {
3333
- disabled: false
3334
- },
3335
- image: {
3336
- disabled: false
3337
- }
3338
- },
3339
- required: false
3340
- },
3341
- settingsPanelDisabled: false,
3342
- spellCheck: {
3343
- label: 'Spellcheck',
3344
- settings: false,
3345
- enabled: true
3346
- },
3347
- scoringType: {
3348
- settings: false,
3349
- label: 'Scoring Type'
3350
- },
3351
- studentInstructions: {
3352
- settings: false,
3353
- label: 'Student Instructions'
3354
- },
3355
- teacherInstructions: {
3356
- settings: true,
3357
- label: 'Teacher Instructions',
3358
- inputConfiguration: {
3359
- audio: {
3360
- disabled: false
3361
- },
3362
- video: {
3363
- disabled: false
3364
- },
3365
- image: {
3366
- disabled: false
3367
- }
3368
- },
3369
- required: false
3370
- },
3371
- maxImageWidth: {
3372
- teacherInstructions: 300,
3373
- prompt: 300,
3374
- rationale: 300,
3375
- rowTitles: 300
3376
- },
3377
- maxImageHeight: {
3378
- teacherInstructions: 300,
3379
- prompt: 300,
3380
- rationale: 300,
3381
- rowTitles: 150
3382
- },
3383
- withRubric: {
3384
- settings: false,
3385
- label: 'Add Rubric'
3386
- },
3387
- minQuestions: 2,
3388
- maxQuestions: 5,
3389
- maxLengthQuestionsHeading: 100,
3390
- maxAnswers: 5,
3391
- maxLengthAnswers: 100,
3392
- maxLengthFirstColumnHeading: 100,
3393
- mathMlOptions: {
3394
- mmlOutput: false,
3395
- mmlEditing: false
3396
- },
3397
- language: {
3398
- settings: false,
3399
- label: 'Specify Language',
3400
- enabled: false
3401
- },
3402
- languageChoices: {
3403
- label: 'Language Choices',
3404
- options: []
3405
- }
3406
- }
3407
- };
3408
-
3409
- const log = debug('pie-elements:match:configure');
3410
- class MatchConfigure extends HTMLElement {
3411
- constructor() {
3412
- super();
3413
-
3414
- this.resetModelAfterConfigurationIsSet = () => {
3415
- // In environments that use pie-player-components, model is set before configuration.
3416
- // This is the reason why sometimes the model gets altered non-reversible
3417
- // (altered using default configuration instead of client configuration, because at that point client configuration was not set yet)
3418
- // Therefore, in such environments, we will make sure to keep a modelCopy (initialised in set model) and use it to reset
3419
- // the model in set configuration (resetModelAfterConfigurationIsSet) if set configuration is ever called
3420
- const pieAuthors = document.querySelectorAll('pie-author');
3421
- this.hasPlayerAsParent = Array.from(pieAuthors).some(author => author.contains(this));
3422
-
3423
- if (this.hasPlayerAsParent) {
3424
- if (this._modelCopy) {
3425
- this._model = this._modelCopy;
3426
- } else {
3427
- delete this._modelCopy;
3428
- }
3429
- }
3430
- };
3431
-
3432
- this._model = MatchConfigure.createDefaultModel();
3433
- this._configuration = defaultValues.configuration;
3434
- }
3435
-
3436
- set model(m) {
3437
- this._model = MatchConfigure.createDefaultModel(m);
3438
- this._modelCopy = cloneDeep(this._model);
3439
-
3440
- this._render();
3441
- }
3442
-
3443
- set configuration(c) {
3444
- var _newConfiguration$lan, _c$rows;
3445
-
3446
- const newConfiguration = _extends({}, defaultValues.configuration, c);
3447
-
3448
- this._configuration = newConfiguration;
3449
- this.resetModelAfterConfigurationIsSet(); // if language:enabled is true, then the corresponding default item model should include a language value;
3450
- // if it is false, then the language field should be omitted from the item model.
3451
- // if a default item model includes a language value (e.g., en_US) and the corresponding authoring view settings have language:settings = true,
3452
- // then (a) language:enabled should also be true, and (b) that default language value should be represented in languageChoices[] (as a key).
3453
-
3454
- if (newConfiguration != null && (_newConfiguration$lan = newConfiguration.language) != null && _newConfiguration$lan.enabled) {
3455
- var _newConfiguration$lan2, _newConfiguration$lan3;
3456
-
3457
- if (newConfiguration != null && (_newConfiguration$lan2 = newConfiguration.languageChoices) != null && (_newConfiguration$lan3 = _newConfiguration$lan2.options) != null && _newConfiguration$lan3.length) {
3458
- this._model.language = newConfiguration == null ? void 0 : newConfiguration.languageChoices.options[0].value;
3459
- }
3460
- } else if (newConfiguration.language.settings && this._model.language) {
3461
- this._configuration.language.enabled = true;
3462
-
3463
- if (!this._configuration.languageChoices.options || !this._configuration.languageChoices.options.length) {
3464
- this._configuration.languageChoices.options = [];
3465
- } // check if the language is already included in the languageChoices.options array
3466
- // and if not, then add it.
3467
-
3468
-
3469
- if (!this._configuration.languageChoices.options.find(option => option.value === this._model.language)) {
3470
- this._configuration.languageChoices.options.push({
3471
- value: this._model.language,
3472
- label: this._model.language
3473
- });
3474
- }
3475
- } else {
3476
- delete this._model.language;
3477
- }
3478
- /**
3479
- * @Deprecated we added rows.inputConfiguration to handle the plugins in the editable html fields
3480
- * if rows.inputConfiguration is not defined we try to default to the old enableImages flag
3481
- * This flag 'enableImages' will be removed in the future
3482
- */
3483
-
3484
-
3485
- if (isEmpty(c == null ? void 0 : (_c$rows = c.rows) == null ? void 0 : _c$rows.inputConfiguration)) {
3486
- var _this$_model;
3487
-
3488
- set(this._configuration.rows, 'inputConfiguration.image.disabled', !((_this$_model = this._model) != null && _this$_model.enableImages));
3489
- set(this._configuration.rows, 'inputConfiguration.video.disabled', true);
3490
- set(this._configuration.rows, 'inputConfiguration.audio.disabled', true);
3491
- }
3492
-
3493
- this._render();
3494
- }
3495
-
3496
- onModelChanged(model) {
3497
- this._model = model;
3498
- log('[onModelChanged]: ', this._model);
3499
-
3500
- this._render();
3501
-
3502
- this.dispatchEvent(new ModelUpdatedEvent(this._model));
3503
- }
3504
-
3505
- onConfigurationChanged(config) {
3506
- this._configuration = config;
3507
-
3508
- this._render();
3509
- }
3510
- /**
3511
- *
3512
- * @param {done, progress, file} handler
3513
- */
3514
-
3515
-
3516
- insertImage(handler) {
3517
- this.dispatchEvent(new InsertImageEvent(handler));
3518
- }
3519
-
3520
- onDeleteImage(src, done) {
3521
- this.dispatchEvent(new DeleteImageEvent(src, done));
3522
- }
3523
-
3524
- insertSound(handler) {
3525
- this.dispatchEvent(new InsertSoundEvent(handler));
3526
- }
3527
-
3528
- onDeleteSound(src, done) {
3529
- this.dispatchEvent(new DeleteSoundEvent(src, done));
3530
- }
3531
-
3532
- _render() {
3533
- if (this._model) {
3534
- const el = /*#__PURE__*/React__default.createElement(Configure$1, {
3535
- onModelChanged: this.onModelChanged.bind(this),
3536
- onConfigurationChanged: this.onConfigurationChanged.bind(this),
3537
- model: this._model,
3538
- configuration: this._configuration,
3539
- imageSupport: {
3540
- add: this.insertImage.bind(this),
3541
- delete: this.onDeleteImage.bind(this)
3542
- },
3543
- uploadSoundSupport: {
3544
- add: this.insertSound.bind(this),
3545
- delete: this.onDeleteSound.bind(this)
3546
- }
3547
- });
3548
- ReactDOM.render(el, this);
3549
- }
3550
- }
3551
-
3552
- }
3553
-
3554
- MatchConfigure.createDefaultModel = (model = {}) => _extends({}, defaultValues.model, model);
3555
-
3556
- export { MatchConfigure as default };
3557
- //# sourceMappingURL=configure.js.map