@instructure/quiz-core 20.7.1-rc.7 → 20.8.0

package/es/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/ScoreDistributionType/Table/index.js

@@ -0,0 +1,120 @@
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
+
+var _dec, _class, _class2, _temp;
+
+/** @jsx jsx */
+import { scoreDistributionType } from "../../../propTypes.js";
+import { Component } from 'react';
+import t from '@instructure/quiz-i18n/es/format-message';
+import { Table } from '@instructure/ui-table';
+import PropTypes from 'prop-types';
+import { withStyle, jsx } from '@instructure/emotion';
+import generateStyle from "./styles.js";
+import generateComponentTheme from "./theme.js";
+export var ScoreDistributionTypeTable = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_Component) {
+  _inherits(ScoreDistributionTypeTable, _Component);
+
+  var _super = _createSuper(ScoreDistributionTypeTable);
+
+  function ScoreDistributionTypeTable() {
+    var _this;
+
+    _classCallCheck(this, ScoreDistributionTypeTable);
+
+    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.renderFirstCell = function (content) {
+      return jsx("div", {
+        css: _this.props.styles.firstTextContainer
+      }, content);
+    };
+
+    _this.renderCell = function (content) {
+      return jsx("div", {
+        css: _this.props.styles.textContainer
+      }, content);
+    };
+
+    _this.renderRow = function (choice, choiceIndex) {
+      var count = choice.count,
+          score = choice.score,
+          percentage = choice.percentage;
+      return jsx(Table.Row, {
+        key: choiceIndex
+      }, jsx(Table.Cell, {
+        themeOverride: {
+          padding: '0'
+        }
+      }, _this.renderFirstCell(score)), jsx(Table.Cell, {
+        themeOverride: {
+          padding: '0'
+        }
+      }, _this.renderCell(count)), jsx(Table.Cell, {
+        themeOverride: {
+          padding: '0'
+        },
+        textAlign: "center"
+      }, _this.renderCell("".concat(percentage, "%"))));
+    };
+
+    return _this;
+  }
+
+  _createClass(ScoreDistributionTypeTable, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      this.props.makeStyles();
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate() {
+      this.props.makeStyles();
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+          scores = _this$props.scores,
+          itemId = _this$props.itemId,
+          styles = _this$props.styles;
+      var pointsHeaderId = "answer-frequency-summary-points-".concat(itemId);
+      var respondentsHeaderId = "answer-frequency-summary-respondents-".concat(itemId);
+      var percentageHeaderId = "answer-frequency-summary-percentage-".concat(itemId);
+      return jsx("div", {
+        css: styles.tableContainer
+      }, jsx(Table, {
+        caption: t('Score Frequency Summary'),
+        elementRef: this.setTableRef
+      }, jsx(Table.Head, null, jsx(Table.Row, null, jsx(Table.ColHeader, {
+        id: pointsHeaderId,
+        height: "47px"
+      }, t('Points')), jsx(Table.ColHeader, {
+        id: respondentsHeaderId,
+        height: "47px",
+        textAlign: "center"
+      }, t('Respondents')), jsx(Table.ColHeader, {
+        id: percentageHeaderId,
+        height: "47px",
+        textAlign: "center"
+      }, t('%')))), jsx(Table.Body, null, scores.map(this.renderRow))));
+    }
+  }]);
+
+  ScoreDistributionTypeTable.displayName = "ScoreDistributionTypeTable";
+  return ScoreDistributionTypeTable;
+}(Component), _class2.propTypes = {
+  itemId: PropTypes.number.isRequired,
+  scores: PropTypes.arrayOf(scoreDistributionType).isRequired,
+  // eslint-disable-next-line react/require-default-props
+  makeStyles: PropTypes.func,
+  // eslint-disable-next-line react/require-default-props,react/forbid-prop-types
+  styles: PropTypes.object
+}, _temp)) || _class);
+export default ScoreDistributionTypeTable;

package/es/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/ScoreDistributionType/Table/styles.js

@@ -0,0 +1,38 @@
+var generateStyle = function generateStyle(componentTheme) {
+  var borderBottom = "solid 0.0625rem ".concat(componentTheme.colorGray);
+  return {
+    tableContainer: {
+      width: 'calc(25% + 350px)',
+      maxWidth: '100%',
+      '& table': {
+        borderCollapse: 'separate',
+        borderSpacing: '0 1px',
+        '& thead tr': {
+          '& th, & td': {
+            borderBottom: borderBottom
+          }
+        },
+        '& tbody tr': {
+          '& th, & td': {
+            width: '33.33%',
+            borderBottom: borderBottom
+          },
+          '& th': {
+            fontWeight: 400
+          }
+        }
+      }
+    },
+    textContainer: {
+      height: 'calc(100% - 4px)',
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'center'
+    },
+    firstTextContainer: {
+      padding: componentTheme.cellPadding
+    }
+  };
+};
+
+export default generateStyle;

