@pie-element/multiple-choice 8.12.2-next.1 → 8.12.2-next.2

package/configure/lib/main.js

@@ -0,0 +1,628 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Main = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _editableHtml = require("@pie-lib/pie-toolbox/editable-html");
+
+var _configUi = require("@pie-lib/pie-toolbox/config-ui");
+
+var _renderUi = require("@pie-lib/pie-toolbox/render-ui");
+
+var _styles = require("@material-ui/core/styles");
+
+var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
+
+var _Tooltip = _interopRequireDefault(require("@material-ui/core/Tooltip"));
+
+var _Typography = _interopRequireDefault(require("@material-ui/core/Typography"));
+
+var _Info = _interopRequireDefault(require("@material-ui/icons/Info"));
+
+var _merge = _interopRequireDefault(require("lodash/merge"));
+
+var _utils = require("./utils");
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
+
+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; } }
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var Panel = _configUi.settings.Panel,
+    toggle = _configUi.settings.toggle,
+    radio = _configUi.settings.radio,
+    dropdown = _configUi.settings.dropdown;
+var MAX_CHOICES = 9;
+
+var styles = function styles(theme) {
+  return {
+    promptHolder: {
+      width: '100%',
+      paddingTop: theme.spacing.unit * 2,
+      marginBottom: theme.spacing.unit * 2
+    },
+    rationaleHolder: {
+      flex: 1,
+      marginTop: theme.spacing.unit * 1.5,
+      paddingTop: theme.spacing.unit * 2,
+      marginLeft: theme.spacing.unit * 3.5
+    },
+    accessibilityHolder: {
+      flex: 1,
+      marginTop: theme.spacing.unit * 1.5,
+      paddingTop: theme.spacing.unit * 2,
+      marginLeft: theme.spacing.unit * 3.5
+    },
+    choiceConfigurationHolder: {
+      display: 'flex',
+      flexDirection: 'column',
+      marginBottom: theme.spacing.unit
+    },
+    choiceConfiguration: {
+      width: '100%'
+    },
+    switchElement: {
+      justifyContent: 'space-between',
+      margin: 0
+    },
+    addButton: {
+      marginTop: theme.spacing.unit,
+      "float": 'right'
+    },
+    disableButton: {
+      cursor: 'not-allowed',
+      pointerEvents: 'all',
+      backgroundColor: _renderUi.color.disabled(),
+      '&:hover': {
+        backgroundColor: _renderUi.color.disabled()
+      },
+      '&:focus': {
+        backgroundColor: _renderUi.color.disabled()
+      }
+    },
+    flexContainer: {
+      display: 'flex',
+      alignItems: 'center'
+    },
+    titleText: {
+      fontSize: theme.typography.fontSize + 2,
+      marginRight: theme.spacing.unit
+    },
+    tooltip: {
+      fontSize: theme.typography.fontSize - 2,
+      whiteSpace: 'pre',
+      maxWidth: '500px'
+    },
+    errorText: {
+      fontSize: theme.typography.fontSize - 2,
+      color: theme.palette.error.main,
+      paddingTop: theme.spacing.unit
+    }
+  };
+};
+
+var Design = (0, _styles.withStyles)(styles)(function (props) {
+  var _configuration$teache, _configuration$prompt;
+
+  var classes = props.classes,
+      model = props.model,
+      configuration = props.configuration,
+      onPromptChanged = props.onPromptChanged,
+      onChoiceChanged = props.onChoiceChanged,
+      onRemoveChoice = props.onRemoveChoice,
+      onAddChoice = props.onAddChoice,
+      imageSupport = props.imageSupport,
+      uploadSoundSupport = props.uploadSoundSupport,
+      onChangeModel = props.onChangeModel,
+      onConfigurationChanged = props.onConfigurationChanged,
+      onTeacherInstructionsChanged = props.onTeacherInstructionsChanged;
+
+  var _ref = configuration || {},
+      _ref$addChoiceButton = _ref.addChoiceButton,
+      addChoiceButton = _ref$addChoiceButton === void 0 ? {} : _ref$addChoiceButton,
+      _ref$contentDimension = _ref.contentDimensions,
+      contentDimensions = _ref$contentDimension === void 0 ? {} : _ref$contentDimension,
+      _ref$feedback = _ref.feedback,
+      feedback = _ref$feedback === void 0 ? {} : _ref$feedback,
+      _ref$deleteChoice = _ref.deleteChoice,
+      deleteChoice = _ref$deleteChoice === void 0 ? {} : _ref$deleteChoice,
+      _ref$choiceMode = _ref.choiceMode,
+      choiceMode = _ref$choiceMode === void 0 ? {} : _ref$choiceMode,
+      _ref$choicePrefix = _ref.choicePrefix,
+      choicePrefix = _ref$choicePrefix === void 0 ? {} : _ref$choicePrefix,
+      _ref$partialScoring = _ref.partialScoring,
+      partialScoring = _ref$partialScoring === void 0 ? {} : _ref$partialScoring,
+      _ref$lockChoiceOrder = _ref.lockChoiceOrder,
+      lockChoiceOrder = _ref$lockChoiceOrder === void 0 ? {} : _ref$lockChoiceOrder,
+      _ref$teacherInstructi = _ref.teacherInstructions,
+      teacherInstructions = _ref$teacherInstructi === void 0 ? {} : _ref$teacherInstructi,
+      _ref$studentInstructi = _ref.studentInstructions,
+      studentInstructions = _ref$studentInstructi === void 0 ? {} : _ref$studentInstructi,
+      _ref$rationale = _ref.rationale,
+      rationale = _ref$rationale === void 0 ? {} : _ref$rationale,
+      _ref$accessibility = _ref.accessibility,
+      accessibility = _ref$accessibility === void 0 ? {} : _ref$accessibility,
+      _ref$scoringType = _ref.scoringType,
+      scoringType = _ref$scoringType === void 0 ? {} : _ref$scoringType,
+      _ref$sequentialChoice = _ref.sequentialChoiceLabels,
+      sequentialChoiceLabels = _ref$sequentialChoice === void 0 ? {} : _ref$sequentialChoice,
+      settingsPanelDisabled = _ref.settingsPanelDisabled,
+      choicesLayout = _ref.choicesLayout,
+      _ref$spellCheck = _ref.spellCheck,
+      spellCheck = _ref$spellCheck === void 0 ? {} : _ref$spellCheck,
+      gridColumns = _ref.gridColumns,
+      _ref$maxImageWidth = _ref.maxImageWidth,
+      maxImageWidth = _ref$maxImageWidth === void 0 ? {} : _ref$maxImageWidth,
+      _ref$maxImageHeight = _ref.maxImageHeight,
+      maxImageHeight = _ref$maxImageHeight === void 0 ? {} : _ref$maxImageHeight,
+      _ref$prompt = _ref.prompt,
+      prompt = _ref$prompt === void 0 ? {} : _ref$prompt,
+      _ref$withRubric = _ref.withRubric,
+      withRubric = _ref$withRubric === void 0 ? {} : _ref$withRubric,
+      _ref$mathMlOptions = _ref.mathMlOptions,
+      mathMlOptions = _ref$mathMlOptions === void 0 ? {} : _ref$mathMlOptions,
+      _ref$language = _ref.language,
+      language = _ref$language === void 0 ? {} : _ref$language,
+      _ref$languageChoices = _ref.languageChoices,
+      languageChoices = _ref$languageChoices === void 0 ? {} : _ref$languageChoices;
+
+  var _ref2 = configuration || {},
+      maxAnswerChoices = _ref2.maxAnswerChoices;
+
+  var _ref3 = model || {},
+      limitChoicesNumber = _ref3.limitChoicesNumber,
+      teacherInstructionsEnabled = _ref3.teacherInstructionsEnabled,
+      rationaleEnabled = _ref3.rationaleEnabled,
+      accessibilityLabelsEnabled = _ref3.accessibilityLabelsEnabled,
+      feedbackEnabled = _ref3.feedbackEnabled,
+      promptEnabled = _ref3.promptEnabled,
+      spellCheckEnabled = _ref3.spellCheckEnabled,
+      choices = _ref3.choices,
+      errors = _ref3.errors,
+      toolbarEditorPosition = _ref3.toolbarEditorPosition;
+
+  var _ref4 = errors || {},
+      answerChoicesError = _ref4.answerChoices,
+      choicesErrors = _ref4.choices,
+      correctResponseError = _ref4.correctResponse,
+      promptError = _ref4.prompt,
+      rationaleErrors = _ref4.rationale,
+      teacherInstructionsError = _ref4.teacherInstructions;
+
+  var nrOfColumnsAvailable = choices !== null && choices !== void 0 && choices.length ? Array.from({
+    length: choices.length
+  }, function (_, i) {
+    return "".concat(i + 1);
+  }) : [];
+  var _configuration$baseIn = configuration.baseInputConfiguration,
+      baseInputConfiguration = _configuration$baseIn === void 0 ? {} : _configuration$baseIn;
+  var toolbarOpts = {
+    position: toolbarEditorPosition === 'top' ? 'top' : 'bottom'
+  }; // if old property is used, set maxAnswerChoices to 9
+
+  if (limitChoicesNumber) {
+    maxAnswerChoices = MAX_CHOICES;
+  }
+
+  var getPluginProps = function getPluginProps() {
+    var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    return _objectSpread(_objectSpread({}, baseInputConfiguration), props);
+  };
+
+  var validationMessage = (0, _utils.generateValidationMessage)(configuration);
+  var defaultImageMaxWidth = maxImageWidth && maxImageWidth.prompt;
+  var defaultImageMaxHeight = maxImageHeight && maxImageHeight.prompt;
+  var addChoiceButtonTooltip = maxAnswerChoices && (choices === null || choices === void 0 ? void 0 : choices.length) >= maxAnswerChoices ? "Only ".concat(maxAnswerChoices, " allowed maximum") : '';
+  var panelSettings = {
+    choiceMode: choiceMode.settings && radio(choiceMode.label, ['checkbox', 'radio']),
+    'sequentialChoiceLabels.enabled': sequentialChoiceLabels.settings && toggle(sequentialChoiceLabels.label, true),
+    choicePrefix: choicePrefix.settings && radio(choicePrefix.label, ['numbers', 'letters']),
+    partialScoring: partialScoring.settings && toggle(partialScoring.label),
+    lockChoiceOrder: lockChoiceOrder.settings && toggle(lockChoiceOrder.label),
+    feedbackEnabled: feedback.settings && toggle(feedback.label),
+    choicesLayout: choicesLayout.settings && dropdown(choicesLayout.label, ['vertical', 'grid', 'horizontal']),
+    gridColumns: choicesLayout.settings && model.choicesLayout === 'grid' && nrOfColumnsAvailable.length > 0 && dropdown(gridColumns.label, nrOfColumnsAvailable),
+    'language.enabled': language.settings && toggle(language.label, true),
+    language: language.settings && language.enabled && dropdown(languageChoices.label, languageChoices.options)
+  };
+  var panelProperties = {
+    teacherInstructionsEnabled: teacherInstructions.settings && toggle(teacherInstructions.label),
+    studentInstructionsEnabled: studentInstructions.settings && toggle(studentInstructions.label),
+    promptEnabled: prompt.settings && toggle(prompt.label),
+    rationaleEnabled: rationale.settings && toggle(rationale.label),
+    spellCheckEnabled: spellCheck.settings && toggle(spellCheck.label),
+    accessibilityLabelsEnabled: accessibility.settings && toggle(accessibility.label),
+    scoringType: scoringType.settings && radio(scoringType.label, ['auto', 'rubric']),
+    rubricEnabled: (withRubric === null || withRubric === void 0 ? void 0 : withRubric.settings) && toggle(withRubric === null || withRubric === void 0 ? void 0 : withRubric.label)
+  };
+  return /*#__PURE__*/_react["default"].createElement(_configUi.layout.ConfigLayout, {
+    dimensions: contentDimensions,
+    hideSettings: settingsPanelDisabled,
+    settings: /*#__PURE__*/_react["default"].createElement(Panel, {
+      model: model,
+      onChangeModel: onChangeModel,
+      configuration: configuration,
+      onChangeConfiguration: onConfigurationChanged,
+      groups: {
+        Settings: panelSettings,
+        Properties: panelProperties
+      }
+    })
+  }, teacherInstructionsEnabled && /*#__PURE__*/_react["default"].createElement(_configUi.InputContainer, {
+    label: teacherInstructions.label,
+    className: classes.promptHolder
+  }, /*#__PURE__*/_react["default"].createElement(_editableHtml.EditableHtml, {
+    className: classes.prompt,
+    markup: model.teacherInstructions || '',
+    onChange: onTeacherInstructionsChanged,
+    imageSupport: imageSupport,
+    nonEmpty: false,
+    error: teacherInstructionsError,
+    toolbarOpts: toolbarOpts,
+    pluginProps: getPluginProps(configuration === null || configuration === void 0 ? void 0 : (_configuration$teache = configuration.teacherInstructions) === null || _configuration$teache === void 0 ? void 0 : _configuration$teache.inputConfiguration),
+    spellCheck: spellCheckEnabled,
+    maxImageWidth: maxImageWidth && maxImageWidth.teacherInstructions || defaultImageMaxWidth,
+    maxImageHeight: maxImageHeight && maxImageHeight.teacherInstructions || defaultImageMaxHeight,
+    uploadSoundSupport: uploadSoundSupport,
+    languageCharactersProps: [{
+      language: 'spanish'
+    }, {
+      language: 'special'
+    }],
+    mathMlOptions: mathMlOptions
+  }), teacherInstructionsError && /*#__PURE__*/_react["default"].createElement("div", {
+    className: classes.errorText
+  }, teacherInstructionsError)), promptEnabled && /*#__PURE__*/_react["default"].createElement(_configUi.InputContainer, {
+    label: prompt.label,
+    className: classes.promptHolder
+  }, /*#__PURE__*/_react["default"].createElement(_editableHtml.EditableHtml, {
+    className: classes.prompt,
+    markup: model.prompt,
+    onChange: onPromptChanged,
+    imageSupport: imageSupport,
+    nonEmpty: false,
+    disableUnderline: true,
+    error: promptError,
+    toolbarOpts: toolbarOpts,
+    pluginProps: getPluginProps(configuration === null || configuration === void 0 ? void 0 : (_configuration$prompt = configuration.prompt) === null || _configuration$prompt === void 0 ? void 0 : _configuration$prompt.inputConfiguration),
+    spellCheck: spellCheckEnabled,
+    maxImageWidth: maxImageWidth && maxImageWidth.prompt,
+    maxImageHeight: maxImageHeight && maxImageHeight.prompt,
+    uploadSoundSupport: uploadSoundSupport,
+    languageCharactersProps: [{
+      language: 'spanish'
+    }, {
+      language: 'special'
+    }],
+    mathMlOptions: mathMlOptions
+  }), promptError && /*#__PURE__*/_react["default"].createElement("div", {
+    className: classes.errorText
+  }, promptError)), /*#__PURE__*/_react["default"].createElement("div", {
+    className: classes.flexContainer
+  }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
+    className: classes.titleText
+  }, "Choices"), /*#__PURE__*/_react["default"].createElement(_Tooltip["default"], {
+    classes: {
+      tooltip: classes.tooltip
+    },
+    disableFocusListener: true,
+    disableTouchListener: true,
+    placement: 'right',
+    title: validationMessage
+  }, /*#__PURE__*/_react["default"].createElement(_Info["default"], {
+    fontSize: 'small',
+    color: 'primary'
+  }))), choices.map(function (choice, index) {
+    var _configuration$choice, _configuration$ration, _configuration$access;
+
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      key: "choice-".concat(index),
+      className: classes.choiceConfigurationHolder
+    }, /*#__PURE__*/_react["default"].createElement(_configUi.ChoiceConfiguration, {
+      key: index,
+      index: index + 1,
+      useLetterOrdering: model.choicePrefix === 'letters',
+      className: classes.choiceConfiguration,
+      mode: model.choiceMode,
+      data: choice,
+      defaultFeedback: {},
+      imageSupport: imageSupport,
+      disableImageAlignmentButtons: true,
+      onDelete: function onDelete() {
+        return onRemoveChoice(index);
+      },
+      onChange: function onChange(c) {
+        return onChoiceChanged(index, c);
+      },
+      allowFeedBack: feedbackEnabled,
+      allowDelete: deleteChoice.settings,
+      noLabels: true,
+      pluginOpts: getPluginProps(configuration === null || configuration === void 0 ? void 0 : (_configuration$choice = configuration.choices) === null || _configuration$choice === void 0 ? void 0 : _configuration$choice.inputConfiguration),
+      toolbarOpts: toolbarOpts,
+      spellCheck: spellCheckEnabled,
+      error: (choicesErrors === null || choicesErrors === void 0 ? void 0 : choicesErrors[choice.value]) || null,
+      noCorrectAnswerError: correctResponseError,
+      maxImageWidth: maxImageWidth && maxImageWidth.choices || defaultImageMaxWidth,
+      maxImageHeight: maxImageHeight && maxImageHeight.choices || defaultImageMaxHeight,
+      uploadSoundSupport: uploadSoundSupport,
+      mathMlOptions: mathMlOptions
+    }), rationaleEnabled && /*#__PURE__*/_react["default"].createElement(_configUi.InputContainer, {
+      key: "rationale-".concat(index),
+      label: rationale.label,
+      className: classes.rationaleHolder
+    }, /*#__PURE__*/_react["default"].createElement(_editableHtml.EditableHtml, {
+      className: classes.rationale,
+      markup: choice.rationale || '',
+      onChange: function onChange(c) {
+        return onChoiceChanged(index, _objectSpread(_objectSpread({}, choice), {}, {
+          rationale: c
+        }));
+      },
+      imageSupport: imageSupport,
+      error: (rationaleErrors === null || rationaleErrors === void 0 ? void 0 : rationaleErrors[choice.value]) || null,
+      toolbarOpts: toolbarOpts,
+      pluginProps: getPluginProps(configuration === null || configuration === void 0 ? void 0 : (_configuration$ration = configuration.rationale) === null || _configuration$ration === void 0 ? void 0 : _configuration$ration.inputConfiguration),
+      spellCheck: spellCheckEnabled,
+      maxImageWidth: maxImageWidth && maxImageWidth.rationale || defaultImageMaxWidth,
+      maxImageHeight: maxImageHeight && maxImageHeight.rationale || defaultImageMaxHeight,
+      uploadSoundSupport: uploadSoundSupport,
+      languageCharactersProps: [{
+        language: 'spanish'
+      }, {
+        language: 'special'
+      }],
+      mathMlOptions: mathMlOptions
+    }), (rationaleErrors === null || rationaleErrors === void 0 ? void 0 : rationaleErrors[choice.value]) && /*#__PURE__*/_react["default"].createElement("div", {
+      className: classes.errorText
+    }, rationaleErrors === null || rationaleErrors === void 0 ? void 0 : rationaleErrors[choice.value])), accessibilityLabelsEnabled && /*#__PURE__*/_react["default"].createElement(_configUi.InputContainer, {
+      key: "accessibility-".concat(index),
+      label: accessibility.label,
+      className: classes.accessibilityHolder
+    }, /*#__PURE__*/_react["default"].createElement(_editableHtml.EditableHtml, {
+      className: classes.accessibility,
+      markup: choice.accessibility || '',
+      onChange: function onChange(c) {
+        return onChoiceChanged(index, _objectSpread(_objectSpread({}, choice), {}, {
+          accessibility: c
+        }));
+      },
+      imageSupport: imageSupport,
+      pluginProps: getPluginProps(configuration === null || configuration === void 0 ? void 0 : (_configuration$access = configuration.accessibility) === null || _configuration$access === void 0 ? void 0 : _configuration$access.inputConfiguration),
+      spellCheck: spellCheckEnabled,
+      maxImageWidth: maxImageWidth && maxImageWidth.choices || defaultImageMaxWidth,
+      maxImageHeight: maxImageHeight && maxImageHeight.choices || defaultImageMaxHeight,
+      uploadSoundSupport: uploadSoundSupport,
+      languageCharactersProps: [{
+        language: 'spanish'
+      }, {
+        language: 'special'
+      }],
+      mathMlOptions: mathMlOptions
+    })));
+  }), correctResponseError && /*#__PURE__*/_react["default"].createElement("div", {
+    className: classes.errorText
+  }, correctResponseError), answerChoicesError && /*#__PURE__*/_react["default"].createElement("div", {
+    className: classes.errorText
+  }, answerChoicesError), addChoiceButton.settings && /*#__PURE__*/_react["default"].createElement(_Tooltip["default"], {
+    title: addChoiceButtonTooltip,
+    classes: {
+      tooltip: classes.tooltip
+    }
+  }, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
+    classes: {
+      root: maxAnswerChoices && (choices === null || choices === void 0 ? void 0 : choices.length) >= maxAnswerChoices && classes.disableButton
+    },
+    className: classes.addButton,
+    variant: "contained",
+    color: "primary",
+    onClick: onAddChoice
+  }, addChoiceButton.label)));
+});
+
+var Main = /*#__PURE__*/function (_React$Component) {
+  (0, _inherits2["default"])(Main, _React$Component);
+
+  var _super = _createSuper(Main);
+
+  function Main() {
+    var _this;
+
+    (0, _classCallCheck2["default"])(this, Main);
+
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _super.call.apply(_super, [this].concat(args));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
+      showWarning: false
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onRemoveChoice", function (index) {
+      var _this$props = _this.props,
+          model = _this$props.model,
+          configuration = _this$props.configuration,
+          onModelChanged = _this$props.onModelChanged;
+
+      var _ref5 = configuration || {},
+          minAnswerChoices = _ref5.minAnswerChoices;
+
+      if (minAnswerChoices && model.choices.length === minAnswerChoices) {
+        _this.setState({
+          showWarning: true
+        });
+
+        return;
+      }
+
+      model.choices.splice(index, 1);
+      onModelChanged(model);
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onAddChoice", function () {
+      var _this$props2 = _this.props,
+          model = _this$props2.model,
+          configuration = _this$props2.configuration,
+          onModelChanged = _this$props2.onModelChanged;
+
+      var _ref6 = configuration || {},
+          maxAnswerChoices = _ref6.maxAnswerChoices;
+
+      var _ref7 = model || {},
+          limitChoicesNumber = _ref7.limitChoicesNumber; // if old property is used, set maxAnswerChoices to 9
+
+
+      if (limitChoicesNumber) {
+        maxAnswerChoices = MAX_CHOICES;
+      }
+
+      if (maxAnswerChoices && model.choices.length >= maxAnswerChoices) {
+        return;
+      }
+
+      model.choices.push({
+        label: '',
+        value: _configUi.choiceUtils.firstAvailableIndex(model.choices.map(function (c) {
+          return c.value;
+        }), 0),
+        feedback: {
+          type: 'none'
+        }
+      });
+      onModelChanged(model);
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onChoiceChanged", function (index, choice) {
+      var _this$props3 = _this.props,
+          model = _this$props3.model,
+          onModelChanged = _this$props3.onModelChanged;
+
+      if (choice.correct && model.choiceMode === 'radio') {
+        model.choices = model.choices.map(function (c) {
+          return (0, _merge["default"])({}, c, {
+            correct: false
+          });
+        });
+      }
+
+      model.choices.splice(index, 1, choice);
+      onModelChanged(model);
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onPromptChanged", function (prompt) {
+      _this.props.onModelChanged(_objectSpread(_objectSpread({}, _this.props.model), {}, {
+        prompt: prompt
+      }));
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onTeacherInstructionsChanged", function (teacherInstructions) {
+      _this.props.onModelChanged(_objectSpread(_objectSpread({}, _this.props.model), {}, {
+        teacherInstructions: teacherInstructions
+      }));
+    });
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onModelChanged", function (model, key) {
+      var onModelChanged = _this.props.onModelChanged;
+
+      switch (key) {
+        case 'choiceMode':
+          {
+            var value = model.choiceMode;
+
+            if (value === 'radio') {
+              var correctFound = false;
+              model.choices = model.choices.map(function (c) {
+                if (correctFound) {
+                  c.correct = false;
+                  return c;
+                }
+
+                if (c.correct) {
+                  correctFound = true;
+                }
+
+                return c;
+              });
+            }
+
+            onModelChanged(model, true);
+            break;
+          }
+
+        default:
+          onModelChanged(model);
+          break;
+      }
+    });
+    return _this;
+  }
+
+  (0, _createClass2["default"])(Main, [{
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      var _this$props$configura = this.props.configuration;
+      _this$props$configura = _this$props$configura === void 0 ? {} : _this$props$configura;
+      var minAnswerChoices = _this$props$configura.minAnswerChoices;
+      var showWarning = this.state.showWarning;
+      return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_configUi.AlertDialog, {
+        open: showWarning,
+        title: "Warning",
+        text: "There can't be less than ".concat(minAnswerChoices || 0, " choices."),
+        onConfirm: function onConfirm() {
+          return _this2.setState({
+            showWarning: false
+          });
+        }
+      }), /*#__PURE__*/_react["default"].createElement(Design, (0, _extends2["default"])({}, this.props, {
+        onChangeModel: this.onModelChanged,
+        onRemoveChoice: this.onRemoveChoice,
+        onChoiceChanged: this.onChoiceChanged,
+        onAddChoice: this.onAddChoice,
+        onPromptChanged: this.onPromptChanged,
+        onTeacherInstructionsChanged: this.onTeacherInstructionsChanged
+      })));
+    }
+  }]);
+  return Main;
+}(_react["default"].Component);
+
+exports.Main = Main;
+(0, _defineProperty2["default"])(Main, "propTypes", {
+  model: _propTypes["default"].object.isRequired,
+  configuration: _propTypes["default"].object.isRequired,
+  disableSidePanel: _propTypes["default"].bool,
+  onModelChanged: _propTypes["default"].func.isRequired,
+  onConfigurationChanged: _propTypes["default"].func.isRequired,
+  classes: _propTypes["default"].object.isRequired,
+  imageSupport: _propTypes["default"].shape({
+    add: _propTypes["default"].func.isRequired,
+    "delete": _propTypes["default"].func.isRequired
+  })
+});
+var Styled = (0, _styles.withStyles)(styles)(Main);
+var _default = Styled;
+exports["default"] = _default;
+//# sourceMappingURL=main.js.map