@instructure/quiz-core 20.36.2 → 20.38.0

package/lib/moderating/components/sidebar/ModerateTray/presenter.js

@@ -13,9 +13,9 @@ var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/creat
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
-var _uiFlex = require("@instructure/ui-flex");
 var _uiView = require("@instructure/ui-view");
 var _uiText = require("@instructure/ui-text");
+var _uiHeading = require("@instructure/ui-heading");
 var _uiTooltip = require("@instructure/ui-tooltip");
 var _uiTray = require("@instructure/ui-tray");
 var _uiButtons = require("@instructure/ui-buttons");
@@ -23,7 +23,6 @@ var _uiTruncateText = require("@instructure/ui-truncate-text");
 var _uiModal = require("@instructure/ui-modal");
 var _quizCommon = require("@instructure/quiz-common");
 var _uiA11yContent = require("@instructure/ui-a11y-content");
-var _featureCheck = require("../../../../common/util/featureCheck.js");
 var ModerateTray = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(ModerateTray, _Component);
   var _super = (0, _createSuper2.default)(ModerateTray);
@@ -75,20 +74,15 @@ var ModerateTray = /*#__PURE__*/function (_Component) {
       _this.props.closeTray();
     };
     _this.renderTitleAndCloseButton = function () {
-      return /*#__PURE__*/_react.default.createElement(_uiFlex.Flex, {
-        justifyItems: "space-between"
-      }, /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, {
-        shouldGrow: true,
-        shouldShrink: true
-      }, (0, _featureCheck.featureOn)('atteq_apply_changes_to_current_quiz_attempts') ? /*#__PURE__*/_react.default.createElement(_uiText.Text, {
-        as: "h2",
-        size: "large",
-        weight: "bold"
-      }, (0, _formatMessage.default)('In Progress Accommodation')) : _this.renderHeading()), /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, null, /*#__PURE__*/_react.default.createElement(_uiButtons.CloseButton, {
+      return /*#__PURE__*/_react.default.createElement(_uiModal.Modal.Header, null, /*#__PURE__*/_react.default.createElement(_uiButtons.CloseButton, {
         onClick: _this.props.closeTray,
         elementRef: _this.setCloseRef,
+        placement: "end",
+        offset: "medium",
         screenReaderLabel: (0, _formatMessage.default)('Close')
-      })));
+      }), _this.props.atteqApplyChangesToCurrentQuizAttemptsEnabled ? /*#__PURE__*/_react.default.createElement(_uiHeading.Heading, {
+        level: "h3"
+      }, /*#__PURE__*/_react.default.createElement(_uiA11yContent.ScreenReaderContent, null, (0, _formatMessage.default)('In Progress Accommodation')), (0, _formatMessage.default)('In Progress Accommodation')) : _this.renderHeading());
     };
     _this.renderChildren = function () {
       return _react.default.Children.map(_this.props.children, function (child) {
@@ -136,12 +130,12 @@ var ModerateTray = /*#__PURE__*/function (_Component) {
         /*#__PURE__*/
         // When using TruncateText inside a Tooltip, a focusable wrapper element is required
         // tabIndex={0} makes the div focusable and allows KO users to access the tooltip
-        _react.default.createElement(_uiView.View, {
+        _react.default.createElement(_uiHeading.Heading, {
           display: "block",
           borderRadius: "small",
           position: "relative",
           withFocusOutline: this.state.titleIsTruncated && focused,
-          as: "h2",
+          level: "h3",
           tabIndex: this.state.isTruncated ? 0 : null
         }, /*#__PURE__*/_react.default.createElement(_uiA11yContent.ScreenReaderContent, null, this.labelText()), /*#__PURE__*/_react.default.createElement(_uiTruncateText.TruncateText, {
           "aria-hidden": "true",
@@ -154,9 +148,6 @@ var ModerateTray = /*#__PURE__*/function (_Component) {
   }, {
     key: "renderName",
     value: function renderName(renderProps) {
-      if (!(0, _featureCheck.featureOn)('atteq_apply_changes_to_current_quiz_attempts')) {
-        return null;
-      }
       var focused = renderProps && renderProps.focused;
       return (
         /*#__PURE__*/
@@ -167,8 +158,7 @@ var ModerateTray = /*#__PURE__*/function (_Component) {
           borderRadius: "small",
           position: "relative",
           withFocusOutline: this.state.participantNameIsTruncated && focused,
-          tabIndex: this.state.participantNameIsTruncated ? 0 : null,
-          margin: "small 0"
+          tabIndex: this.state.participantNameIsTruncated ? 0 : null
         }, /*#__PURE__*/_react.default.createElement(_uiA11yContent.ScreenReaderContent, null, this.props.participantName), /*#__PURE__*/_react.default.createElement(_uiTruncateText.TruncateText, {
           "aria-hidden": "true",
           maxLines: 2,
@@ -183,9 +173,6 @@ var ModerateTray = /*#__PURE__*/function (_Component) {
     key: "renderNameWithTooltip",
     value: function renderNameWithTooltip() {
       var _this3 = this;
-      if (!(0, _featureCheck.featureOn)('atteq_apply_changes_to_current_quiz_attempts')) {
-        return null;
-      }
       return this.state.titleIsTruncated ? /*#__PURE__*/_react.default.createElement(_uiTooltip.Tooltip, {
         placement: "start",
         renderTip: this.props.participantName,
@@ -200,7 +187,7 @@ var ModerateTray = /*#__PURE__*/function (_Component) {
   }, {
     key: "labelText",
     value: function labelText() {
-      if ((0, _featureCheck.featureOn)('atteq_apply_changes_to_current_quiz_attempts')) {
+      if (this.props.atteqApplyChangesToCurrentQuizAttemptsEnabled) {
         return (0, _formatMessage.default)('In Progress Accommodation');
       }
       if (this.props.participantName) {
@@ -219,19 +206,21 @@ var ModerateTray = /*#__PURE__*/function (_Component) {
         onExited: this.handleTrayExited,
         open: this.props.isOpen,
         placement: "end",
-        size: (0, _featureCheck.featureOn)('atteq_apply_changes_to_current_quiz_attempts') ? 'regular' : void 0,
+        size: this.props.atteqApplyChangesToCurrentQuizAttemptsEnabled ? 'regular' : void 0,
         shouldCloseOnDocumentClick: true,
         ref: this.setTrayRef
-      }, /*#__PURE__*/_react.default.createElement(_uiFlex.Flex, {
+      }, /*#__PURE__*/_react.default.createElement(_quizCommon.Flex, {
         as: "div",
         direction: "column",
         height: "100vh"
-      }, /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, {
-        padding: "small medium"
-      }, this.renderTitleAndCloseButton()), /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, {
+      }, this.renderTitleAndCloseButton(), this.props.atteqApplyChangesToCurrentQuizAttemptsEnabled && /*#__PURE__*/_react.default.createElement(_quizCommon.Flex.Item, {
+        padding: "medium medium 0 medium"
+      }, this.renderNameWithTooltip()), /*#__PURE__*/_react.default.createElement(_quizCommon.Flex.Item, {
+        padding: "medium"
+      }, (0, _formatMessage.default)('These settings apply to current and all future attempts.')), /*#__PURE__*/_react.default.createElement(_quizCommon.Flex.Item, {
         shouldGrow: true,
         padding: "0 medium"
-      }, this.renderNameWithTooltip(), this.renderChildren()), (0, _featureCheck.featureOn)('add_time_to_existing_quiz_sessions') && /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, null, this.renderFooter())));
+      }, this.renderChildren()), this.props.atteqApplyChangesToCurrentQuizAttemptsEnabled && /*#__PURE__*/_react.default.createElement(_quizCommon.Flex.Item, null, this.renderFooter())));
     }
   }]);
   ModerateTray.displayName = "ModerateTray";
@@ -244,7 +233,8 @@ ModerateTray.propTypes = {
   isOpen: _propTypes.default.bool.isRequired,
   onClose: _propTypes.default.func,
   onSave: _propTypes.default.func.isRequired,
-  participantName: _propTypes.default.string
+  participantName: _propTypes.default.string,
+  atteqApplyChangesToCurrentQuizAttemptsEnabled: _propTypes.default.bool.isRequired
 };
 ModerateTray.defaultProps = {
   onClose: void 0,

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/MatchingType/MatchingTypeTable/presenter.js

@@ -10,7 +10,6 @@ var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/creat
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
 var _react = require("react");
-var _uiFlex = require("@instructure/ui-flex");
 var _styles = _interopRequireDefault(require("./styles.js"));
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
 var _uiTable = require("@instructure/ui-table");
@@ -26,7 +25,7 @@ var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _MatchingTypeTable;
 /** @jsx jsx */
 var _ref = (0, _emotion.jsx)(_uiIcons.IconCheckSolid, null);
-var _ref2 = (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+var _ref2 = (0, _emotion.jsx)(_quizCommon.Flex.Item, {
   width: "46px",
   textAlign: "center"
 });
@@ -61,9 +60,9 @@ var MatchingTypeTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defa
           padding: '0 0 15px 0'
         },
         textAlign: "center"
-      }, (0, _emotion.jsx)(_uiFlex.Flex, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex, {
         direction: "row"
-      }, _ref2, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, _ref2, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         shouldShrink: true,
         shouldGrow: true,
         textAlign: "center"
@@ -92,14 +91,14 @@ var MatchingTypeTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defa
       }, (0, _emotion.jsx)(_uiA11yContent.ScreenReaderContent, null, correct ? "".concat((0, _formatMessage.default)('Correct answer'), ": ").concat(count) : count), (0, _emotion.jsx)("div", {
         "aria-hidden": "true",
         css: answerRowStyles
-      }, (0, _emotion.jsx)(_uiFlex.Flex, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex, {
         direction: "row",
         alignItems: "center"
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         width: "46px",
         textAlign: "center",
         align: "stretch"
-      }, correct && _this.renderIcon()), (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, correct && _this.renderIcon()), (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         shouldShrink: true,
         shouldGrow: true,
         textAlign: "center"

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/NumericType/ChoiceTypeWithInfo/presenter.js

@@ -12,7 +12,7 @@ var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/creat
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _propTypes2 = require("../../../../common/propTypes.js");
-var _uiFlex = require("@instructure/ui-flex");
+var _quizCommon = require("@instructure/quiz-common");
 var _index = _interopRequireDefault(require("../../shared/ChoiceTypeTable/index.js"));
 var _uiText = require("@instructure/ui-text");
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
@@ -40,7 +40,7 @@ var ChoiceTypeWithInfo = /*#__PURE__*/function (_Component) {
       });
     };
     _this.renderEmptyRequirement = function () {
-      return /*#__PURE__*/_react.default.createElement(_uiFlex.Flex, null, /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, {
+      return /*#__PURE__*/_react.default.createElement(_quizCommon.Flex, null, /*#__PURE__*/_react.default.createElement(_quizCommon.Flex.Item, {
         padding: "medium none none none"
       }, /*#__PURE__*/_react.default.createElement(_uiText.Text, null, (0, _formatMessage.default)('There are no entries for this requirement.'))));
     };
@@ -49,28 +49,28 @@ var ChoiceTypeWithInfo = /*#__PURE__*/function (_Component) {
         headLine = _this$props2.headLine,
         choices = _this$props2.choices;
       var areThereChoices = Array.isArray(choices) && choices.length > 0;
-      return /*#__PURE__*/_react.default.createElement(_uiFlex.Flex, {
+      return /*#__PURE__*/_react.default.createElement(_quizCommon.Flex, {
         direction: "column",
         justifyItems: "start"
-      }, /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, {
+      }, /*#__PURE__*/_react.default.createElement(_quizCommon.Flex.Item, {
         overflowY: "visible",
         shouldGrow: true,
         shouldShrink: true
-      }, /*#__PURE__*/_react.default.createElement(_uiFlex.Flex, {
+      }, /*#__PURE__*/_react.default.createElement(_quizCommon.Flex, {
         direction: "column",
         justifyItems: "start"
-      }, /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, {
+      }, /*#__PURE__*/_react.default.createElement(_quizCommon.Flex.Item, {
         shouldShrink: true,
         padding: "none none none none",
         overflowY: "hidden"
-      }, /*#__PURE__*/_react.default.createElement(_uiFlex.Flex, {
+      }, /*#__PURE__*/_react.default.createElement(_quizCommon.Flex, {
         direction: "row",
         alignItems: "start"
-      }, /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, {
+      }, /*#__PURE__*/_react.default.createElement(_quizCommon.Flex.Item, {
         shouldShrink: true,
         shouldGrow: true,
         margin: "none none none none"
-      }, headLine))), /*#__PURE__*/_react.default.createElement(_uiFlex.Flex.Item, {
+      }, headLine))), /*#__PURE__*/_react.default.createElement(_quizCommon.Flex.Item, {
         shouldShrink: true,
         padding: "none none medium none"
       }, areThereChoices ? _this.renderTable() : _this.renderEmptyRequirement()))));

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/NumericType/presenter.js

@@ -21,7 +21,6 @@ var _emotion = require("@instructure/emotion");
 var _index5 = _interopRequireDefault(require("./ChoiceTypeWithInfo/index.js"));
 var _styles = _interopRequireDefault(require("./styles.js"));
 var _theme = _interopRequireDefault(require("./theme.js"));
-var _uiFlex = require("@instructure/ui-flex");
 var _propTypes2 = require("../../../common/propTypes.js");
 var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _NumericType;
@@ -177,12 +176,12 @@ var NumericType = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default, _
       });
     };
     _this.renderEmptyIncorrect = function () {
-      return (0, _emotion.jsx)(_uiFlex.Flex, null, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      return (0, _emotion.jsx)(_quizCommon.Flex, null, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         padding: "small none small none"
       }, (0, _emotion.jsx)(_uiText.Text, null, (0, _formatMessage.default)('There are no incorrect answers.'))));
     };
     _this.renderEmptyCorrect = function () {
-      return (0, _emotion.jsx)(_uiFlex.Flex, null, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      return (0, _emotion.jsx)(_quizCommon.Flex, null, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         padding: "small none small none"
       }, (0, _emotion.jsx)(_uiText.Text, null, (0, _formatMessage.default)('There are no correct answers.'))));
     };

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/RichFillBlankType/ChoiceGroupTypeTable/presenter.js

@@ -11,7 +11,6 @@ var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/creat
 var _react = require("react");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _propTypes2 = require("../../../../common/propTypes.js");
-var _uiFlex = require("@instructure/ui-flex");
 var _uiText = require("@instructure/ui-text");
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
 var _index = _interopRequireDefault(require("../../shared/ChoiceTypeTable/index.js"));
@@ -92,25 +91,25 @@ var ChoiceGroupTypeTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.d
       var blank_text = blank.blank_text,
         blank_type = blank.blank_type;
       var blankTextAndType = "".concat(blank_text, " (").concat(_this.getTranslatedBlankType(blank_type), ")");
-      return (0, _emotion.jsx)(_uiFlex.Flex, {
+      return (0, _emotion.jsx)(_quizCommon.Flex, {
         overflowY: "visible",
         direction: "row",
         alignItems: "start",
         wrap: "wrap"
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, null, _this.renderBlankIcon()), (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, null, _this.renderBlankIcon()), (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         margin: "xxx-small medium small x-small"
       }, (0, _emotion.jsx)(_uiText.Text, {
         weight: "bold"
-      }, blankTextAndType)), (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, blankTextAndType)), (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         shouldShrink: true,
         margin: "xxx-small none small none"
       }, _this.renderBlankInfo()));
     };
     _this.renderEmptyInfo = function () {
-      return (0, _emotion.jsx)(_uiFlex.Flex, {
+      return (0, _emotion.jsx)(_quizCommon.Flex, {
         direction: "column",
         justifyItems: "start"
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         shouldShrink: true,
         shouldGrow: true,
         padding: "none none x-small none"

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/shared/AfsTableWrapper/presenter.js

@@ -10,7 +10,6 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
 var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
 var _react = require("react");
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
-var _uiFlex = require("@instructure/ui-flex");
 var _uiHeading = require("@instructure/ui-heading");
 var _emotion = require("@instructure/emotion");
 var _styles = _interopRequireDefault(require("./styles.js"));
@@ -36,10 +35,10 @@ var AfsTableWrapper = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defaul
     };
     _this.render = function () {
       var noAnswerMissingPopover = _this.props.noAnswerMissingPopover;
-      return (0, _emotion.jsx)(_uiFlex.Flex, {
+      return (0, _emotion.jsx)(_quizCommon.Flex, {
         direction: "row",
         "data-testid": "AfsTableWrapper"
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         shouldGrow: true
       }, (0, _emotion.jsx)("div", {
         css: _this.props.styles.tableWrapper
@@ -48,9 +47,9 @@ var AfsTableWrapper = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defaul
         level: "h3",
         weight: "bold",
         color: "primary"
-      }, (0, _emotion.jsx)(_uiFlex.Flex, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex, {
         gap: "x-small"
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, null, _this.getHeader()), (0, _emotion.jsx)(_uiFlex.Flex.Item, null, noAnswerMissingPopover && (0, _emotion.jsx)(_index.default, _popoverContent.noAnswerMissing)))), _this.props.children)));
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, null, _this.getHeader()), (0, _emotion.jsx)(_quizCommon.Flex.Item, null, noAnswerMissingPopover && (0, _emotion.jsx)(_index.default, _popoverContent.noAnswerMissing)))), _this.props.children)));
     };
     return _this;
   }

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/shared/AggregationTable/presenter.js

@@ -17,7 +17,6 @@ var _uiIcons = require("@instructure/ui-icons");
 var _emotion = require("@instructure/emotion");
 var _theme = _interopRequireDefault(require("./theme.js"));
 var _styles = _interopRequireDefault(require("./styles.js"));
-var _uiFlex = require("@instructure/ui-flex");
 var _uiText = require("@instructure/ui-text");
 var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _AggregationTable;
@@ -67,16 +66,16 @@ var AggregationTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defau
         themeOverride: {
           padding: '0px'
         }
-      }, (0, _emotion.jsx)(_uiFlex.Flex, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex, {
         direction: "row",
         alignItems: "center"
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         width: "46px",
         textAlign: "center",
         align: "stretch"
       }, (0, _emotion.jsx)("div", {
         css: [_this.props.styles.iconWrapper, backgroundColor]
-      }, icon)), (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, icon)), (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         shouldShrink: true
       }, (0, _emotion.jsx)("div", {
         "data-testid": "label-wrapper",

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/shared/ChoiceTypeTable/presenter.js

@@ -21,7 +21,6 @@ var _styles = _interopRequireDefault(require("./styles.js"));
 var _theme = _interopRequireDefault(require("./theme.js"));
 var _uiIcons = require("@instructure/ui-icons");
 var _quizInteractions = require("@instructure/quiz-interactions");
-var _uiFlex = require("@instructure/ui-flex");
 var _uiText = require("@instructure/ui-text");
 var _quizCommon = require("@instructure/quiz-common");
 var _dec, _class, _ChoiceTypeTable;
@@ -88,17 +87,17 @@ var ChoiceTypeTable = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defaul
         themeOverride: {
           padding: '0'
         }
-      }, (0, _emotion.jsx)(_uiA11yContent.ScreenReaderContent, null, screenReaderContent), (0, _emotion.jsx)(_uiFlex.Flex, {
+      }, (0, _emotion.jsx)(_uiA11yContent.ScreenReaderContent, null, screenReaderContent), (0, _emotion.jsx)(_quizCommon.Flex, {
         direction: "row",
         alignItems: "center"
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         width: "46px",
         textAlign: "center",
         align: "stretch"
       }, (0, _emotion.jsx)("div", {
         "data-icon": _this.getDataIconAttribute(correct, choiceIndex),
         css: _this.props.styles.iconWrapper
-      }, _this.renderIcon(correct))), (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, _this.renderIcon(correct))), (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         shouldShrink: true,
         shouldGrow: true
       }, (0, _emotion.jsx)(_uiText.Text, null, _this.renderFirstCell(extractedBody))))), (0, _emotion.jsx)(_uiTable.Table.Cell, {

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/shared/ExpandableCard/presenter.js

@@ -10,7 +10,6 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
 var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
 var _react = require("react");
 var _index = _interopRequireDefault(require("../../../../../../../common/components/shared/Card/index.js"));
-var _uiFlex = require("@instructure/ui-flex");
 var _emotion = require("@instructure/emotion");
 var _index2 = _interopRequireDefault(require("../../../../../../../common/components/shared/ExpandButton/index.js"));
 var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
@@ -40,14 +39,14 @@ var ExpandableCard = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default
     };
     _this.renderGroup = function () {
       var headLine = _this.props.headLine;
-      return (0, _emotion.jsx)(_uiFlex.Flex, {
+      return (0, _emotion.jsx)(_quizCommon.Flex, {
         direction: "row",
         alignItems: "start"
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         shouldShrink: true,
         shouldGrow: true,
         margin: "xx-small none none none"
-      }, headLine), (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, headLine), (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         margin: "none none none x-small"
       }, (0, _emotion.jsx)(_index2.default, {
         onClick: _this.handleBodyToggle,
@@ -60,7 +59,7 @@ var ExpandableCard = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default
         content = _this$props.content,
         styles = _this$props.styles;
       var bodyContainer = styles.bodyContainer;
-      return (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      return (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         shouldShrink: true,
         padding: "x-small small x-small small"
       }, (0, _emotion.jsx)("div", {
@@ -73,17 +72,17 @@ var ExpandableCard = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.default
       var bodyExpanded = _this.state.bodyExpanded;
       return (0, _emotion.jsx)("div", {
         css: groupWrapper
-      }, (0, _emotion.jsx)(_index.default, null, (0, _emotion.jsx)(_uiFlex.Flex, {
+      }, (0, _emotion.jsx)(_index.default, null, (0, _emotion.jsx)(_quizCommon.Flex, {
         direction: "column",
         justifyItems: "start"
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         shouldGrow: true,
         shouldShrink: true,
         overflowY: "visible"
-      }, (0, _emotion.jsx)(_uiFlex.Flex, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex, {
         direction: "column",
         justifyItems: "start"
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         shouldShrink: true,
         padding: "x-small small x-small small",
         overflowY: "hidden"

package/lib/reporting/components/resources/NewQuizAndItemAnalysis/NewItemAnalysis/presenter.js

@@ -26,7 +26,6 @@ var _index4 = _interopRequireDefault(require("../AnalysisPopoverMetric/index.js"
 var _interactionTypeMetadata = require("../../../../../common/util/interactionTypeMetadata.js");
 var _index5 = _interopRequireDefault(require("../AnswerFrequencySummary/index.js"));
 var _propTypes2 = require("../../common/propTypes.js");
-var _uiFlex = require("@instructure/ui-flex");
 var _quizRce = require("@instructure/quiz-rce");
 var _rceChecker = require("../../../../../common/util/rceChecker.js");
 var _quizCommon = require("@instructure/quiz-common");
@@ -118,10 +117,10 @@ var NewItemAnalysis = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defaul
       return tempDoc.querySelector('body').innerHTML;
     };
     _this.renderRichContent = function (itemBody, itemId) {
-      return (0, _emotion.jsx)(_uiFlex.Flex, {
+      return (0, _emotion.jsx)(_quizCommon.Flex, {
         direction: "row",
         alignItems: "start"
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         shouldShrink: true,
         shouldGrow: true
       }, (0, _emotion.jsx)("div", {
@@ -129,7 +128,7 @@ var NewItemAnalysis = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defaul
         css: _this.props.styles.itemBody
       }, (0, _emotion.jsx)(_quizRce.RichContentRenderer, {
         content: itemBody
-      }))), (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }))), (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         margin: "none none none x-small"
       }, (0, _emotion.jsx)("div", {
         css: _this.props.styles.itemBodyToggleButtonWrapper
@@ -140,55 +139,55 @@ var NewItemAnalysis = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defaul
       })))));
     };
     _this.renderMetrics = function (scores) {
-      return (0, _emotion.jsx)(_uiFlex.Flex, {
+      return (0, _emotion.jsx)(_quizCommon.Flex, {
         direction: "column"
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         overflowY: "visible"
-      }, (0, _emotion.jsx)(_uiFlex.Flex, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex, {
         wrap: "wrap",
         direction: "row",
         alignItems: "start",
         gap: "medium"
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         margin: "none medium none none"
       }, (0, _emotion.jsx)(_index4.default, {
         metricKey: "difficulty_index",
         label: (0, _formatMessage.default)('Item Difficulty'),
         value: scores.difficulty_index,
         popoverDescription: _popoverContent.difficultyIndex
-      })), (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      })), (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         margin: "none medium none none"
       }, (0, _emotion.jsx)(_index3.default, {
         metricKey: "mean",
         label: (0, _formatMessage.default)('Mean Earned Points'),
         value: _this.calculateValueWithPointsPossible('mean', scores.mean)
-      })), (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      })), (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         margin: "none medium none none"
       }, (0, _emotion.jsx)(_index3.default, {
         metricKey: "median",
         label: (0, _formatMessage.default)('Median Earned Points'),
         value: _this.calculateValueWithPointsPossible('median', scores.median)
-      })), (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      })), (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         margin: "none large none none"
       }, (0, _emotion.jsx)(_index4.default, {
         metricKey: "discrimination_index",
         label: (0, _formatMessage.default)('Discrimination Index'),
         value: scores.discrimination_index,
         popoverDescription: _popoverContent.discriminationIndex
-      })))), (0, _emotion.jsx)(_uiFlex.Flex.Item, null, (0, _emotion.jsx)("div", {
+      })))), (0, _emotion.jsx)(_quizCommon.Flex.Item, null, (0, _emotion.jsx)("div", {
         css: _this.props.styles.itemCardToggleButtonWrapper
       }, (0, _emotion.jsx)(_index.default, {
         onClick: _this.handleMetricToggle,
         title: _this.state.metricsExpanded ? (0, _formatMessage.default)('collapse item card') : (0, _formatMessage.default)('expand item card'),
         isExpanded: _this.state.metricsExpanded
-      }))), (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }))), (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         overflowY: "visible",
         margin: "medium none none none"
       }, (0, _emotion.jsx)("div", {
         css: _this.props.styles.hiddenWhenNotExpanded
       }, (0, _emotion.jsx)("div", {
         css: _this.props.styles.metricsContainer
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         margin: "none medium none none"
       }, (0, _emotion.jsx)(_index4.default, {
         metricKey: "pearson_correlation",
@@ -198,7 +197,7 @@ var NewItemAnalysis = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defaul
       }))))));
     };
     _this.renderAnswerSummaryTable = function (itemId, answer_summary, interactionType, afsFlags) {
-      return (0, _emotion.jsx)(_uiFlex.Flex.Item, null, (0, _emotion.jsx)("div", {
+      return (0, _emotion.jsx)(_quizCommon.Flex.Item, null, (0, _emotion.jsx)("div", {
         css: _this.props.styles.hiddenWhenNotExpanded
       }, (0, _emotion.jsx)(_index5.default, {
         itemId: itemId,
@@ -276,25 +275,25 @@ var NewItemAnalysis = (_dec = (0, _quizCommon.withStyleOverrides)(_styles.defaul
       var itemBodyEnhanced = this.shouldEnhanceItemBody() ? this.enhanceItemBody(metadata.item_body) : metadata.item_body;
       return (0, _emotion.jsx)(_index2.default, {
         css: this.props.styles.cardWrapper
-      }, (0, _emotion.jsx)(_uiFlex.Flex, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex, {
         direction: "column"
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         overflowY: "visible"
       }, (0, _emotion.jsx)("div", {
         css: this.props.styles.itemCardInnerContainer
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         shouldGrow: true,
         shouldShrink: true,
         size: "45%"
-      }, (0, _emotion.jsx)(_uiFlex.Flex, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex, {
         direction: "column",
         justifyItems: "start"
-      }, (0, _emotion.jsx)(_uiFlex.Flex.Item, null, this.renderTitle(title)), (0, _emotion.jsx)(_uiFlex.Flex.Item, null, this.renderInteractionType(metadata.interaction_type)), (0, _emotion.jsx)(_uiFlex.Flex.Item, {
+      }, (0, _emotion.jsx)(_quizCommon.Flex.Item, null, this.renderTitle(title)), (0, _emotion.jsx)(_quizCommon.Flex.Item, null, this.renderInteractionType(metadata.interaction_type)), (0, _emotion.jsx)(_quizCommon.Flex.Item, {
         shouldShrink: true,
         padding: "small xx-small none none",
         overflowY: "hidden",
         size: !this.state.bodyExpanded ? '60px' : void 0
-      }, this.renderRichContent(itemBodyEnhanced, itemId)))), (0, _emotion.jsx)(_uiFlex.Flex.Item, null, this.renderMetrics(scores)))), this.renderAnswerSummaryTable(itemId, answer_summary, interactionType, afsFlags)));
+      }, this.renderRichContent(itemBodyEnhanced, itemId)))), (0, _emotion.jsx)(_quizCommon.Flex.Item, null, this.renderMetrics(scores)))), this.renderAnswerSummaryTable(itemId, answer_summary, interactionType, afsFlags)));
     }
   }]);
   NewItemAnalysis.displayName = "NewItemAnalysis";