package/es/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/ScoreDistributionType/Table/theme.js

@@ -0,0 +1,11 @@
+var generateComponentTheme = function generateComponentTheme(_ref) {
+  var spacing = _ref.spacing,
+      colors = _ref.colors;
+  return {
+    tableBottomPadding: spacing === null || spacing === void 0 ? void 0 : spacing.medium,
+    colorGray: colors === null || colors === void 0 ? void 0 : colors.tiara,
+    cellPadding: "".concat(spacing === null || spacing === void 0 ? void 0 : spacing.small, " ").concat(spacing === null || spacing === void 0 ? void 0 : spacing.small)
+  };
+};
+
+export default generateComponentTheme;

package/es/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/ScoreDistributionType/index.js

@@ -0,0 +1,55 @@
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import ScoreDistributionTypeTable from "./Table/index.js";
+import { scoreDistributionTypeAnswerSummaryPropType } from "../../propTypes.js";
+import AggregationTable from "../shared/AggregationTable/index.js";
+import { AfsPartsContainer } from "../shared/AfsPartsContainer/presenter.js";
+import AfsTableWrapper from "../shared/AfsTableWrapper/index.js";
+import t from '@instructure/quiz-i18n/es/format-message';
+export var ScoreDistributionType = /*#__PURE__*/function (_Component) {
+  _inherits(ScoreDistributionType, _Component);
+
+  var _super = _createSuper(ScoreDistributionType);
+
+  function ScoreDistributionType() {
+    var _this;
+
+    _classCallCheck(this, ScoreDistributionType);
+
+    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.render = function () {
+      var _this$props = _this.props,
+          answerSummary = _this$props.answerSummary,
+          itemId = _this$props.itemId;
+      return /*#__PURE__*/React.createElement(AfsTableWrapper, {
+        tableHeader: t('Score Frequency Summary')
+      }, /*#__PURE__*/React.createElement(AfsPartsContainer, {
+        afsTable: /*#__PURE__*/React.createElement(ScoreDistributionTypeTable, {
+          itemId: itemId,
+          scores: answerSummary.score_distribution
+        }),
+        aggregationTable: /*#__PURE__*/React.createElement(AggregationTable, {
+          itemId: itemId,
+          answerSummary: answerSummary
+        })
+      }));
+    };
+
+    return _this;
+  }
+
+  return ScoreDistributionType;
+}(Component);
+ScoreDistributionType.propTypes = {
+  itemId: PropTypes.number,
+  answerSummary: scoreDistributionTypeAnswerSummaryPropType
+}.isRequired;
+export default ScoreDistributionType;

package/es/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/presenter.js

@@ -7,7 +7,9 @@ import LegacyChoiceType from "./LegacyChoiceType/index.js";
 import ChoiceType from "./ChoiceType/index.js";
 import RichFillBlankType from "./RichFillBlankType/index.js";
 import AggregationType from "./AggregationType/index.js";
+import NumericType from "./NumericType/index.js";
 import { MatchingType, OrderingType, CategorizationType } from "./MatchingType/index.js";
+import { ScoreDistributionType } from "./ScoreDistributionType/index.js";
 import { afsFlags, answerSummaryPropType } from "../propTypes.js";
 export var AnswerFrequencySummary = /*#__PURE__*/function (_Component) {
   _inherits(AnswerFrequencySummary, _Component);
@@ -62,6 +64,18 @@ export var AnswerFrequencySummary = /*#__PURE__*/function (_Component) {
       if (afsFlags.fillInTheBlankEnabled) {
         _this.afsTableComponentMap.set('rich-fill-blank', RichFillBlankType);
       }
+
+      if (afsFlags.numericEnabled) {
+        _this.afsTableComponentMap.set('numeric', NumericType);
+      }
+
+      if (afsFlags.essayEnabled) {
+        _this.afsTableComponentMap.set('essay', ScoreDistributionType);
+      }
+
+      if (afsFlags.fileUploadEnabled) {
+        _this.afsTableComponentMap.set('file-upload', ScoreDistributionType);
+      }
     };
 
     _this.render = function () {

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

@@ -28,6 +28,11 @@ export var AfsTableWrapper = (_dec = withStyle(generateStyle, null), _dec(_class
 
     _this = _super.call.apply(_super, [this].concat(args));
 
+    _this.getHeader = function () {
+      var tableHeader = _this.props.tableHeader;
+      return tableHeader || t('Answer Frequency Summary');
+    };
+
     _this.render = function () {
       return jsx(Flex, {
         direction: "row",
@@ -41,7 +46,7 @@ export var AfsTableWrapper = (_dec = withStyle(generateStyle, null), _dec(_class
         level: "h3",
         weight: "bold",
         color: "primary"
-      }, t('Answer Frequency Summary')), _this.props.children)));
+      }, _this.getHeader()), _this.props.children)));
     };
 
     return _this;
