@instructure/quiz-core 21.0.1-rc.0 → 21.0.1-rc.13

package/lib/building/components/resources/quiz/instructions/Instructions/presenter.js

@@ -4,72 +4,75 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.QuizInstructions = void 0;
+exports["default"] = exports.QuizInstructions = void 0;
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("react");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));
 var _uiHeading = require("@instructure/ui-heading");
 var _emotion = require("@instructure/emotion");
-var _index = _interopRequireDefault(require("../Edit/index.js"));
-var _index2 = _interopRequireDefault(require("../Show/index.js"));
-var _EditButton = _interopRequireDefault(require("../../editButton/EditButton.js"));
-var _styles = _interopRequireDefault(require("./styles.js"));
-var _theme = _interopRequireDefault(require("./theme.js"));
+var _Edit = _interopRequireDefault(require("../Edit"));
+var _Show = _interopRequireDefault(require("../Show"));
+var _EditButton = _interopRequireDefault(require("../../editButton/EditButton"));
+var _styles = _interopRequireDefault(require("./styles"));
+var _theme = _interopRequireDefault(require("./theme"));
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
 var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _QuizInstructions;
 /** @jsx jsx */
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 // ======================================
 // renders the editable quiz instructions
 // input/display component
 // ======================================
-var QuizInstructions = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_QuizInstructions = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(QuizInstructions, _Component);
-  var _super = (0, _createSuper2.default)(QuizInstructions);
+var QuizInstructions = exports.QuizInstructions = (_dec = (0, _quizCommon.withStyleOverrides)(_styles["default"], _theme["default"]), _dec(_class = (_QuizInstructions = /*#__PURE__*/function (_Component) {
   function QuizInstructions() {
     var _this;
-    (0, _classCallCheck2.default)(this, QuizInstructions);
+    (0, _classCallCheck2["default"])(this, QuizInstructions);
     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));
-    _this.workingInstructions = function () {
+    _this = _callSuper(this, QuizInstructions, [].concat(args));
+    (0, _defineProperty2["default"])(_this, "workingInstructions", function () {
       return _this.props.quiz.getWorkingInstance().instructions || '';
-    };
+    });
     // =========
     //  actions
     // =========
-    _this.updateWorkingInstructions = function (event, _ref) {
+    (0, _defineProperty2["default"])(_this, "updateWorkingInstructions", function (event, _ref) {
       var editorContent = _ref.editorContent;
       _this.props.changeQuizInstructions(_this.quizID(), editorContent);
-    };
-    _this.saveAndPreview = function () {
+    });
+    (0, _defineProperty2["default"])(_this, "saveAndPreview", function () {
       _this.saveWorkingInstructions();
       _this.endEditing();
-    };
-    _this.endEditing = function () {
+    });
+    (0, _defineProperty2["default"])(_this, "endEditing", function () {
       _this.props.switchOffEditing();
       _this.props.clearModifications('quizzes', _this.quizID(), ['instructions']);
-    };
-    _this.toggleEditing = function () {
+    });
+    (0, _defineProperty2["default"])(_this, "toggleEditing", function () {
       var msg;
       if (_this.props.isEditing) {
-        msg = (0, _formatMessage.default)('Instructions edit mode off.');
+        msg = (0, _formatMessage["default"])('Instructions edit mode off.');
         _this.props.screenreaderNotification(msg);
         _this.saveAndPreview();
       } else {
-        msg = (0, _formatMessage.default)('Instructions switched to edit mode. Navigate down to access text editor.');
+        msg = (0, _formatMessage["default"])('Instructions switched to edit mode. Navigate down to access text editor.');
         _this.props.screenreaderNotification(msg);
         _this.props.switchOnEditing();
       }
-    };
+    });
     return _this;
   }
-  (0, _createClass2.default)(QuizInstructions, [{
+  (0, _inherits2["default"])(QuizInstructions, _Component);
+  return (0, _createClass2["default"])(QuizInstructions, [{
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps) {
       var _this2 = this;
@@ -80,7 +83,9 @@ var QuizInstructions = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defau
           _this2.editButton.getWrappedInstance().setFocus();
         }, 50);
       }
-    } // ===========
+    }
+
+    // ===========
     //   helpers
     // ===========
   }, {
@@ -108,7 +113,9 @@ var QuizInstructions = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defau
       return function (node) {
         _this3[key] = node;
       };
-    } // ===============
+    }
+
+    // ===============
     //    RENDERING
     // ===============
   }, {
@@ -117,7 +124,7 @@ var QuizInstructions = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defau
       if (!this.props.isEditing) {
         return;
       }
-      return (0, _emotion.jsx)(_index.default, {
+      return (0, _emotion.jsx)(_Edit["default"], {
         endEditing: this.endEditing,
         inputValue: this.workingInstructions(),
         onInputChange: this.updateWorkingInstructions,
@@ -132,12 +139,12 @@ var QuizInstructions = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defau
         return;
       }
       var contentLocked = this.props.quiz.originalQuizLockedByBlueprint;
-      return (0, _emotion.jsx)(_index2.default, {
+      return (0, _emotion.jsx)(_Show["default"], {
         ref: this.setRef('instructionsPreview'),
         instructions: this.props.quiz.instructions,
         switchOnEditing: this.props.switchOnEditing,
         contentLocked: this.isContentLocked(),
-        scrollKey: contentLocked ? this.props.scrollKey : void 0
+        scrollKey: contentLocked ? this.props.scrollKey : undefined
       });
     }
   }, {
@@ -153,10 +160,10 @@ var QuizInstructions = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defau
       }, (0, _emotion.jsx)(_uiHeading.Heading, {
         level: "h4",
         as: "h2"
-      }, (0, _formatMessage.default)('Instructions'))), (0, _emotion.jsx)("div", null, this.editingRender(), this.showRender())), (0, _emotion.jsx)("div", null, !this.props.isEditing && !this.isContentLocked() && (0, _emotion.jsx)("div", {
+      }, (0, _formatMessage["default"])('Instructions'))), (0, _emotion.jsx)("div", null, this.editingRender(), this.showRender())), (0, _emotion.jsx)("div", null, !this.props.isEditing && !this.isContentLocked() && (0, _emotion.jsx)("div", {
         css: this.props.styles.editButtonWrapper
-      }, (0, _emotion.jsx)(_EditButton.default, {
-        screenreaderText: (0, _formatMessage.default)('Edit Instructions'),
+      }, (0, _emotion.jsx)(_EditButton["default"], {
+        screenreaderText: (0, _formatMessage["default"])('Edit Instructions'),
         scrollKey: this.props.scrollKey,
         onClick: this.toggleEditing,
         ref: this.setRef('editButton'),
@@ -164,26 +171,22 @@ var QuizInstructions = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defau
       }))));
     }
   }]);
