@instructure/quiz-core 20.34.1-test.7 → 20.35.0

package/lib/common/components/resources/stimulus/StimulusShow/index.js

@@ -20,11 +20,12 @@ var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/f
 var _styles = _interopRequireDefault(require("./styles.js"));
 var _theme = _interopRequireDefault(require("./theme.js"));
 var _index3 = _interopRequireDefault(require("../../../shared/overlay/index.js"));
+var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _StimulusShow;
 /** @jsx jsx */
 /* eslint "jsx-a11y/click-events-have-key-events": "warn" */
 var _ref = (0, _emotion.jsx)(_uiIcons.IconBankLine, null);
-var StimulusShow = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_StimulusShow = /*#__PURE__*/function (_Component) {
+var StimulusShow = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_StimulusShow = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(StimulusShow, _Component);
   var _super = (0, _createSuper2.default)(StimulusShow);
   function StimulusShow() {
@@ -87,7 +88,7 @@ var StimulusShow = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.defau
   }]);
   StimulusShow.displayName = "StimulusShow";
   return StimulusShow;
-}(_react.Component), _StimulusShow.propTypes = {
+}(_react.Component), _StimulusShow.displayName = 'StimulusShow', _StimulusShow.componentId = "Quizzes".concat(_StimulusShow.displayName), _StimulusShow.propTypes = {
   connectDragSource: _propTypes.default.func.isRequired,
   displayPosition: _propTypes.default.number.isRequired,
   isBankedContent: _propTypes.default.bool,

package/lib/common/components/shared/Card/CardContent/index.js

@@ -16,9 +16,10 @@ var _emotion = require("@instructure/emotion");
 var _uiView = require("@instructure/ui-view");
 var _styles = _interopRequireDefault(require("./styles.js"));
 var _theme = _interopRequireDefault(require("./theme.js"));
+var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _CardContent;
 /** @jsx jsx */
-var CardContent = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_CardContent = /*#__PURE__*/function (_Component) {
+var CardContent = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_CardContent = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(CardContent, _Component);
   var _super = (0, _createSuper2.default)(CardContent);
   function CardContent() {
@@ -38,7 +39,7 @@ var CardContent = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.defaul
   }]);
   CardContent.displayName = "CardContent";
   return CardContent;
-}(_react.Component), _CardContent.propTypes = {
+}(_react.Component), _CardContent.displayName = 'CardContent', _CardContent.componentId = "Quizzes".concat(_CardContent.displayName), _CardContent.propTypes = {
   children: _propTypes.default.node.isRequired,
   customStyles: _propTypes.default.object,
   styles: _propTypes.default.object,

package/lib/common/components/shared/Card/CardWrapper/index.js

@@ -16,9 +16,10 @@ var _emotion = require("@instructure/emotion");
 var _uiView = require("@instructure/ui-view");
 var _styles = _interopRequireDefault(require("./styles.js"));
 var _theme = _interopRequireDefault(require("./theme.js"));
+var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _CardWrapper;
 /** @jsx jsx */
-var CardWrapper = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_CardWrapper = /*#__PURE__*/function (_Component) {
+var CardWrapper = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_CardWrapper = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(CardWrapper, _Component);
   var _super = (0, _createSuper2.default)(CardWrapper);
   function CardWrapper() {
@@ -38,7 +39,7 @@ var CardWrapper = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.defaul
   }]);
   CardWrapper.displayName = "CardWrapper";
   return CardWrapper;
