@instructure/quiz-core 21.1.1 → 22.0.0

package/lib/common/components/shared/drag_and_drop/DragHandle/presenter.js

@@ -1,15 +1,16 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.DragHandle = void 0;
+exports["default"] = exports.DragHandle = 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 = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));
@@ -18,48 +19,59 @@ var _uiButtons = require("@instructure/ui-buttons");
 var _uiMenu = require("@instructure/ui-menu");
 var _uiIcons = require("@instructure/ui-icons");
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
-var _keyboardClickable = _interopRequireDefault(require("../../../../../common/util/keyboardClickable.js"));
+var _keyboardClickable = _interopRequireDefault(require("../../../../../common/util/keyboardClickable"));
 var _quizCommon = require("@instructure/quiz-common");
-var _ref = /*#__PURE__*/_react.default.createElement(_uiIcons.IconArrowUpLine, null);
-var _ref2 = /*#__PURE__*/_react.default.createElement(_uiIcons.IconMiniArrowUpLine, null);
-var _ref3 = /*#__PURE__*/_react.default.createElement(_uiIcons.IconMiniArrowDownLine, null);
-var _ref4 = /*#__PURE__*/_react.default.createElement(_uiIcons.IconArrowDownLine, null);
-var DragHandle = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(DragHandle, _Component);
-  var _super = (0, _createSuper2.default)(DragHandle);
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _callSuper(_this, derived, args) {
+  function isNativeReflectConstruct() {
+    if (typeof Reflect === "undefined" || !Reflect.construct) return false;
+    if (Reflect.construct.sham) return false;
+    if (typeof Proxy === "function") return true;
+    try {
+      return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
+    } catch (e) {
+      return false;
+    }
+  }
+  derived = (0, _getPrototypeOf2["default"])(derived);
+  return (0, _possibleConstructorReturn2["default"])(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], (0, _getPrototypeOf2["default"])(_this).constructor) : derived.apply(_this, args));
+}
+var DragHandle = exports.DragHandle = /*#__PURE__*/function (_Component) {
   function DragHandle() {
-    var _this;
-    (0, _classCallCheck2.default)(this, DragHandle);
+    var _this2;
+    (0, _classCallCheck2["default"])(this, DragHandle);
     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.moveUp = function () {
-      _this.moveToPosition(_this.props.quizEntry.position - 1);
-      var msg = (0, _formatMessage.default)('Question moved one space up.');
-      _this.props.screenreaderNotification(msg);
-    };
-    _this.moveDown = function () {
-      _this.moveToPosition(_this.props.quizEntry.position + 1);
-      var msg = (0, _formatMessage.default)('Question moved one space down.');
-      _this.props.screenreaderNotification(msg);
-    };
-    _this.moveToTop = function () {
-      _this.moveQuizEntry(1, '');
-      var msg = (0, _formatMessage.default)('Question moved to top of assessment.');
-      _this.props.screenreaderNotification(msg);
-    };
-    _this.moveToBottom = function () {
-      _this.moveQuizEntry(_this.props.quizEntries.size, '');
-      var msg = (0, _formatMessage.default)('Question moved to bottom of assessment.');
-      _this.props.screenreaderNotification(msg);
-    };
-    _this.handleTriggerRef = function (node) {
-      _this.triggerRef = node;
-    };
-    return _this;
+    _this2 = _callSuper(this, DragHandle, [].concat(args));
+    (0, _defineProperty2["default"])(_this2, "moveUp", function () {
+      _this2.moveToPosition(_this2.props.quizEntry.position - 1);
+      var msg = (0, _formatMessage["default"])('Question moved one space up.');
+      _this2.props.screenreaderNotification(msg);
+    });
+    (0, _defineProperty2["default"])(_this2, "moveDown", function () {
+      _this2.moveToPosition(_this2.props.quizEntry.position + 1);
+      var msg = (0, _formatMessage["default"])('Question moved one space down.');
+      _this2.props.screenreaderNotification(msg);
+    });
+    (0, _defineProperty2["default"])(_this2, "moveToTop", function () {
+      _this2.moveQuizEntry(1, '');
+      var msg = (0, _formatMessage["default"])('Question moved to top of assessment.');
+      _this2.props.screenreaderNotification(msg);
+    });
+    (0, _defineProperty2["default"])(_this2, "moveToBottom", function () {
+      _this2.moveQuizEntry(_this2.props.quizEntries.size, '');
+      var msg = (0, _formatMessage["default"])('Question moved to bottom of assessment.');
+      _this2.props.screenreaderNotification(msg);
+    });
+    (0, _defineProperty2["default"])(_this2, "handleTriggerRef", function (node) {
+      _this2.triggerRef = node;
+    });
+    return _this2;
   }
-  (0, _createClass2.default)(DragHandle, [{
+  (0, _inherits2["default"])(DragHandle, _Component);
+  return (0, _createClass2["default"])(DragHandle, [{
     key: "componentDidMount",
     value: function componentDidMount() {
       this.conditionalFocus();
@@ -180,7 +192,7 @@ var DragHandle = /*#__PURE__*/function (_Component) {
   }, {
     key: "renderIcon",
     value: function renderIcon() {
-      return /*#__PURE__*/_react.default.createElement(_uiButtons.IconButton
+      return /*#__PURE__*/_react["default"].createElement(_uiButtons.IconButton
       // must be a button when disabled for the screenreader to read it properly
       // must be a div when enabled to allow dragging in firefox
       , {
@@ -190,7 +202,7 @@ var DragHandle = /*#__PURE__*/function (_Component) {
         withBorder: false,
         size: "small",
         ref: this.handleTriggerRef,
-        onKeyDown: _keyboardClickable.default,
+        onKeyDown: _keyboardClickable["default"],
         disabled: this.props.disabled,
         "data-automation": "sdk-drag-handle",
         cursor: "move",
@@ -202,33 +214,38 @@ var DragHandle = /*#__PURE__*/function (_Component) {
     value: function renderMenuItems() {
       var menuItems = [];
       if (!this.isFirstItem()) {
-        menuItems.push(/*#__PURE__*/_react.default.createElement(_uiMenu.Menu.Item, {
+        menuItems.push(/*#__PURE__*/_react["default"].createElement(_uiMenu.Menu.Item, {
           key: "toTop",
           onSelect: this.moveToTop
-        }, _ref, (0, _formatMessage.default)('Move to Top')));
-        menuItems.push(/*#__PURE__*/_react.default.createElement(_uiMenu.Menu.Item, {
+        }, /*#__PURE__*/_react["default"].createElement(_uiIcons.IconArrowUpLine, null), (0, _formatMessage["default"])('Move to Top')));
+        menuItems.push(/*#__PURE__*/_react["default"].createElement(_uiMenu.Menu.Item, {
           key: "moveUp",
           onSelect: this.moveUp
-        }, _ref2, (0, _formatMessage.default)('Move Up')));
+        }, /*#__PURE__*/_react["default"].createElement(_uiIcons.IconMiniArrowUpLine, null), (0, _formatMessage["default"])('Move Up')));
       }
       if (!this.isLastItem() || this.props.quizEntry.isInStimulus) {
-        menuItems.push(/*#__PURE__*/_react.default.createElement(_uiMenu.Menu.Item, {
+        menuItems.push(/*#__PURE__*/_react["default"].createElement(_uiMenu.Menu.Item, {
           key: "moveDown",
           onSelect: this.moveDown
-        }, _ref3, (0, _formatMessage.default)('Move Down')));
-        menuItems.push(/*#__PURE__*/_react.default.createElement(_uiMenu.Menu.Item, {
+        }, /*#__PURE__*/_react["default"].createElement(_uiIcons.IconMiniArrowDownLine, null), (0, _formatMessage["default"])('Move Down')));
+        menuItems.push(/*#__PURE__*/_react["default"].createElement(_uiMenu.Menu.Item, {
           key: "toBottom",
           onSelect: this.moveToBottom
-        }, _ref4, (0, _formatMessage.default)('Move to Bottom')));
+        }, /*#__PURE__*/_react["default"].createElement(_uiIcons.IconArrowDownLine, null), (0, _formatMessage["default"])('Move to Bottom')));
       }
       return menuItems;
     }
+  }, {
+    key: "sidebarNav",
+    get: function get() {
+      return document.getElementById(_quizCommon.SIDEBAR_NAV_ID);
+    }
   }, {
     key: "render",
     value: function render() {
       var menuItems = this.renderMenuItems();
       if (!this.props.disabled && menuItems.length > 0) {
-        return /*#__PURE__*/_react.default.createElement(_uiMenu.Menu, {
+        return /*#__PURE__*/_react["default"].createElement(_uiMenu.Menu, {
           trigger: this.renderIcon(),
           onToggle: this.setFocused,
           mountNode: this.props.onSidebar ? this.sidebarNav : void 0,
@@ -237,37 +254,28 @@ var DragHandle = /*#__PURE__*/function (_Component) {
       }
       return this.renderIcon();
     }
-  }, {
-    key: "sidebarNav",
-    get: function get() {
-      return document.getElementById(_quizCommon.SIDEBAR_NAV_ID);
-    }
   }]);
-  DragHandle.displayName = "DragHandle";
-  return DragHandle;
 }(_react.Component);
-exports.DragHandle = DragHandle;
-DragHandle.propTypes = {
-  clearUI: _propTypes.default.func.isRequired,
-  disabled: _propTypes.default.bool,
-  displayPosition: _propTypes.default.number.isRequired,
-  moveTemporaryQuizEntry: _propTypes.default.func.isRequired,
-  moveQuizEntry: _propTypes.default.func.isRequired,
-  movedInSidebar: _propTypes.default.bool,
-  movedQuizEntry: _propTypes.default.string,
-  onSidebar: _propTypes.default.bool,
-  openMoveImmutableModal: _propTypes.default.func.isRequired,
-  quizEntry: _reactImmutableProptypes.default.record.isRequired,
-  quizEntries: _reactImmutableProptypes.default.listOf(_reactImmutableProptypes.default.record).isRequired,
-  quizId: _propTypes.default.string.isRequired,
-  screenreaderNotification: _propTypes.default.func.isRequired,
-  setUI: _propTypes.default.func.isRequired
-};
-DragHandle.defaultProps = {
+(0, _defineProperty2["default"])(DragHandle, "propTypes", {
+  clearUI: _propTypes["default"].func.isRequired,
+  disabled: _propTypes["default"].bool,
+  displayPosition: _propTypes["default"].number.isRequired,
+  moveTemporaryQuizEntry: _propTypes["default"].func.isRequired,
+  moveQuizEntry: _propTypes["default"].func.isRequired,
+  movedInSidebar: _propTypes["default"].bool,
+  movedQuizEntry: _propTypes["default"].string,
+  onSidebar: _propTypes["default"].bool,
+  openMoveImmutableModal: _propTypes["default"].func.isRequired,
+  quizEntry: _reactImmutableProptypes["default"].record.isRequired,
+  quizEntries: _reactImmutableProptypes["default"].listOf(_reactImmutableProptypes["default"].record).isRequired,
+  quizId: _propTypes["default"].string.isRequired,
+  screenreaderNotification: _propTypes["default"].func.isRequired,
+  setUI: _propTypes["default"].func.isRequired
+});
+(0, _defineProperty2["default"])(DragHandle, "defaultProps", {
   disabled: false,
   movedQuizEntry: '',
   movedInSidebar: null,
   onSidebar: false
-};
-var _default = DragHandle;
-exports.default = _default;
+});
+var _default = exports["default"] = DragHandle;

package/lib/common/components/shared/drag_and_drop/dragAndDropUtils.js

@@ -4,28 +4,31 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.ItemTypes = exports.DropTargetCreator = void 0;
+exports.beginQuizEntryDrag = beginQuizEntryDrag;
+exports.chooseDragConnection = chooseDragConnection;
+exports.collectDrag = collectDrag;
+exports.collectDrop = collectDrop;
+exports.dropTarget = exports.dragSource = void 0;
+exports.endQuizEntryDrag = endQuizEntryDrag;
 exports.getBoundsForComponent = getBoundsForComponent;
-exports.posObjFromNonQuizEntry = posObjFromNonQuizEntry;
 exports.onQuizEntryDrop = onQuizEntryDrop;
-exports.collectDrop = collectDrop;
+exports.onQuizEntryHover = void 0;
+exports.posObjFromNonQuizEntry = posObjFromNonQuizEntry;
+exports.posObjFromQuizEntry = void 0;
 exports.usingIE = usingIE;
-exports.chooseDragConnection = chooseDragConnection;
-exports.beginQuizEntryDrag = beginQuizEntryDrag;
-exports.endQuizEntryDrag = endQuizEntryDrag;
-exports.collectDrag = collectDrag;
-exports.dragSource = exports.DropTargetCreator = exports.dropTarget = exports.ItemTypes = exports.onQuizEntryHover = exports.posObjFromQuizEntry = void 0;
 var _reactDom = _interopRequireDefault(require("react-dom"));
 var _lodash = require("lodash");
 var _immutable = require("immutable");
 var _reactDnd = require("react-dnd");
-var _cachePreviousArgs = _interopRequireDefault(require("../../../util/cachePreviousArgs.js"));
+var _cachePreviousArgs = _interopRequireDefault(require("../../../util/cachePreviousArgs"));
 var _quizCommon = require("@instructure/quiz-common");
 function getBoundsForComponent(component) {
   var dndComponent = component.dndComponent ? component.dndComponent : component;
-  var DOMNode = _reactDom.default.findDOMNode(dndComponent);
+  var DOMNode = _reactDom["default"].findDOMNode(dndComponent);
   return DOMNode && DOMNode.getBoundingClientRect() || {};
 }
-var posObjFromQuizEntry = (0, _cachePreviousArgs.default)(function (quizEntryDragging, quizEntryHovered, mousePos, component, inSidebar) {
+var posObjFromQuizEntry = exports.posObjFromQuizEntry = (0, _cachePreviousArgs["default"])(function (quizEntryDragging, quizEntryHovered, mousePos, component, inSidebar) {
   var _getBoundsForComponen = getBoundsForComponent(component),
     top = _getBoundsForComponen.top,
     bottom = _getBoundsForComponen.bottom,
@@ -65,7 +68,6 @@ var posObjFromQuizEntry = (0, _cachePreviousArgs.default)(function (quizEntryDra
   }
   return newPositionObj;
 });
-exports.posObjFromQuizEntry = posObjFromQuizEntry;
 function posObjFromNonQuizEntry(quizEntryDragging, startComp, endComp, mousePos, quizEntries) {
   // check if dropping above all quizEntries
   var _getBoundsForComponen2 = getBoundsForComponent(startComp),
@@ -119,8 +121,8 @@ function createPositionObj(props, monitor, component, inSidebar) {
 }
 
 // createPosition arg is so that tests can stub it
-var onQuizEntryHover = (0, _lodash.debounce)(function (props, monitor, component, refname) {
-  var createPosition = arguments.length > 4 && arguments[4] !== void 0 ? arguments[4] : createPositionObj;
+var onQuizEntryHover = exports.onQuizEntryHover = (0, _lodash.debounce)(function (props, monitor, component, refname) {
+  var createPosition = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : createPositionObj;
   var inSidebar = refname === _quizCommon.SIDEBAR_ITEM_REF;
   if (inSidebar && !props.sidebarOpen) {
     return;
@@ -147,7 +149,6 @@ var onQuizEntryHover = (0, _lodash.debounce)(function (props, monitor, component
   });
   props.newHoverPosition(newPositionObj);
 });
-exports.onQuizEntryHover = onQuizEntryHover;
 function positionOfTempItem(quizEntries) {
   // TODO: replace the use of chain with lodash/fp functions and flow
   return (0, _lodash.chain)(quizEntries.toJS()).sortBy(function (qe) {
@@ -275,11 +276,10 @@ function collectDrop(connect, monitor) {
     isOver: monitor.isOver()
   };
 }
-var ItemTypes = {
+var ItemTypes = exports.ItemTypes = {
   QUIZ_ENTRY: 'quiz_entry'
 };
-exports.ItemTypes = ItemTypes;
-var dropTarget = function dropTarget(refname) {
+var dropTarget = exports.dropTarget = function dropTarget(refname) {
   return {
     drop: function drop(props, monitor, component) {
       return onQuizEntryDrop(props, monitor, component, refname);
@@ -293,17 +293,16 @@ var dropTarget = function dropTarget(refname) {
 // - ItemTypes.QUIZ_ENTRY associates this component drop target with a name
 // - dropTarget specifies functions React DnD will call for events with this component
 // - collectDrop injects props into component
-exports.dropTarget = dropTarget;
-var DropTargetCreator = function DropTargetCreator(refname) {
+var DropTargetCreator = exports.DropTargetCreator = function DropTargetCreator(refname) {
   return (0, _reactDnd.DropTarget)(ItemTypes.QUIZ_ENTRY, dropTarget(refname), collectDrop);
 };
 
 // ///////////////// //
 // DRAG SOURCE STUFF //
 // ///////////////// //
-exports.DropTargetCreator = DropTargetCreator;
+
 function usingIE() {
-  var windowOverride = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : window;
+  var windowOverride = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : window;
   var ua = windowOverride.navigator.userAgent;
   var edge = ua.includes('Edge/');
   var ie11 = ua.includes('Trident/');
@@ -311,7 +310,7 @@ function usingIE() {
   return edge || ie11 || ie10;
 }
 function chooseDragConnection(dragSource, dragPreview) {
-  var windowOverride = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : window;
+  var windowOverride = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : window;
   return usingIE(windowOverride) ? dragSource : dragPreview;
 }
 function beginQuizEntryDrag(props, monitor, component) {
@@ -325,11 +324,10 @@ function endQuizEntryDrag(props, monitor, component) {
     position: -1
   });
 }
-var dragSource = {
+var dragSource = exports.dragSource = {
   beginDrag: beginQuizEntryDrag,
   endDrag: endQuizEntryDrag
 };
-exports.dragSource = dragSource;
 function collectDrag(connect, monitor) {
   return {
     connectDragSource: connect.dragSource(),

package/lib/common/components/shared/errors/Errors.js

@@ -4,42 +4,57 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.Errors = void 0;
+exports["default"] = exports.Errors = 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 _immutable = require("immutable");
 var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _emotion = require("@instructure/emotion");
-var _styles = _interopRequireDefault(require("./styles.js"));
-var _theme = _interopRequireDefault(require("./theme.js"));
+var _styles = _interopRequireDefault(require("./styles"));
+var _theme = _interopRequireDefault(require("./theme"));
 var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _Errors;
 /** @jsx jsx */
-var Errors = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_Errors = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(Errors, _Component);
-  var _super = (0, _createSuper2.default)(Errors);
+function _callSuper(_this, derived, args) {
+  function isNativeReflectConstruct() {
+    if (typeof Reflect === "undefined" || !Reflect.construct) return false;
+    if (Reflect.construct.sham) return false;
+    if (typeof Proxy === "function") return true;
+    try {
+      return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
+    } catch (e) {
+      return false;
+    }
+  }
+  derived = (0, _getPrototypeOf2["default"])(derived);
+  return (0, _possibleConstructorReturn2["default"])(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], (0, _getPrototypeOf2["default"])(_this).constructor) : derived.apply(_this, args));
+}
+var Errors = exports.Errors = (_dec = (0, _quizCommon.withStyleOverrides)(_styles["default"], _theme["default"]), _dec(_class = (_Errors = /*#__PURE__*/function (_Component) {
   function Errors() {
-    var _this;
-    (0, _classCallCheck2.default)(this, Errors);
+    var _this2;
+    (0, _classCallCheck2["default"])(this, Errors);
     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.renderError = function (errorText, i) {
+    _this2 = _callSuper(this, Errors, [].concat(args));
+    (0, _defineProperty2["default"])(_this2, "renderError", function (errorText, i) {
       var key = "error_for_".concat(i);
       return (0, _emotion.jsx)("div", {
-        css: _this.props.styles.error,
+        css: _this2.props.styles.error,
         key: key,
         "data-automation": "sdk-core-error"
       }, errorText);
-    };
-    return _this;
+    });
+    return _this2;
   }
-  (0, _createClass2.default)(Errors, [{
+  (0, _inherits2["default"])(Errors, _Component);
+  return (0, _createClass2["default"])(Errors, [{
     key: "render",
     value: function render() {
       var _this$props$errorList;
@@ -52,14 +67,10 @@ var Errors = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme
       }, (_this$props$errorList = this.props.errorList) === null || _this$props$errorList === void 0 ? void 0 : _this$props$errorList.toArray().map(this.renderError));
     }
   }]);
-  Errors.displayName = "Errors";
-  return Errors;
-}(_react.Component), _Errors.displayName = 'Errors', _Errors.componentId = "Quizzes".concat(_Errors.displayName), _Errors.propTypes = {
-  errorList: _reactImmutableProptypes.default.list,
-  styles: _propTypes.default.object
-}, _Errors.defaultProps = {
+}(_react.Component), (0, _defineProperty2["default"])(_Errors, "displayName", 'Errors'), (0, _defineProperty2["default"])(_Errors, "componentId", "Quizzes".concat(_Errors.displayName)), (0, _defineProperty2["default"])(_Errors, "propTypes", {
+  errorList: _reactImmutableProptypes["default"].list,
+  styles: _propTypes["default"].object
+}), (0, _defineProperty2["default"])(_Errors, "defaultProps", {
   errorList: (0, _immutable.List)()
-}, _Errors)) || _class);
-exports.Errors = Errors;
-var _default = Errors;
-exports.default = _default;
+}), _Errors)) || _class);
+var _default = exports["default"] = Errors;

package/lib/common/components/shared/errors/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 {
     errors: {
@@ -19,5 +19,4 @@ var generateStyle = function generateStyle(componentTheme) {
     }
   };
 };
-var _default = generateStyle;
-exports.default = _default;
+var _default = exports["default"] = generateStyle;

package/lib/common/components/shared/errors/theme.js

@@ -3,15 +3,14 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports["default"] = void 0;
 var generateComponentTheme = function generateComponentTheme(_ref) {
   var colors = _ref.colors,
     typography = _ref.typography;
   return {
     errorFontFamily: typography.fontFamily,
     errorFontSize: typography.fontSizeSmall,
-    errorColor: colors.crimson
+    errorColor: colors.contrasts.red4570
   };
 };
-var _default = generateComponentTheme;
-exports.default = _default;
+var _default = exports["default"] = generateComponentTheme;

package/lib/common/components/shared/file_selector/FileSelector.js

@@ -4,33 +4,47 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.FileSelector = void 0;
+exports["default"] = exports.FileSelector = void 0;
 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 _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 _immutable = require("immutable");
 var _react = require("react");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _reactDropzone = _interopRequireDefault(require("react-dropzone"));
 var _emotion = require("@instructure/emotion");
-var _styles = _interopRequireDefault(require("./styles.js"));
-var _theme = _interopRequireDefault(require("./theme.js"));
+var _styles = _interopRequireDefault(require("./styles"));
+var _theme = _interopRequireDefault(require("./theme"));
 var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _FileSelector;
 /** @jsx jsx */
-var FileSelector = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_FileSelector = /*#__PURE__*/function (_Component) {
-  (0, _inherits2.default)(FileSelector, _Component);
-  var _super = (0, _createSuper2.default)(FileSelector);
+function _callSuper(_this, derived, args) {
+  function isNativeReflectConstruct() {
+    if (typeof Reflect === "undefined" || !Reflect.construct) return false;
+    if (Reflect.construct.sham) return false;
+    if (typeof Proxy === "function") return true;
+    try {
+      return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
+    } catch (e) {
+      return false;
+    }
+  }
+  derived = (0, _getPrototypeOf2["default"])(derived);
+  return (0, _possibleConstructorReturn2["default"])(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], (0, _getPrototypeOf2["default"])(_this).constructor) : derived.apply(_this, args));
+}
+var FileSelector = exports.FileSelector = (_dec = (0, _quizCommon.withStyleOverrides)(_styles["default"], _theme["default"]), _dec(_class = (_FileSelector = /*#__PURE__*/function (_Component) {
   function FileSelector() {
-    var _this;
-    (0, _classCallCheck2.default)(this, FileSelector);
-    _this = _super.call(this);
-    _this.onDrop = _this.onDrop.bind((0, _assertThisInitialized2.default)(_this));
-    return _this;
+    var _this2;
+    (0, _classCallCheck2["default"])(this, FileSelector);
+    _this2 = _callSuper(this, FileSelector);
+    _this2.onDrop = _this2.onDrop.bind(_this2);
+    return _this2;
   }
-  (0, _createClass2.default)(FileSelector, [{
+  (0, _inherits2["default"])(FileSelector, _Component);
+  return (0, _createClass2["default"])(FileSelector, [{
     key: "onDrop",
     value: function onDrop(files) {
       this.props.fileHandler((0, _immutable.List)(files));
@@ -43,7 +57,7 @@ var FileSelector = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default,
   }, {
     key: "render",
     value: function render() {
-      return (0, _emotion.jsx)("div", null, (0, _emotion.jsx)(_reactDropzone.default, {
+      return (0, _emotion.jsx)("div", null, (0, _emotion.jsx)(_reactDropzone["default"], {
         "data-testid": "file-dropzone",
         css: this.props.styles.dropzone,
         multiple: this.props.multiple,
@@ -52,17 +66,13 @@ var FileSelector = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default,
       }, this.renderContent()));
     }
   }]);
-  FileSelector.displayName = "FileSelector";
-  return FileSelector;
-}(_react.Component), _FileSelector.displayName = 'FileSelector', _FileSelector.componentId = "Quizzes".concat(_FileSelector.displayName), _FileSelector.propTypes = {
-  acceptAttribute: _propTypes.default.string.isRequired,
-  content: _propTypes.default.node.isRequired,
-  fileHandler: _propTypes.default.func.isRequired,
-  multiple: _propTypes.default.bool,
-  styles: _propTypes.default.object
-}, _FileSelector.defaultProps = {
+}(_react.Component), (0, _defineProperty2["default"])(_FileSelector, "displayName", 'FileSelector'), (0, _defineProperty2["default"])(_FileSelector, "componentId", "Quizzes".concat(_FileSelector.displayName)), (0, _defineProperty2["default"])(_FileSelector, "propTypes", {
+  acceptAttribute: _propTypes["default"].string.isRequired,
+  content: _propTypes["default"].node.isRequired,
+  fileHandler: _propTypes["default"].func.isRequired,
+  multiple: _propTypes["default"].bool,
+  styles: _propTypes["default"].object
+}), (0, _defineProperty2["default"])(_FileSelector, "defaultProps", {
   multiple: false
-}, _FileSelector)) || _class);
-exports.FileSelector = FileSelector;
-var _default = FileSelector;
-exports.default = _default;
+}), _FileSelector)) || _class);
+var _default = exports["default"] = FileSelector;

package/lib/common/components/shared/file_selector/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 {
     dropzone: {
@@ -14,5 +14,4 @@ var generateStyle = function generateStyle(componentTheme) {
     }
   };
 };
-var _default = generateStyle;
-exports.default = _default;
+var _default = exports["default"] = generateStyle;

package/lib/common/components/shared/file_selector/theme.js

@@ -3,17 +3,16 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports["default"] = void 0;
 var generateComponentTheme = function generateComponentTheme(_ref) {
   var colors = _ref.colors,
     spacing = _ref.spacing,
     borders = _ref.borders;
   return {
-    dropzoneBackgroundColor: colors.porcelain,
+    dropzoneBackgroundColor: colors.contrasts.grey1111,
     dropzoneBorderWidth: borders.widthSmall,
-    dropzoneBorderColor: colors.ash,
+    dropzoneBorderColor: colors.contrasts.grey4570,
     dropzonePadding: spacing.medium
   };
 };
-var _default = generateComponentTheme;
-exports.default = _default;
+var _default = exports["default"] = generateComponentTheme;