-  QuizInstructions.displayName = "QuizInstructions";
-  return QuizInstructions;
-}(_react.Component), _QuizInstructions.displayName = 'QuizInstructions', _QuizInstructions.componentId = "Quizzes".concat(_QuizInstructions.displayName), _QuizInstructions.propTypes = {
-  changeQuizInstructions: _propTypes.default.func.isRequired,
-  clearModifications: _propTypes.default.func.isRequired,
-  isEditing: _propTypes.default.bool.isRequired,
+}(_react.Component), (0, _defineProperty2["default"])(_QuizInstructions, "displayName", 'QuizInstructions'), (0, _defineProperty2["default"])(_QuizInstructions, "componentId", "Quizzes".concat(_QuizInstructions.displayName)), (0, _defineProperty2["default"])(_QuizInstructions, "propTypes", {
+  changeQuizInstructions: _propTypes["default"].func.isRequired,
+  clearModifications: _propTypes["default"].func.isRequired,
+  isEditing: _propTypes["default"].bool.isRequired,
   // Injected by makeEditable
-  lockBlueprintContentEnabled: _propTypes.default.bool.isRequired,
-  quiz: _reactImmutableProptypes.default.record.isRequired,
-  saveQuizChange: _propTypes.default.func.isRequired,
-  screenreaderNotification: _propTypes.default.func.isRequired,
-  scrollKey: _propTypes.default.string,
-  switchOffEditing: _propTypes.default.func.isRequired,
+  lockBlueprintContentEnabled: _propTypes["default"].bool.isRequired,
+  quiz: _reactImmutableProptypes["default"].record.isRequired,
+  saveQuizChange: _propTypes["default"].func.isRequired,
+  screenreaderNotification: _propTypes["default"].func.isRequired,
+  scrollKey: _propTypes["default"].string,
+  switchOffEditing: _propTypes["default"].func.isRequired,
   // Injected by makeEditable
-  switchOnEditing: _propTypes.default.func.isRequired,
+  switchOnEditing: _propTypes["default"].func.isRequired,
   // Injected by makeEditable,
-  styles: _propTypes.default.object
-}, _QuizInstructions.defaultProps = {
+  styles: _propTypes["default"].object
+}), (0, _defineProperty2["default"])(_QuizInstructions, "defaultProps", {
   scrollKey: void 0
-}, _QuizInstructions)) || _class);
-exports.QuizInstructions = QuizInstructions;
-var _default = QuizInstructions;
-exports.default = _default;
+}), _QuizInstructions)) || _class);
+var _default = exports["default"] = QuizInstructions;