-}(_react.Component), _CardWrapper.propTypes = {
+}(_react.Component), _CardWrapper.displayName = 'CardWrapper', _CardWrapper.componentId = "Quizzes".concat(_CardWrapper.displayName), _CardWrapper.propTypes = {
   children: _propTypes.default.node.isRequired,
   customStyles: _propTypes.default.object,
   styles: _propTypes.default.object

package/lib/common/components/shared/ExpandButton/index.js

@@ -17,9 +17,10 @@ var _emotion = require("@instructure/emotion");
 var _uiReactUtils = require("@instructure/ui-react-utils");
 var _styles = _interopRequireDefault(require("./styles.js"));
 var _theme = _interopRequireDefault(require("./theme.js"));
+var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _ExpandButton;
 /** @jsx jsx */
-var ExpandButton = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_ExpandButton = /*#__PURE__*/function (_Component) {
+var ExpandButton = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_ExpandButton = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(ExpandButton, _Component);
   var _super = (0, _createSuper2.default)(ExpandButton);
   function ExpandButton() {
@@ -60,7 +61,7 @@ var ExpandButton = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.defau
   }]);
   ExpandButton.displayName = "ExpandButton";
   return ExpandButton;
-}(_react.Component), _ExpandButton.propTypes = {
+}(_react.Component), _ExpandButton.displayName = 'ExpandButton', _ExpandButton.componentId = "Quizzes".concat(_ExpandButton.displayName), _ExpandButton.propTypes = {
   isExpanded: _propTypes.default.bool.isRequired,
   title: _propTypes.default.string.isRequired,
   onClick: _propTypes.default.func.isRequired,

package/lib/common/components/shared/GenericAsyncSearch/GenericAsyncSearch.js

@@ -0,0 +1,188 @@
+"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.GenericAsyncSearch = void 0;
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _debounce = _interopRequireDefault(require("lodash/fp/debounce"));
+var _uiSelect = require("@instructure/ui-select");
+var _uiSpinner = require("@instructure/ui-spinner");
+var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
+var _quizCommon = require("@instructure/quiz-common");
+var GenericAsyncSearch = /*#__PURE__*/function (_Component) {
+  (0, _inherits2.default)(GenericAsyncSearch, _Component);
+  var _super = (0, _createSuper2.default)(GenericAsyncSearch);
+  function GenericAsyncSearch() {
+    var _this;
+    (0, _classCallCheck2.default)(this, GenericAsyncSearch);
+    _this = _super.apply(this, arguments);
+    _this.setInputRef = function (inputRef) {
+      _this.inputRef = inputRef;
+    };
+    _this.state = {
+      inputValue: _this.props.selectedOption ? _this.props.selectedOption.text : '',
+      isShowingOptions: false,
+      isLoading: false,
+      highlightedOptionId: null,
+      shareableSubaccounts: [],
+      options: []
+    };
+    _this.handleShowOptions = function () {
+      _this.setState({
+        isShowingOptions: true
+      });
+    };
+    _this.close = function (inputValue) {
+      return _this.setState({
+        isShowingOptions: false,
+        highlightedOptionId: null,
+        inputValue: inputValue
+      });
+    };
+    _this.handleBlur = function () {
+      var _this$props$selectedO;
+      return _this.close(((_this$props$selectedO = _this.props.selectedOption) === null || _this$props$selectedO === void 0 ? void 0 : _this$props$selectedO.text) || '');
+    };
+    _this.handleHighlightOption = function (event, optionIdentifier) {
+      event.persist();
+      var option = _this.getOption(optionIdentifier.id);
+      _this.setState({
+        highlightedOptionId: option === null || option === void 0 ? void 0 : option.id,
+        inputValue: event.type === 'keydown' ? option === null || option === void 0 ? void 0 : option.text : _this.state.inputValue
+      });
+    };
+    _this.handleSelectOption = function (event, optionIdentifier) {
+      if (!optionIdentifier || !optionIdentifier.id || optionIdentifier.id === _quizCommon.SELECT_EMPTY_OPTION) return;
+      var option = _this.getOption(optionIdentifier.id);
+      _this.props.onSelectionChange(event, option);
+      _this.close(option.text);
+    };
+    _this.handleInputChange = function (event) {
+      var value = event.target.value;
+      var shouldSearch = !!value && value.length >= _this.props.minChars;
+      _this.setState({
+        inputValue: value,
+        isShowingOptions: true
+      });
+      if (shouldSearch) {
+        _this.setState({
+          isLoading: true,
+          options: [],
+          highlightedOptionId: null
+        });
+        _this.search(value);
+      }
+    };
+    _this.handleKeyDown = function (event) {
+      if (event.keyCode === 8 && _this.state.inputValue === '') {
+        // when backspace key is pressed
+        _this.setState({
+          highlightedOptionId: null
+        });
+      }
+    };
+    _this.actualOptions = function () {
+      return _this.state.options.map(function (option) {
+        return /*#__PURE__*/_react.default.createElement(_uiSelect.Select.Option, {
+          id: option.id,
+          key: option.id,
+          isHighlighted: option.id === _this.state.highlightedOptionId
+        }, option.text);
+      });
+    };
+    _this.emptyOptionText = function () {
+      if (_this.props.minChars > 1 && _this.state.inputValue < _this.props.minChars) {
+        return (0, _formatMessage.default)('Search term must be at least { minChars } characters', {
+          minChars: _this.props.minChars
+        });
+      }
+      return _this.state.inputValue === '' ? (0, _formatMessage.default)('Write to search') : (0, _formatMessage.default)('No Results');
+    };
+    _this.emptyOrLoadingOption = function () {
+      return /*#__PURE__*/_react.default.createElement(_uiSelect.Select.Option, {
+        id: _quizCommon.SELECT_EMPTY_OPTION,
+        key: _quizCommon.SELECT_EMPTY_OPTION
+      }, _this.state.isLoading ? /*#__PURE__*/_react.default.createElement(_uiSpinner.Spinner, {
+        renderTitle: (0, _formatMessage.default)('Loading'),
+        size: "x-small"
+      }) : _this.emptyOptionText());
+    };
+    _this.renderOptions = function () {
+      return _this.state.options.length ? _this.actualOptions() : _this.emptyOrLoadingOption();
+    };
+    _this.search = (0, _debounce.default)(_this.props.debounceDelay, function (value) {
+      _this.props.getOptions(value).then(function (options) {
+        var _options$;
+        _this.setState({
+          options: options,
+          highlightedOptionId: ((_options$ = options[0]) === null || _options$ === void 0 ? void 0 : _options$.id) || null,
+          isLoading: false
+        });
+      });
+    });
+    return _this;
+  }
+  (0, _createClass2.default)(GenericAsyncSearch, [{
+    key: "getOption",
+    value: function getOption(queryId) {
+      return this.state.options.find(function (_ref) {
+        var id = _ref.id;
+        return id === queryId;
+      });
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      return /*#__PURE__*/_react.default.createElement(_uiSelect.Select, {
+        "data-automation": this.props.selectAutomation,
+        renderLabel: this.props.label,
+        placeholder: this.props.placeholder,
+        inputValue: this.state.inputValue,
+        isShowingOptions: this.state.isShowingOptions,
+        inputRef: this.setInputRef,
+        onBlur: this.handleBlur,
+        onRequestHideOptions: this.handleBlur,
+        onInputChange: this.handleInputChange,
+        onRequestShowOptions: this.handleShowOptions,
+        onRequestHighlightOption: this.handleHighlightOption,
+        onRequestSelectOption: this.handleSelectOption,
+        onKeyDown: this.handleKeyDown,
+        messages: this.props.messages
+      }, this.renderOptions());
+    }
+  }]);
+  GenericAsyncSearch.displayName = "GenericAsyncSearch";
+  return GenericAsyncSearch;
+}(_react.Component);
+exports.GenericAsyncSearch = GenericAsyncSearch;
+GenericAsyncSearch.propTypes = {
+  debounceDelay: _propTypes.default.number,
+  minChars: _propTypes.default.number,
+  onSelectionChange: _propTypes.default.func.isRequired,
+  label: _propTypes.default.string,
+  placeholder: _propTypes.default.string,
+  selectedOption: _propTypes.default.shape({
+    id: _propTypes.default.number,
+    text: _propTypes.default.string
+  }),
+  messages: _propTypes.default.array,
+  selectAutomation: _propTypes.default.string,
+  getOptions: _propTypes.default.func.isRequired
+};
+GenericAsyncSearch.defaultProps = {
+  debounceDelay: 500,
+  minChars: 3,
+  label: null,
+  placeholder: null,
+  selectAutomation: null
+};
+var _default = GenericAsyncSearch;
+exports.default = _default;

package/lib/common/components/shared/InteractionTypes/presenter.js

@@ -24,9 +24,10 @@ var _interactionTypeMetadata = require("../../../util/interactionTypeMetadata.js
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
 var _styles = _interopRequireDefault(require("./styles.js"));
 var _theme = _interopRequireDefault(require("./theme.js"));
+var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _InteractionTypes;
 /** @jsx jsx */
-var InteractionTypes = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_InteractionTypes = /*#__PURE__*/function (_Component) {
+var InteractionTypes = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_InteractionTypes = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(InteractionTypes, _Component);
   var _super = (0, _createSuper2.default)(InteractionTypes);
   function InteractionTypes() {
@@ -140,7 +141,7 @@ var InteractionTypes = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.d
   }]);
   InteractionTypes.displayName = "InteractionTypes";
   return InteractionTypes;
-}(_react.Component), _InteractionTypes.propTypes = {
+}(_react.Component), _InteractionTypes.displayName = 'InteractionTypes', _InteractionTypes.componentId = "Quizzes".concat(_InteractionTypes.displayName), _InteractionTypes.propTypes = {
   columns: _propTypes.default.number.isRequired,
   addItem: _propTypes.default.func.isRequired,
   addStimulus: _propTypes.default.func.isRequired,

package/lib/common/components/shared/PaginatedCollection/presenter.js

@@ -22,6 +22,7 @@ var _index = _interopRequireDefault(require("../Paginator/index.js"));
 var _Spinner = _interopRequireDefault(require("../spinner/Spinner.js"));
 var _styles = _interopRequireDefault(require("./styles.js"));
 var _theme = _interopRequireDefault(require("./theme.js"));
+var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _PaginatedCollection;
 /** @jsx jsx */
 /**
@@ -38,7 +39,7 @@ var _dec, _class, _PaginatedCollection;
  * `params` change.
  */
 var _ref2 = (0, _emotion.jsx)(_Spinner.default, null);
-var PaginatedCollection = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_PaginatedCollection = /*#__PURE__*/function (_Component) {
+var PaginatedCollection = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_PaginatedCollection = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(PaginatedCollection, _Component);
   var _super = (0, _createSuper2.default)(PaginatedCollection);
   function PaginatedCollection() {
@@ -163,7 +164,7 @@ var PaginatedCollection = (_dec = (0, _emotion.withStyle)(_styles.default, _them
   }]);
   PaginatedCollection.displayName = "PaginatedCollection";
   return PaginatedCollection;
-}(_react.Component), _PaginatedCollection.propTypes = {
+}(_react.Component), _PaginatedCollection.displayName = 'PaginatedCollection', _PaginatedCollection.componentId = "Quizzes".concat(_PaginatedCollection.displayName), _PaginatedCollection.propTypes = {
   currentPage: _propTypes.default.number.isRequired,
   contents: _reactImmutableProptypes.default.map.isRequired,
   empty: _propTypes.default.node,

package/lib/common/components/shared/Paginator/index.js

@@ -16,9 +16,10 @@ var _emotion = require("@instructure/emotion");
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
 var _styles = _interopRequireDefault(require("./styles.js"));
 var _theme = _interopRequireDefault(require("./theme.js"));
+var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _Paginator;
 /** @jsx jsx */
-var Paginator = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_Paginator = /*#__PURE__*/function (_Component) {
+var Paginator = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_Paginator = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(Paginator, _Component);
   var _super = (0, _createSuper2.default)(Paginator);
   function Paginator() {
@@ -53,7 +54,7 @@ var Paginator = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default)
   }]);
   Paginator.displayName = "Paginator";
   return Paginator;