@@ -50,5 +55,6 @@ export var AfsTableWrapper = (_dec = withStyle(generateStyle, null), _dec(_class
   return AfsTableWrapper;
 }(Component), _class2.propTypes = {
   children: PropTypes.node.isRequired,
-  styles: PropTypes.object
+  styles: PropTypes.object,
+  tableHeader: PropTypes.string
 }, _temp)) || _class);

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

@@ -9,28 +9,28 @@ import t from '@instructure/quiz-i18n/es/format-message';
 import { Table } from '@instructure/ui-table';
 import { onlyAggregatePropType } from "../../../propTypes.js";
 import PropTypes from 'prop-types';
-import { IconCheckSolid, IconXSolid, IconNoSolid, IconOvalHalfSolid } from '@instructure/ui-icons';
+import { IconCheckSolid, IconXSolid, IconNoSolid, IconGradebookSolid } from '@instructure/ui-icons';
 import { themeable } from '@instructure/ui-themeable';
 import theme from "./theme.js";
 var styles = {
-  componentId: 'fSsSV',
+  componentId: 'fMmrG',
   template: function template(theme) {
-    return "\n\n.fSsSV_cvRx{align-items:center;display:flex;height:100%;justify-content:center;min-height:47px;width:46px}\n\n.fSsSV_fPIL{min-width:500px}\n\n.fSsSV_fPIL table{border-collapse:separate;border-spacing:0 12px}\n\n.fSsSV_fPIL thead th{border-color:".concat(theme.colorHeaderBottomBorder || 'inherit', ";border-style:solid;border-width:0 0 1px 0}\n\n.fSsSV_fPIL table tbody tr td{border-style:solid;border-width:2px 0 2px 0;width:33.33%}\n\n.fSsSV_fPIL table tbody tr th:first-child{border-radius:4px 0 0 4px;border-style:solid;border-width:2px 0 2px 2px;font-weight:400}\n\n.fSsSV_fPIL table tbody tr td:last-child{border-radius:0 4px 4px 0;border-style:solid;border-width:2px 2px 2px 0}\n\n.fSsSV_dzqP table tbody tr:first-child td,.fSsSV_dzqP table tbody tr:first-child th{border-color:").concat(theme.colorGrey || 'inherit', "}\n\n.fSsSV_fZpZ table tbody tr:first-child td,.fSsSV_fZpZ table tbody tr:first-child th{border-color:").concat(theme.colorGreen || 'inherit', "}\n\n.fSsSV_fZpZ table tbody tr:nth-child(2) td,.fSsSV_fZpZ table tbody tr:nth-child(2) th{border-color:").concat(theme.colorRed || 'inherit', "}\n\n.fSsSV_dgTJ table tbody tr:first-child td,.fSsSV_dgTJ table tbody tr:first-child th{border-color:").concat(theme.colorGreen || 'inherit', "}\n\n.fSsSV_dgTJ table tbody tr:nth-child(2) td,.fSsSV_dgTJ table tbody tr:nth-child(2) th{border-color:").concat(theme.colorRed || 'inherit', "}\n\n.fSsSV_dgTJ table tbody tr:nth-child(3) td,.fSsSV_dgTJ table tbody tr:nth-child(3) th{border-color:").concat(theme.colorGrey || 'inherit', "}\n\n.fSsSV_bUPM table tbody tr:first-child td,.fSsSV_bUPM table tbody tr:first-child th{border-color:").concat(theme.colorGreen || 'inherit', "}\n\n.fSsSV_bUPM table tbody tr:nth-child(2) td,.fSsSV_bUPM table tbody tr:nth-child(2) th{border-color:").concat(theme.colorBlue || 'inherit', "}\n\n.fSsSV_bUPM table tbody tr:nth-child(3) td,.fSsSV_bUPM table tbody tr:nth-child(3) th{border-color:").concat(theme.colorRed || 'inherit', "}\n\n.fSsSV_bUPM table tbody tr:nth-child(4) td,.fSsSV_bUPM table tbody tr:nth-child(4) th{border-color:").concat(theme.colorGrey || 'inherit', "}\n\n.fSsSV_bvau{background-color:").concat(theme.colorGreen || 'inherit', "}\n\n.fSsSV_cxOH{background-color:").concat(theme.colorRed || 'inherit', "}\n\n.fSsSV_eRkO{background-color:").concat(theme.colorBlue || 'inherit', "}\n\n.fSsSV_eKcq{background-color:").concat(theme.colorGrey || 'inherit', "}\n\n.fSsSV_euQM{padding:12px 0 12px 10px}\n\n.fSsSV_fuuc{padding-left:45px}\n\n.fSsSV_vDgC svg{fill:#fff}\n\n.fSsSV_fHMm{border-color:").concat(theme.colorHeaderBottomBorder || 'inherit', ";border-style:solid;border-width:0 0 1px 0}");
+    return "\n\n.fMmrG_cvRx{align-items:center;display:flex;height:100%;justify-content:center;min-height:47px;width:46px}\n\n.fMmrG_fPIL{min-width:500px}\n\n.fMmrG_fPIL table{border-collapse:separate;border-spacing:0 12px}\n\n.fMmrG_fPIL thead th{border-color:".concat(theme.colorHeaderBottomBorder || 'inherit', ";border-style:solid;border-width:0 0 1px 0}\n\n.fMmrG_fPIL table tbody tr td{border-style:solid;border-width:2px 0 2px 0;width:33.33%}\n\n.fMmrG_fPIL table tbody tr th:first-child{border-radius:4px 0 0 4px;border-style:solid;border-width:2px 0 2px 2px;font-weight:400}\n\n.fMmrG_fPIL table tbody tr td:last-child{border-radius:0 4px 4px 0;border-style:solid;border-width:2px 2px 2px 0}\n\n.fMmrG_dzqP table tbody tr:first-child td,.fMmrG_dzqP table tbody tr:first-child th{border-color:").concat(theme.colorGrey || 'inherit', "}\n\n.fMmrG_fZpZ table tbody tr:first-child td,.fMmrG_fZpZ table tbody tr:first-child th{border-color:").concat(theme.colorGreen || 'inherit', "}\n\n.fMmrG_fZpZ table tbody tr:nth-child(2) td,.fMmrG_fZpZ table tbody tr:nth-child(2) th{border-color:").concat(theme.colorRed || 'inherit', "}\n\n.fMmrG_dgTJ table tbody tr:first-child td,.fMmrG_dgTJ table tbody tr:first-child th{border-color:").concat(theme.colorGreen || 'inherit', "}\n\n.fMmrG_dgTJ table tbody tr:nth-child(2) td,.fMmrG_dgTJ table tbody tr:nth-child(2) th{border-color:").concat(theme.colorRed || 'inherit', "}\n\n.fMmrG_dgTJ table tbody tr:nth-child(3) td,.fMmrG_dgTJ table tbody tr:nth-child(3) th{border-color:").concat(theme.colorGrey || 'inherit', "}\n\n.fMmrG_bYLj table tbody tr:first-child td,.fMmrG_bYLj table tbody tr:first-child th{border-color:").concat(theme.colorGreen || 'inherit', "}\n\n.fMmrG_bYLj table tbody tr:nth-child(2) td,.fMmrG_bYLj table tbody tr:nth-child(2) th{border-color:").concat(theme.colorBlue || 'inherit', "}\n\n.fMmrG_bYLj table tbody tr:nth-child(3) td,.fMmrG_bYLj table tbody tr:nth-child(3) th{border-color:").concat(theme.colorRed || 'inherit', "}\n\n.fMmrG_bYLj table tbody tr:nth-child(4) td,.fMmrG_bYLj table tbody tr:nth-child(4) th{border-color:").concat(theme.colorGrey || 'inherit', "}\n\n.fMmrG_bvau{background-color:").concat(theme.colorGreen || 'inherit', "}\n\n.fMmrG_cxOH{background-color:").concat(theme.colorRed || 'inherit', "}\n\n.fMmrG_dsqS{background-color:").concat(theme.colorBlue || 'inherit', "}\n\n.fMmrG_eKcq{background-color:").concat(theme.colorGrey || 'inherit', "}\n\n.fMmrG_euQM{padding:12px 0 12px 10px}\n\n.fMmrG_fuuc{padding-left:45px}\n\n.fMmrG_vDgC svg{fill:#fff}\n\n.fMmrG_fHMm{border-color:").concat(theme.colorHeaderBottomBorder || 'inherit', ";border-style:solid;border-width:0 0 1px 0}");
   },
-  'iconWrapper': 'fSsSV_cvRx',
-  'collapsingTable': 'fSsSV_fPIL',
-  'onlyNoanswer': 'fSsSV_dzqP',
-  'correctIncorrect': 'fSsSV_fZpZ',
-  'correctIncorrectNoanswer': 'fSsSV_dgTJ',
-  'correctIncorrectNoanswerPartial': 'fSsSV_bUPM',
-  'correctBackground': 'fSsSV_bvau',
-  'incorrectBackground': 'fSsSV_cxOH',
-  'partialCorrectBackground': 'fSsSV_eRkO',
-  'noAnswerBackground': 'fSsSV_eKcq',
-  'labelWrapper': 'fSsSV_euQM',
-  'firstHeaderCell': 'fSsSV_fuuc',
-  'iconWhite': 'fSsSV_vDgC',
-  'headerCell': 'fSsSV_fHMm'
+  'iconWrapper': 'fMmrG_cvRx',
+  'collapsingTable': 'fMmrG_fPIL',
+  'onlyNoanswer': 'fMmrG_dzqP',
+  'correctIncorrect': 'fMmrG_fZpZ',
+  'correctIncorrectNoanswer': 'fMmrG_dgTJ',
+  'correctIncorrectNoanswerGraded': 'fMmrG_bYLj',
+  'correctBackground': 'fMmrG_bvau',
+  'incorrectBackground': 'fMmrG_cxOH',
+  'gradedBackground': 'fMmrG_dsqS',
+  'noAnswerBackground': 'fMmrG_eKcq',
+  'labelWrapper': 'fMmrG_euQM',
+  'firstHeaderCell': 'fMmrG_fuuc',
+  'iconWhite': 'fMmrG_vDgC',
+  'headerCell': 'fMmrG_fHMm'
 };
 import { Flex } from '@instructure/ui-flex';
 import classNames from 'classnames';