package/lib/building/components/resources/quiz/instructions/Instructions/styles.js

@@ -4,12 +4,12 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports["default"] = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var generateStyle = function generateStyle(componentTheme) {
   var mp = '@media print';
   return {
-    topRow: (0, _defineProperty2.default)({
+    topRow: (0, _defineProperty2["default"])({
       display: 'flex',
       justifyContent: 'space-between'
     }, mp, {
@@ -35,5 +35,4 @@ var generateStyle = function generateStyle(componentTheme) {
     }
   };
 };
-var _default = generateStyle;
-exports.default = _default;
+var _default = exports["default"] = generateStyle;

package/lib/building/components/resources/quiz/instructions/Instructions/theme.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = generator;
+exports["default"] = generator;
 function generator(_ref) {
   var spacing = _ref.spacing,
     colors = _ref.colors,
@@ -13,7 +13,7 @@ function generator(_ref) {
     labelLeftPadding: spacing.large,
     labelBottomPadding: spacing.xxSmall,
     labelFontSize: typography.fontSizeSmall,
-    labelColor: colors.contrasts.grey4570,
+    labelColor: colors.slate,
     editButtonWrapperRightMargin: spacing.large
   };
 }

package/lib/building/components/resources/quiz/instructions/Show/index.js

@@ -4,49 +4,52 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.QuizInstructionsShow = void 0;
+exports["default"] = exports.QuizInstructionsShow = void 0;
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("react");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _emotion = require("@instructure/emotion");
 var _quizRce = require("@instructure/quiz-rce");
-var _index = _interopRequireDefault(require("../../../../../../common/components/shared/overlay/index.js"));
-var _makeScrollable = _interopRequireDefault(require("../../../../../../common/components/shared/functionality/makeScrollable.js"));
-var _styles = _interopRequireDefault(require("./styles.js"));
-var _theme = _interopRequireDefault(require("./theme.js"));
+var _overlay = _interopRequireDefault(require("../../../../../../common/components/shared/overlay"));
+var _makeScrollable = _interopRequireDefault(require("../../../../../../common/components/shared/functionality/makeScrollable"));
+var _styles = _interopRequireDefault(require("./styles"));
+var _theme = _interopRequireDefault(require("./theme"));
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
 var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _QuizInstructionsShow;
 /** @jsx jsx */
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 // ==========================================
 // this component shows the quiz instructions
 // has events that allow for toggling
 // editing and hover which shows an overlay
 // ==========================================
-var QuizInstructionsShow = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_QuizInstructionsShow = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(QuizInstructionsShow, _Component);
-  var _super = (0, _createSuper2.default)(QuizInstructionsShow);
+var QuizInstructionsShow = exports.QuizInstructionsShow = (_dec = (0, _quizCommon.withStyleOverrides)(_styles["default"], _theme["default"]), _dec(_class = (_QuizInstructionsShow = /*#__PURE__*/function (_Component) {
   function QuizInstructionsShow() {
     var _this;
-    (0, _classCallCheck2.default)(this, QuizInstructionsShow);
+    (0, _classCallCheck2["default"])(this, QuizInstructionsShow);
     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));
-    _this.switchOnEditing = function () {
+    _this = _callSuper(this, QuizInstructionsShow, [].concat(args));
+    (0, _defineProperty2["default"])(_this, "switchOnEditing", function () {
       _this.props.switchOnEditing();
-    };
+    });
     return _this;
   }
-  (0, _createClass2.default)(QuizInstructionsShow, [{
+  (0, _inherits2["default"])(QuizInstructionsShow, _Component);
+  return (0, _createClass2["default"])(QuizInstructionsShow, [{
     key: "render",
     value: function render() {
       return (0, _emotion.jsx)("span", {
         "data-automation": "sdk-quiz-instructions-show-wrapper"
-      }, (0, _emotion.jsx)(_index.default, {
+      }, (0, _emotion.jsx)(_overlay["default"], {
         wrapperStyles: this.props.styles.instructionsShowWrapper,
         onClick: this.switchOnEditing,
         tabIndex: "-1",
@@ -55,21 +58,17 @@ var QuizInstructionsShow = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.d
         "data-automation": "instructions-show-text"
       }, (0, _emotion.jsx)(_quizRce.RichContentRenderer, {
         customStyles: this.props.styles.instructionsShowText,
-        content: this.props.instructions || (0, _formatMessage.default)('Add Instructions...')
+        content: this.props.instructions || (0, _formatMessage["default"])('Add Instructions...')
       }))));
     }
   }]);
-  QuizInstructionsShow.displayName = "QuizInstructionsShow";
-  return QuizInstructionsShow;
-}(_react.Component), _QuizInstructionsShow.displayName = 'QuizInstructionsShow', _QuizInstructionsShow.componentId = "Quizzes".concat(_QuizInstructionsShow.displayName), _QuizInstructionsShow.propTypes = {
-  instructions: _propTypes.default.string,
-  switchOnEditing: _propTypes.default.func.isRequired,
-  contentLocked: _propTypes.default.bool,
-  styles: _propTypes.default.object
-}, _QuizInstructionsShow.defaultProps = {
+}(_react.Component), (0, _defineProperty2["default"])(_QuizInstructionsShow, "displayName", 'QuizInstructionsShow'), (0, _defineProperty2["default"])(_QuizInstructionsShow, "componentId", "Quizzes".concat(_QuizInstructionsShow.displayName)), (0, _defineProperty2["default"])(_QuizInstructionsShow, "propTypes", {
+  instructions: _propTypes["default"].string,
+  switchOnEditing: _propTypes["default"].func.isRequired,
+  contentLocked: _propTypes["default"].bool,
+  styles: _propTypes["default"].object
+}), (0, _defineProperty2["default"])(_QuizInstructionsShow, "defaultProps", {
   contentLocked: false,
   instructions: null
-}, _QuizInstructionsShow)) || _class);
-exports.QuizInstructionsShow = QuizInstructionsShow;
-var _default = (0, _makeScrollable.default)(QuizInstructionsShow);
-exports.default = _default;
+}), _QuizInstructionsShow)) || _class);
+var _default = exports["default"] = (0, _makeScrollable["default"])(QuizInstructionsShow);

package/lib/building/components/resources/quiz/instructions/Show/styles.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports["default"] = void 0;
 var generateStyle = function generateStyle(componentTheme) {
   return {
     instructionsShowWrapper: {
@@ -33,5 +33,4 @@ var generateStyle = function generateStyle(componentTheme) {
     }
   };
 };
-var _default = generateStyle;
-exports.default = _default;
+var _default = exports["default"] = generateStyle;

package/lib/building/components/resources/quiz/instructions/Show/theme.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = generator;
+exports["default"] = generator;
 function generator(_ref) {
   var spacing = _ref.spacing,
     colors = _ref.colors,

package/lib/building/components/resources/quiz/title/Edit/index.js

@@ -4,46 +4,48 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.TitleEdit = void 0;
+exports["default"] = exports.TitleEdit = void 0;
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("react");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));
 var _reactDom = _interopRequireDefault(require("react-dom"));
 var _defer = _interopRequireDefault(require("lodash/defer"));
 var _emotion = require("@instructure/emotion");
-var _styles = _interopRequireDefault(require("./styles.js"));
-var _theme = _interopRequireDefault(require("./theme.js"));
-var _Errors = _interopRequireDefault(require("../../../../../../common/components/shared/errors/Errors.js"));
+var _styles = _interopRequireDefault(require("./styles"));
+var _theme = _interopRequireDefault(require("./theme"));
+var _Errors = _interopRequireDefault(require("../../../../../../common/components/shared/errors/Errors"));
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
 var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _TitleEdit;
 /** @jsx jsx */
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 // =================================
 // once editing is toggled this div
 // is rendered & has actions that
 // allow for canceling
 // =================================
-var TitleEdit = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_TitleEdit = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(TitleEdit, _Component);
-  var _super = (0, _createSuper2.default)(TitleEdit);
+var TitleEdit = exports.TitleEdit = (_dec = (0, _quizCommon.withStyleOverrides)(_styles["default"], _theme["default"]), _dec(_class = (_TitleEdit = /*#__PURE__*/function (_Component) {
   function TitleEdit() {
     var _this;
-    (0, _classCallCheck2.default)(this, TitleEdit);
+    (0, _classCallCheck2["default"])(this, TitleEdit);
     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));
-    _this.defer = function (fn) {
+    _this = _callSuper(this, TitleEdit, [].concat(args));
+    (0, _defineProperty2["default"])(_this, "defer", function (fn) {
       // to enable syncronous testing
-      var deferFn = _this.props.deferMock || _defer.default;
+      var deferFn = _this.props.deferMock || _defer["default"];
       deferFn(fn);
-    };
-    _this.switchOffEditing = function () {
-      var fromEnterPressed = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : false;
+    });
+    (0, _defineProperty2["default"])(_this, "switchOffEditing", function () {
+      var fromEnterPressed = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
       _this.ifValidElseError(function () {
         _this.defer(function () {
           if (fromEnterPressed) {
@@ -56,29 +58,31 @@ var TitleEdit = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _th
           }
         });
       });
-    };
-    _this.handleKeyUp = function (e) {
+    });
+    (0, _defineProperty2["default"])(_this, "handleKeyUp", function (e) {
       if (_this.enterPressed && e.keyCode === 13) {
         return _this.switchOffEditing(true);
       }
-    };
-    _this.handleKeyDown = function (e) {
+    });
+    (0, _defineProperty2["default"])(_this, "handleKeyDown", function (e) {
       if (!e.repeat && e.keyCode === 13) {
         _this.enterPressed = true;
       }
-    };
-    _this.handleBlur = function (e) {
+    });
+    (0, _defineProperty2["default"])(_this, "handleBlur", function (e) {
       _this.switchOffEditing(false);
-    };
+    });
     return _this;
   }
-  (0, _createClass2.default)(TitleEdit, [{
+  (0, _inherits2["default"])(TitleEdit, _Component);
+  return (0, _createClass2["default"])(TitleEdit, [{
     key: "componentDidMount",
+    value:
     // todo: extract this into a shared method
     // to be used on many components
-    value: function componentDidMount() {
+    function componentDidMount() {
       this.props.makeStyles();
-      var input = _reactDom.default.findDOMNode(this.input);
+      var input = _reactDom["default"].findDOMNode(this.input);
       // some browsers add chars so * 2 to ensure at end
       var valLength = input.value.length * 2;
       input.focus();
@@ -118,7 +122,7 @@ var TitleEdit = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _th
       if (this.hasErrors()) {
         return (0, _emotion.jsx)("div", {
           css: this.props.styles.errorsWrapper
-        }, (0, _emotion.jsx)(_Errors.default, {
+        }, (0, _emotion.jsx)(_Errors["default"], {
           errorList: this.props.errors
         }));
       }
@@ -136,8 +140,8 @@ var TitleEdit = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _th
       }, (0, _emotion.jsx)("input", {
         ref: this.setRef('input'),
         type: "text",
-        "aria-label": (0, _formatMessage.default)('title'),
-        placeholder: (0, _formatMessage.default)('Add a Title...'),
+        "aria-label": (0, _formatMessage["default"])('title'),
+        placeholder: (0, _formatMessage["default"])('Add a Title...'),
         value: this.props.value,
         onKeyDown: this.handleKeyDown,
         onKeyUp: this.handleKeyUp,
@@ -147,24 +151,20 @@ var TitleEdit = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _th
       })), this.renderErrors());
     }
   }]);
-  TitleEdit.displayName = "TitleEdit";
-  return TitleEdit;
-}(_react.Component), _TitleEdit.displayName = 'TitleEdit', _TitleEdit.componentId = "Quizzes".concat(_TitleEdit.displayName), _TitleEdit.propTypes = {
-  value: _propTypes.default.string.isRequired,
-  isValid: _propTypes.default.bool.isRequired,
-  showError: _propTypes.default.func.isRequired,
-  hideError: _propTypes.default.func.isRequired,
-  errors: _reactImmutableProptypes.default.list.isRequired,
-  errorsAreShowing: _propTypes.default.bool,
-  onInputChange: _propTypes.default.func.isRequired,
-  saveAndPreview: _propTypes.default.func.isRequired,
-  deferMock: _propTypes.default.func,
-  styles: _propTypes.default.object,
-  makeStyles: _propTypes.default.func
-}, _TitleEdit.defaultProps = {
+}(_react.Component), (0, _defineProperty2["default"])(_TitleEdit, "displayName", 'TitleEdit'), (0, _defineProperty2["default"])(_TitleEdit, "componentId", "Quizzes".concat(_TitleEdit.displayName)), (0, _defineProperty2["default"])(_TitleEdit, "propTypes", {
+  value: _propTypes["default"].string.isRequired,
+  isValid: _propTypes["default"].bool.isRequired,
+  showError: _propTypes["default"].func.isRequired,
+  hideError: _propTypes["default"].func.isRequired,
+  errors: _reactImmutableProptypes["default"].list.isRequired,
+  errorsAreShowing: _propTypes["default"].bool,
+  onInputChange: _propTypes["default"].func.isRequired,
+  saveAndPreview: _propTypes["default"].func.isRequired,
+  deferMock: _propTypes["default"].func,
+  styles: _propTypes["default"].object,
+  makeStyles: _propTypes["default"].func
+}), (0, _defineProperty2["default"])(_TitleEdit, "defaultProps", {
   errorsAreShowing: false,
-  deferMock: _defer.default
-}, _TitleEdit)) || _class);
-exports.TitleEdit = TitleEdit;
-var _default = TitleEdit;
-exports.default = _default;
+  deferMock: _defer["default"]
+}), _TitleEdit)) || _class);
+var _default = exports["default"] = TitleEdit;