-}(_react.Component), _Paginator.propTypes = {
+}(_react.Component), _Paginator.displayName = 'Paginator', _Paginator.componentId = "Quizzes".concat(_Paginator.displayName), _Paginator.propTypes = {
   children: _propTypes.default.node.isRequired,
   currentPage: _propTypes.default.number.isRequired,
   onPageChange: _propTypes.default.func.isRequired,

package/lib/common/components/shared/TagDisplay/index.js

@@ -18,9 +18,10 @@ var _uiTag = require("@instructure/ui-tag");
 var _emotion = require("@instructure/emotion");
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
 var _styles = _interopRequireDefault(require("./styles.js"));
+var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _TagDisplay;
 /** @jsx jsx */
-var TagDisplay = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec(_class = (_TagDisplay = /*#__PURE__*/function (_Component) {
+var TagDisplay = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, null), _dec(_class = (_TagDisplay = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(TagDisplay, _Component);
   var _super = (0, _createSuper2.default)(TagDisplay);
   function TagDisplay() {
@@ -65,7 +66,7 @@ var TagDisplay = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec(_c
   }]);
   TagDisplay.displayName = "TagDisplay";
   return TagDisplay;
-}(_react.Component), _TagDisplay.propTypes = {
+}(_react.Component), _TagDisplay.displayName = 'TagDisplay', _TagDisplay.componentId = "Quizzes".concat(_TagDisplay.displayName), _TagDisplay.propTypes = {
   display: _propTypes.default.number,
   tagAssociations: _reactImmutableProptypes.default.listOf(_reactImmutableProptypes.default.map),
   styles: _propTypes.default.object

package/lib/common/components/shared/drag_and_drop/DragAndDropZone/index.js

@@ -15,9 +15,10 @@ var _emotion = require("@instructure/emotion");
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
 var _styles = _interopRequireDefault(require("./styles.js"));
 var _theme = _interopRequireDefault(require("./theme.js"));
+var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _DragAndDropZone;
 /** @jsx jsx */
-var DragAndDropZone = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_DragAndDropZone = /*#__PURE__*/function (_Component) {
+var DragAndDropZone = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_DragAndDropZone = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(DragAndDropZone, _Component);
   var _super = (0, _createSuper2.default)(DragAndDropZone);
   function DragAndDropZone() {
@@ -89,7 +90,7 @@ var DragAndDropZone = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.de
   }]);
   DragAndDropZone.displayName = "DragAndDropZone";
   return DragAndDropZone;
-}(_react.Component), _DragAndDropZone.propTypes = {
+}(_react.Component), _DragAndDropZone.displayName = 'DragAndDropZone', _DragAndDropZone.componentId = "Quizzes".concat(_DragAndDropZone.displayName), _DragAndDropZone.propTypes = {
   draggingAboveHalf: _propTypes.default.bool.isRequired,
   draggingOver: _propTypes.default.bool.isRequired,
   dropIntoEmptyStimulus: _propTypes.default.bool,

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

@@ -16,9 +16,10 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _emotion = require("@instructure/emotion");
 var _styles = _interopRequireDefault(require("./styles.js"));
 var _theme = _interopRequireDefault(require("./theme.js"));
+var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _Errors;
 /** @jsx jsx */
-var Errors = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_Errors = /*#__PURE__*/function (_Component) {
+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 Errors() {
@@ -53,7 +54,7 @@ var Errors = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _
   }]);
   Errors.displayName = "Errors";
   return Errors;
-}(_react.Component), _Errors.propTypes = {
+}(_react.Component), _Errors.displayName = 'Errors', _Errors.componentId = "Quizzes".concat(_Errors.displayName), _Errors.propTypes = {
   errorList: _reactImmutableProptypes.default.list,
   styles: _propTypes.default.object
 }, _Errors.defaultProps = {

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

@@ -17,9 +17,10 @@ var _reactDropzone = _interopRequireDefault(require("react-dropzone"));
 var _emotion = require("@instructure/emotion");
 var _styles = _interopRequireDefault(require("./styles.js"));
 var _theme = _interopRequireDefault(require("./theme.js"));
+var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _FileSelector;
 /** @jsx jsx */
-var FileSelector = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_FileSelector = /*#__PURE__*/function (_Component) {
+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 FileSelector() {
@@ -53,7 +54,7 @@ var FileSelector = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.defau
   }]);
   FileSelector.displayName = "FileSelector";
   return FileSelector;
-}(_react.Component), _FileSelector.propTypes = {
+}(_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,

package/lib/common/components/shared/overlay/index.js

@@ -24,7 +24,7 @@ var _dec, _class, _Overlay;
  * We might be able to do the mouse over stuff automatically inside of this
  * component but it seems like this is the simplest and best choice for now.
  */
-var Overlay = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_Overlay = /*#__PURE__*/function (_Component) {
+var Overlay = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_Overlay = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(Overlay, _Component);
   var _super = (0, _createSuper2.default)(Overlay);
   function Overlay() {
@@ -70,7 +70,7 @@ var Overlay = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default),
   }]);
   Overlay.displayName = "Overlay";
   return Overlay;