@@ -40,11 +40,11 @@ import { noAnswerMissing } from "./popoverContent.js";
 var noAnswerKey = 'noAnswer';
 var incorrectKey = 'incorrect';
 var correctKey = 'correct';
-var partialCorrectKey = 'partialCorrect';
+var gradedKey = 'graded';
 
 var _ref = /*#__PURE__*/React.createElement(IconCheckSolid, null);
 
-var _ref2 = /*#__PURE__*/React.createElement(IconOvalHalfSolid, null);
+var _ref2 = /*#__PURE__*/React.createElement(IconGradebookSolid, null);
 
 var _ref3 = /*#__PURE__*/React.createElement(IconXSolid, null);
 
@@ -122,9 +122,9 @@ export var AggregationTable = (_dec = themeable(theme, styles), _dec(_class = (_
       }, /*#__PURE__*/React.createElement(Text, null, concatenatedPercentage)));
     };
 
-    _this.partialCorrectExist = function () {
-      var aggregate = _this.props.answerSummary.aggregate;
-      return !!(aggregate === null || aggregate === void 0 ? void 0 : aggregate.partial_correct);
+    _this.gradedExist = function () {
+      var graded = _this.props.answerSummary.graded;
+      return !!graded;
     };
 
     _this.correctExist = function () {
@@ -142,24 +142,19 @@ export var AggregationTable = (_dec = themeable(theme, styles), _dec(_class = (_
       return !!no_answer;
     };
 
-    _this.getCorrectLabel = function () {
-      return _this.partialCorrectExist() ? t('Fully correct') : t('Correct');
-    };
-
     _this.renderCorrect = function () {
       var aggregate = _this.props.answerSummary.aggregate;
       var correct = aggregate.correct;
       var correctCount = correct.count || 0;
       var correctPercentage = correct.percentage || 0;
-      return _this.renderRow(correctKey, _ref, _this.getCorrectLabel(), correctCount, correctPercentage);
+      return _this.renderRow(correctKey, _ref, t('Correct'), correctCount, correctPercentage);
     };
 
-    _this.renderPartialCorrect = function () {
-      var aggregate = _this.props.answerSummary.aggregate;
-      var partial_correct = aggregate.partial_correct;
-      var partialCorrectCount = partial_correct.count || 0;
-      var partialCorrectPercentage = partial_correct.percentage || 0;
-      return _this.renderRow(partialCorrectKey, _ref2, t('Partially correct'), partialCorrectCount, partialCorrectPercentage);
+    _this.renderGraded = function () {
+      var graded = _this.props.answerSummary.graded;
+      var gradedCount = graded.count || 0;
+      var gradedPercentage = graded.percentage || 0;
+      return _this.renderRow(gradedKey, _ref2, t('Graded'), gradedCount, gradedPercentage);
     };
 
     _this.renderIncorrect = function () {
@@ -180,16 +175,16 @@ export var AggregationTable = (_dec = themeable(theme, styles), _dec(_class = (_
     _this.getColorProfile = function () {
       var colorProfile;
 
-      var correctIncorrectNoAnswerPartial = _this.partialCorrectExist() && _this.noAnswerExist() && _this.correctExist() && _this.incorrectExist();
+      var correctIncorrectNoAnswerGraded = _this.gradedExist() && _this.noAnswerExist() && _this.correctExist() && _this.incorrectExist();
 
-      var correctIncorrectNoAnswer = !_this.partialCorrectExist() && _this.noAnswerExist() && _this.correctExist() && _this.incorrectExist();
+      var correctIncorrectNoAnswer = !_this.gradedExist() && _this.noAnswerExist() && _this.correctExist() && _this.incorrectExist();
 
-      var onlyNoAnswer = _this.noAnswerExist() && !_this.partialCorrectExist() && !_this.correctExist() && !_this.incorrectExist();
+      var onlyNoAnswer = _this.noAnswerExist() && !_this.gradedExist() && !_this.correctExist() && !_this.incorrectExist();
 
       if (correctIncorrectNoAnswer) {
         colorProfile = 'correctIncorrectNoanswer';
-      } else if (correctIncorrectNoAnswerPartial) {
-        colorProfile = 'correctIncorrectNoanswerPartial';
+      } else if (correctIncorrectNoAnswerGraded) {
+        colorProfile = 'correctIncorrectNoanswerGraded';
       } else if (onlyNoAnswer) {
         colorProfile = 'onlyNoanswer';
       } else {
@@ -205,7 +200,7 @@ export var AggregationTable = (_dec = themeable(theme, styles), _dec(_class = (_
         className: classNames(styles.collapsingTable, styles[_this.getColorProfile()])
       }, /*#__PURE__*/React.createElement(Table, {
         caption: t('Answer Frequency Summary Aggregates')
-      }, _this.renderHeaderRow(popover), /*#__PURE__*/React.createElement(Table.Body, null, _this.correctExist() && _this.renderCorrect(), _this.partialCorrectExist() && _this.renderPartialCorrect(), _this.incorrectExist() && _this.renderIncorrect(), _this.noAnswerExist() && _this.renderNoAnswer())));
+      }, _this.renderHeaderRow(popover), /*#__PURE__*/React.createElement(Table.Body, null, _this.correctExist() && _this.renderCorrect(), _this.gradedExist() && _this.renderGraded(), _this.incorrectExist() && _this.renderIncorrect(), _this.noAnswerExist() && _this.renderNoAnswer())));
     };
 
     return _this;

package/es/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/shared/ExpandableCard/index.js

@@ -0,0 +1 @@
+export { ExpandableCard as default } from "./presenter.js";

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

@@ -0,0 +1,104 @@
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
+
+var _dec, _class, _class2, _temp;
+
+/** @jsx jsx */
+import { Component } from 'react';
+import Card from "../../../../../../../common/components/shared/Card/index.js";
+import { Flex } from '@instructure/ui-flex';
+import { jsx, withStyle } from '@instructure/emotion';
+import ExpandButton from "../../../../../../../common/components/shared/ExpandButton/index.js";
+import t from '@instructure/quiz-i18n/es/format-message';
+import generateStyle from "./styles.js";
+import generateComponentTheme from "./theme.js";
+import PropTypes from 'prop-types';
+export var ExpandableCard = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_class = (_temp = _class2 = /*#__PURE__*/function (_Component) {
+  _inherits(ExpandableCard, _Component);
+
+  var _super = _createSuper(ExpandableCard);
+
+  function ExpandableCard() {
+    var _this;
+
+    _classCallCheck(this, ExpandableCard);
+
+    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.state = {
+      bodyExpanded: false
+    };
+
+    _this.handleBodyToggle = function () {
+      _this.setState({
+        bodyExpanded: !_this.state.bodyExpanded
+      });
+    };
+
+    _this.renderGroup = function () {
+      var headLine = _this.props.headLine;
+      return jsx(Flex, {
+        direction: "row",
+        alignItems: "start"
+      }, jsx(Flex.Item, {
+        shouldShrink: true,
+        shouldGrow: true,
+        margin: "xx-small none none none"
+      }, headLine), jsx(Flex.Item, {
+        margin: "none none none x-small"
+      }, jsx(ExpandButton, {
+        onClick: _this.handleBodyToggle,
+        title: _this.state.bodyExpanded ? t('collapse group result') : t('expand group result'),
+        isExpanded: _this.state.bodyExpanded
+      })));
+    };
+
+    _this.renderBody = function () {
+      var _this$props = _this.props,
+          content = _this$props.content,
+          styles = _this$props.styles;
+      var bodyContainer = styles.bodyContainer;
+      return jsx(Flex.Item, {
+        shouldShrink: true,
+        padding: "x-small small x-small small"
+      }, jsx("div", {
+        css: bodyContainer
+      }, content));
+    };
+
+    _this.render = function () {
+      var styles = _this.props.styles;
+      var groupWrapper = styles.groupWrapper;
+      var bodyExpanded = _this.state.bodyExpanded;
+      return jsx("div", {
+        css: groupWrapper
+      }, jsx(Card, null, jsx(Flex, {
+        direction: "column",
+        justifyItems: "start"
+      }, jsx(Flex.Item, {
+        shouldGrow: true,
+        shouldShrink: true,
+        overflowY: "visible"
+      }, jsx(Flex, {
+        direction: "column",
+        justifyItems: "start"
+      }, jsx(Flex.Item, {
+        shouldShrink: true,
+        padding: "x-small small x-small small",
+        overflowY: "hidden"
+      }, _this.renderGroup()), bodyExpanded && _this.renderBody())))));
+    };
+
+    return _this;
+  }
+
+  return ExpandableCard;
+}(Component), _class2.propTypes = {
+  headLine: PropTypes.node,
+  content: PropTypes.node,
+  styles: PropTypes.object
+}.isRequired, _temp)) || _class);

package/es/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/shared/{ChoiceGroupTypeTable → ExpandableCard}/styles.js

@@ -6,8 +6,9 @@ var generateStyle = function generateStyle(componentTheme) {
       minWidth: componentTheme.cardMinWidth,
       maxWidth: '100%'
     },
-    cardWrapper: {
-      margin: "0 0 ".concat(componentTheme.cardBottomMargin, " 0")
+    bodyContainer: {
+      overflow: 'auto',
+      maxHeight: '600px'
     }
   };
 };

package/es/reporting/components/resources/NewQuizAndItemAnalysis/AnswerFrequencySummary/shared/ExpandableCard/theme.js

@@ -0,0 +1,7 @@
+var generateComponentTheme = function generateComponentTheme() {
+  return {
+    cardMinWidth: '500px'
+  };
+};
+
+export default generateComponentTheme;

package/es/reporting/components/resources/NewQuizAndItemAnalysis/NewItemAnalysis/index.js

@@ -13,7 +13,10 @@ function mapStateToProps(_state) {
       trueFalseEnabled: featureOn('ia_true_false_afs'),
       choiceEnabled: featureOn('ia_choice_afs'),
       multiAnswerEnabled: featureOn('ia_multi_answer_afs'),
-      fillInTheBlankEnabled: featureOn('ia_rich_fill_blank_afs')
+      fillInTheBlankEnabled: featureOn('ia_rich_fill_blank_afs'),
+      essayEnabled: featureOn('ia_essay_afs'),
+      fileUploadEnabled: featureOn('ia_file_upload_afs'),
+      numericEnabled: featureOn('ia_numeric_afs')
     }
   };
 }

package/es/reporting/components/resources/NewQuizAndItemAnalysis/propTypes.js

@@ -32,11 +32,11 @@ export var aggregateDetailPropType = PropTypes.shape({
 });
 export var aggregatePropType = PropTypes.shape({
   correct: aggregateDetailPropType.isRequired,
-  incorrect: aggregateDetailPropType.isRequired,
-  partial_correct: aggregateDetailPropType
+  incorrect: aggregateDetailPropType.isRequired
 });
 export var onlyAggregatePropType = PropTypes.shape({
   no_answer: aggregateDetailPropType,
+  graded: aggregateDetailPropType,
   aggregate: aggregatePropType
 });
 export var choiceTypeObject = PropTypes.shape({
@@ -50,6 +50,17 @@ export var choiceTypeAnswerSummaryPropType = PropTypes.shape({
   no_answer: aggregateDetailPropType,
   aggregate: aggregatePropType
 });
+export var scoreDistributionTypeAnswerSummaryPropType = PropTypes.shape({
+  no_answer: aggregateDetailPropType.isRequired,
+  aggregate: aggregatePropType.isRequired,
+  graded: aggregateDetailPropType.isRequired,
+  score_distribution: PropTypes.arrayOf(scoreDistributionType).isRequired
+});
+export var scoreDistributionType = PropTypes.shape({
+  count: PropTypes.number.isRequired,
+  score: PropTypes.number.isRequired,
+  percentage: PropTypes.number.isRequired
+});
 export var matchingTypeAnswerSummaryPropType = PropTypes.shape({
   questions: PropTypes.objectOf(PropTypes.shape({
     body: PropTypes.string,
@@ -77,7 +88,43 @@ export var richFillBlankTypeAnswerSummaryPropType = PropTypes.shape({
   no_answer: aggregateDetailPropType,
   aggregate: aggregatePropType
 });
-export var answerSummaryPropType = PropTypes.oneOfType([choiceTypeAnswerSummaryPropType, onlyAggregatePropType, matchingTypeAnswerSummaryPropType, richFillBlankTypeAnswerSummaryPropType]);
+var withinARangeTypeObject = PropTypes.shape({
+  end: PropTypes.string.isRequired,
+  start: PropTypes.string.isRequired,
+  choices: PropTypes.arrayOf(choiceTypeObject).isRequired,
+  type: PropTypes.string.isRequired
+});
+var marginOfErrorTypeObject = PropTypes.shape({
+  margin: PropTypes.string.isRequired,
+  margin_type: PropTypes.string.isRequired,
+  value: PropTypes.string.isRequired,
+  type: PropTypes.string.isRequired,
+  choices: PropTypes.arrayOf(choiceTypeObject).isRequired
+});
+var exactResponseTypeObject = PropTypes.shape({
+  value: PropTypes.string.isRequired,
+  type: PropTypes.string.isRequired,
+  choices: PropTypes.arrayOf(choiceTypeObject).isRequired
+});
+var preciseResponseTypeObject = PropTypes.shape({
+  value: PropTypes.string.isRequired,
+  precision: PropTypes.string.isRequired,
+  precision_type: PropTypes.string.isRequired,
+  type: PropTypes.string.isRequired,
+  choices: PropTypes.arrayOf(choiceTypeObject).isRequired
+});
+var uncategorizedTypeObject = PropTypes.shape({
+  type: PropTypes.string.isRequired,
+  choices: PropTypes.arrayOf(choiceTypeObject).isRequired
+});
+var numericRequirementTypeObject = PropTypes.oneOfType([withinARangeTypeObject, marginOfErrorTypeObject, exactResponseTypeObject, preciseResponseTypeObject, uncategorizedTypeObject]);
+export var numericTypeAnswerSummaryPropType = PropTypes.shape({
+  requirement: PropTypes.shape({
+    correct_answers: PropTypes.arrayOf(numericRequirementTypeObject).isRequired,
+    incorrect_answer_choices: PropTypes.arrayOf(choiceTypeObject).isRequired
+  })
+});
+export var answerSummaryPropType = PropTypes.oneOfType([choiceTypeAnswerSummaryPropType, onlyAggregatePropType, matchingTypeAnswerSummaryPropType, richFillBlankTypeAnswerSummaryPropType, scoreDistributionTypeAnswerSummaryPropType]);
 export var itemAnalysisPropType = PropTypes.shape({
   attempts: PropTypes.shape({
     students_responded: PropTypes.number,
@@ -109,5 +156,8 @@ export var afsFlags = PropTypes.shape({
   trueFalseEnabled: PropTypes.bool.isRequired,
   choiceEnabled: PropTypes.bool.isRequired,
   multiAnswerEnabled: PropTypes.bool.isRequired,
-  fillInTheBlankEnabled: PropTypes.bool.isRequired
+  fillInTheBlankEnabled: PropTypes.bool.isRequired,
+  numericEnabled: PropTypes.bool.isRequired,
+  essayEnabled: PropTypes.bool.isRequired,
+  fileUploadEnabled: PropTypes.bool.isRequired
 });