package/lib/building/components/resources/quiz/title/Edit/styles.js

@@ -4,8 +4,10 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+exports["default"] = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var generateStyle = function generateStyle(componentTheme, props) {
   var wrapperStyles = {
     width: '100%',
@@ -32,7 +34,7 @@ var generateStyle = function generateStyle(componentTheme, props) {
       flexDirection: 'column',
       justifyContent: 'center'
     },
-    titleEditInput: (0, _objectSpread2.default)({
+    titleEditInput: _objectSpread({
       fontFamily: componentTheme.titleEditInputFontFamily,
       fontSize: componentTheme.titleEditInputFontSize
     }, props.errorsAreShowing && props.errors.size > 0 && errorBorderStyles),
@@ -40,5 +42,4 @@ var generateStyle = function generateStyle(componentTheme, props) {
     errorsWrapper: wrapperStyles
   };
 };
-var _default = generateStyle;
-exports.default = _default;
+var _default = exports["default"] = generateStyle;

package/lib/building/components/resources/quiz/title/Edit/theme.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports["default"] = void 0;
 var generateComponentTheme = function generateComponentTheme(_ref) {
   var spacing = _ref.spacing,
     colors = _ref.colors,
@@ -16,9 +16,8 @@ var generateComponentTheme = function generateComponentTheme(_ref) {
     titleEditInputFontSize: typography.fontSizeXLarge,
     errorBorderMargin: spacing.xxSmall,
     errorBorderPadding: spacing.xxSmall,
-    errorBorderColor: colors.contrasts.red4570,
+    errorBorderColor: colors.crimson,
     errorBorderBorderRadius: borders.radiusSmall
   };
 };
-var _default = generateComponentTheme;
-exports.default = _default;
+var _default = exports["default"] = generateComponentTheme;