-}(_react.Component), _Overlay.propTypes = {
+}(_react.Component), _Overlay.displayName = 'Overlay', _Overlay.componentId = "Quizzes".concat(_Overlay.displayName), _Overlay.propTypes = {
   children: _propTypes.default.oneOfType([_propTypes.default.element, _propTypes.default.arrayOf(_propTypes.default.element)]).isRequired,
   hideOverlay: _propTypes.default.bool,
   onClick: _propTypes.default.func.isRequired,

package/lib/common/components/shared/spinner/Spinner.js

@@ -17,9 +17,10 @@ var _uiA11yContent = require("@instructure/ui-a11y-content");
 var _emotion = require("@instructure/emotion");
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
 var _styles = _interopRequireDefault(require("./styles.js"));
+var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _QuizzesSpinner;
 /** @jsx jsx */
-var QuizzesSpinner = (_dec = (0, _emotion.withStyle)(_styles.default, null), _dec(_class = (_QuizzesSpinner = /*#__PURE__*/function (_Component) {
+var QuizzesSpinner = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, null), _dec(_class = (_QuizzesSpinner = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(QuizzesSpinner, _Component);
   var _super = (0, _createSuper2.default)(QuizzesSpinner);
   function QuizzesSpinner(props) {
@@ -84,7 +85,7 @@ var QuizzesSpinner = (_dec = (0, _emotion.withStyle)(_styles.default, null), _de
   }]);
   QuizzesSpinner.displayName = "QuizzesSpinner";
   return QuizzesSpinner;
-}(_react.Component), _QuizzesSpinner.propTypes = {
+}(_react.Component), _QuizzesSpinner.displayName = 'QuizzesSpinner', _QuizzesSpinner.componentId = "Quizzes".concat(_QuizzesSpinner.displayName), _QuizzesSpinner.propTypes = {
   mainText: _propTypes.default.string,
   fontSize: _propTypes.default.oneOf(['x-small', 'small', 'medium', 'large', 'x-large', 'xx-large']),
   size: _propTypes.default.oneOf(['x-small', 'small', 'medium', 'large']),

package/lib/index.js

@@ -81,6 +81,7 @@ var _exportNames = {
   HOUR_IN_SECONDS: true,
   TagWrapper: true,
   RetryGradePassbackButton: true,
+  GenericAsyncSearch: true,
   config: true,
   Fetcher: true,
   httpHeaders: true,
@@ -109,6 +110,12 @@ var _exportNames = {
   printWithCss: true,
   ensureImagesLoaded: true,
   ensureRCEContentIsLoaded: true,
+  applyComponentStyleOverride: true,
+  withStyleOverrides: true,
+  getThemeByKey: true,
+  setThemeByKey: true,
+  getActiveTheme: true,
+  setActiveTheme: true,
   createQuizEntryRegrade: true,
   getQuizEntry: true,
   moveQuizEntry: true,
@@ -660,6 +667,12 @@ Object.defineProperty(exports, "RetryGradePassbackButton", {
     return _index57.RetryGradePassbackButton;
   }
 });
+Object.defineProperty(exports, "GenericAsyncSearch", {
+  enumerable: true,
+  get: function get() {
+    return _GenericAsyncSearch.GenericAsyncSearch;
+  }
+});
 Object.defineProperty(exports, "config", {
   enumerable: true,
   get: function get() {
@@ -828,6 +841,42 @@ Object.defineProperty(exports, "ensureRCEContentIsLoaded", {
     return _rceChecker.ensureRCEContentIsLoaded;
   }
 });
+Object.defineProperty(exports, "applyComponentStyleOverride", {
+  enumerable: true,
+  get: function get() {
+    return _quizCommon.applyComponentStyleOverride;
+  }
+});
+Object.defineProperty(exports, "withStyleOverrides", {
+  enumerable: true,
+  get: function get() {
+    return _quizCommon.withStyleOverrides;
+  }
+});
+Object.defineProperty(exports, "getThemeByKey", {
+  enumerable: true,
+  get: function get() {
+    return _quizCommon.getThemeByKey;
+  }
+});
+Object.defineProperty(exports, "setThemeByKey", {
+  enumerable: true,
+  get: function get() {
+    return _quizCommon.setThemeByKey;
+  }
+});
+Object.defineProperty(exports, "getActiveTheme", {
+  enumerable: true,
+  get: function get() {
+    return _quizCommon.getActiveTheme;
+  }
+});
+Object.defineProperty(exports, "setActiveTheme", {
+  enumerable: true,
+  get: function get() {
+    return _quizCommon.setActiveTheme;
+  }
+});
 Object.defineProperty(exports, "createQuizEntryRegrade", {
   enumerable: true,
   get: function get() {
@@ -1483,6 +1532,7 @@ var _reactRedux = require("./common/react-redux.js");
 var _index55 = require("./common/components/shared/FormattedDuration/index.js");
 var _index56 = _interopRequireDefault(require("./common/components/shared/TagWrapper/index.js"));
 var _index57 = require("./moderating/components/resources/RetryGradePassbackButton/index.js");
+var _GenericAsyncSearch = require("./common/components/shared/GenericAsyncSearch/GenericAsyncSearch.js");
 var _config = require("./config.js");
 var _Fetcher = require("./common/util/Fetcher.js");
 var _httpHeaders = require("./common/util/httpHeaders.js");
@@ -1504,6 +1554,7 @@ var _ElementsForSelectors = require("./common/util/ElementsForSelectors.js");
 var _sessionStore = require("./common/util/sessionStore.js");
 var _printUtils = require("./common/util/printUtils.js");
 var _rceChecker = require("./common/util/rceChecker.js");
+var _quizCommon = require("@instructure/quiz-common");
 var _quizEntryRegrades = require("./grading/api/quizEntryRegrades.js");
 var _quizEntries = require("./building/api/quizEntries.js");
 var _items = require("./building/api/items.js");

package/lib/moderating/components/events/Event.js

@@ -1,7 +1,7 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -21,6 +21,7 @@ var _SessionStartEvent = _interopRequireDefault(require("./SessionStartEvent.js"
 var _RCEEvent = _interopRequireDefault(require("./RCEEvent.js"));
 var _PageBlurredEvent = _interopRequireDefault(require("./PageBlurredEvent.js"));
 var _PageFocusedEvent = _interopRequireDefault(require("./PageFocusedEvent.js"));
+var _Event;
 var _ref = /*#__PURE__*/_react.default.createElement(_PageBlurredEvent.default, null);
 var _ref2 = /*#__PURE__*/_react.default.createElement(_PageFocusedEvent.default, null);
 var Event = /*#__PURE__*/function (_Component) {
@@ -84,8 +85,10 @@ var Event = /*#__PURE__*/function (_Component) {
   return Event;
 }(_react.Component);
 exports.Event = Event;
+_Event = Event;
 // This ugly hack is necessary because the InstUI v7 Table.Body only renders components with name 'Row'.
 Event.displayName = 'Row';
+Event.componentId = "Quizzes".concat(_Event.displayName);
 Event.propTypes = {
   event: _reactImmutableProptypes.default.record,
   startTime: _propTypes.default.instanceOf(Date)

package/lib/moderating/components/events/ResponseEvent.js

@@ -21,10 +21,11 @@ var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/f
 var _quizInteractions = require("@instructure/quiz-interactions");
 var _styles = _interopRequireDefault(require("./styles.js"));
 var _theme = _interopRequireDefault(require("./theme.js"));
+var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _ResponseEvent;
 /** @jsx jsx */
 var imgRegex = /<img.*?src=['"](.+)['"]/g;
-var ResponseEvent = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_ResponseEvent = /*#__PURE__*/function (_Component) {
+var ResponseEvent = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_ResponseEvent = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(ResponseEvent, _Component);
   var _super = (0, _createSuper2.default)(ResponseEvent);
   function ResponseEvent() {
@@ -104,7 +105,7 @@ var ResponseEvent = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.defa
   }]);
   ResponseEvent.displayName = "ResponseEvent";
   return ResponseEvent;
-}(_react.Component), _ResponseEvent.propTypes = {
+}(_react.Component), _ResponseEvent.displayName = 'ResponseEvent', _ResponseEvent.componentId = "Quizzes".concat(_ResponseEvent.displayName), _ResponseEvent.propTypes = {
   event: _reactImmutableProptypes.default.record.isRequired,
   item: _reactImmutableProptypes.default.record.isRequired,
   styles: _propTypes.default.object

package/lib/moderating/components/resources/ModerateTable/presenter.js

@@ -39,7 +39,7 @@ var _ref2 = (0, _emotion.jsx)(_uiFlex.Flex.Item, null, (0, _emotion.jsx)(_uiIcon
 var _ref4 = (0, _emotion.jsx)(_uiIcons.IconConfigureLine, null);
 var _ref5 = (0, _emotion.jsx)(_Spinner.default, null);
 var _ref6 = (0, _emotion.jsx)(_index5.default, null);
-var ModerateTable = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec(_class = (_ModerateTable = /*#__PURE__*/function (_Component) {
+var ModerateTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _theme.default), _dec(_class = (_ModerateTable = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(ModerateTable, _Component);
   var _super = (0, _createSuper2.default)(ModerateTable);
   function ModerateTable() {
@@ -338,7 +338,7 @@ var ModerateTable = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.defa
   }]);
   ModerateTable.displayName = "ModerateTable";
   return ModerateTable;
-}(_react.Component), _ModerateTable.propTypes = {
+}(_react.Component), _ModerateTable.displayName = 'ModerateTable', _ModerateTable.componentId = "Quizzes".concat(_ModerateTable.displayName), _ModerateTable.propTypes = {
   anonymousGrading: _propTypes.default.bool,
   children: _propTypes.default.node,
   emptyMessage: _propTypes.default.string,