@instructure/quiz-core 22.16.1 → 22.17.0

package/lib/common/components/resources/quizSessionResult/Info/index.js

@@ -1,410 +0,0 @@
-/** @jsx jsx */ function _assert_this_initialized(self) {
-    if (self === void 0) {
-        throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
-    }
-    return self;
-}
-function _call_super(_this, derived, args) {
-    derived = _get_prototype_of(derived);
-    return _possible_constructor_return(_this, _is_native_reflect_construct() ? Reflect.construct(derived, args || [], _get_prototype_of(_this).constructor) : derived.apply(_this, args));
-}
-function _class_call_check(instance, Constructor) {
-    if (!(instance instanceof Constructor)) {
-        throw new TypeError("Cannot call a class as a function");
-    }
-}
-function _defineProperties(target, props) {
-    for(var i = 0; i < props.length; i++){
-        var descriptor = props[i];
-        descriptor.enumerable = descriptor.enumerable || false;
-        descriptor.configurable = true;
-        if ("value" in descriptor) descriptor.writable = true;
-        Object.defineProperty(target, descriptor.key, descriptor);
-    }
-}
-function _create_class(Constructor, protoProps, staticProps) {
-    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-    if (staticProps) _defineProperties(Constructor, staticProps);
-    return Constructor;
-}
-function _define_property(obj, key, value) {
-    if (key in obj) {
-        Object.defineProperty(obj, key, {
-            value: value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-        });
-    } else {
-        obj[key] = value;
-    }
-    return obj;
-}
-function _get_prototype_of(o) {
-    _get_prototype_of = Object.setPrototypeOf ? Object.getPrototypeOf : function getPrototypeOf(o) {
-        return o.__proto__ || Object.getPrototypeOf(o);
-    };
-    return _get_prototype_of(o);
-}
-function _inherits(subClass, superClass) {
-    if (typeof superClass !== "function" && superClass !== null) {
-        throw new TypeError("Super expression must either be null or a function");
-    }
-    subClass.prototype = Object.create(superClass && superClass.prototype, {
-        constructor: {
-            value: subClass,
-            writable: true,
-            configurable: true
-        }
-    });
-    if (superClass) _set_prototype_of(subClass, superClass);
-}
-function _possible_constructor_return(self, call) {
-    if (call && (_type_of(call) === "object" || typeof call === "function")) {
-        return call;
-    }
-    return _assert_this_initialized(self);
-}
-function _set_prototype_of(o, p) {
-    _set_prototype_of = Object.setPrototypeOf || function setPrototypeOf(o, p) {
-        o.__proto__ = p;
-        return o;
-    };
-    return _set_prototype_of(o, p);
-}
-function _type_of(obj) {
-    "@swc/helpers - typeof";
-    return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
-}
-function _is_native_reflect_construct() {
-    try {
-        var result = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {}));
-    } catch (_) {}
-    return (_is_native_reflect_construct = function() {
-        return !!result;
-    })();
-}
-function _ts_decorate(decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for(var i = decorators.length - 1; i >= 0; i--)if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-}
-import { Component } from 'react';
-import PropTypes from 'prop-types';
-import ImmutablePropTypes from 'react-immutable-proptypes';
-import { AccessibleContent, ScreenReaderContent } from '@instructure/ui-a11y-content';
-import { Alert } from '@instructure/ui-alerts';
-import { Text } from '@instructure/ui-text';
-import { ProgressCircle } from '@instructure/ui-progress';
-import { Heading } from '@instructure/ui-heading';
-import { View } from '@instructure/ui-view';
-import { jsx } from '@instructure/emotion';
-import t from '@instructure/quiz-i18n/format-message';
-import { scoreToLetterGrade } from '@instructure/grading-utils';
-import { withI18nSupport, withStyleOverrides } from '@instructure/quiz-common';
-import FormattedDuration from '../../../shared/FormattedDuration';
-import { formatTime } from '../../../../util/formatTimespan';
-import generateStyle from './styles';
-import generateComponentTheme from './theme';
-var unknownPercentageValue = 'UNKNOWN_PERCENTAGE';
-var _withI18nSupport;
-export var Info = /*#__PURE__*/ function(_superClass) {
-    "use strict";
-    _inherits(Info, _superClass);
-    function Info(props) {
-        _class_call_check(this, Info);
-        var _this;
-        _this = _call_super(this, Info, [
-            props
-        ]);
-        _this.progressTextFormatter = _this.progressTextFormatter.bind(_this);
-        _this.progressDisplayFormatter = _this.progressDisplayFormatter.bind(_this);
-        return _this;
-    }
-    _create_class(Info, [
-        {
-            key: "points",
-            get: function get() {
-                return this.props.quizSessionResult.score;
-            }
-        },
-        {
-            key: "pointsPresent",
-            get: function get() {
-                return typeof this.points === 'number';
-            }
-        },
-        {
-            key: "pointsMissing",
-            get: function get() {
-                return !this.pointsPresent;
-            }
-        },
-        {
-            key: "pointsPossible",
-            get: function get() {
-                return this.props.quizSessionResult.pointsPossible;
-            }
-        },
-        {
-            key: "pointsPossiblePresent",
-            get: function get() {
-                return typeof this.pointsPossible === 'number';
-            }
-        },
-        {
-            key: "pointsPossibleMissing",
-            get: function get() {
-                return !this.pointsPossiblePresent;
-            }
-        },
-        {
-            key: "percentageVal",
-            get: function get() {
-                var ratio = this.props.quizSessionResult.percentage;
-                return isNaN(ratio) ? unknownPercentageValue : ratio;
-            }
-        },
-        {
-            key: "mainPointsText",
-            get: function get() {
-                if (this.pointsMissing && this.pointsPossibleMissing) {
-                    return '--';
-                }
-                var valueToUse = this.pointsPresent ? this.points : this.pointsPossible;
-                return t.number(valueToUse);
-            }
-        },
-        {
-            key: "subPointsText",
-            get: function get() {
-                if (this.pointsPresent && this.pointsPossiblePresent) {
-                    return t("Out of {\n        points, plural,\n        one {# point}\n        other {# points}\n      }", {
-                        points: this.pointsPossible
-                    });
-                }
-                if (this.pointsPresent) {
-                    return t("Earned {points, plural,\n        one {point}\n        other {points}\n      }", {
-                        points: this.points
-                    });
-                }
-                // We use "Points Possible" when only points is present or when nothing is present
-                return t("{points, plural,\n      one {Point}\n      other {Points}\n    } possible", {
-                    points: this.pointsPossible
-                });
-            }
-        },
-        {
-            key: "pointsText",
-            get: function get() {
-                if (this.pointsPresent && this.pointsPossiblePresent) {
-                    return t("{points, number} out of {\n        total, plural,\n        one {# point}\n        other {# points}\n      }", {
-                        points: this.points,
-                        total: this.pointsPossible
-                    });
-                }
-                if (this.pointsPresent) {
-                    return t("Earned {points, plural,\n        one {# point}\n        other {# points}\n      }", {
-                        points: this.points
-                    });
-                }
-                // We use "Points Possible" when only points is present or when nothing is present
-                if (this.pointsPossiblePresent) {
-                    return t("{points, plural,\n        one {# point}\n        other {# points}\n      } possible", {
-                        points: this.pointsPossible
-                    });
-                }
-                return t('Unknown Score');
-            }
-        },
-        {
-            // needed for inst-ui Progress
-            key: "progressTextFormatter",
-            value: function progressTextFormatter(param) {
-                var valueNow = param.valueNow;
-                var percentageUnknown = valueNow === unknownPercentageValue;
-                return percentageUnknown ? t('Unknown Score') : t('Your score was {percentage}.', {
-                    percentage: this.formatPercentMax2FractionDigits(valueNow)
-                });
-            }
-        },
-        {
-            // needed for inst-ui Progress
-            key: "progressDisplayFormatter",
-            value: function progressDisplayFormatter(param) {
-                var valueNow = param.valueNow;
-                var valueToShow = valueNow === unknownPercentageValue ? t({
-                    id: 'progress_display',
-                    default: '?',
-                    description: 'placeholder for an unknown percentage value'
-                }) : this.formatPercentMax2FractionDigits(valueNow);
-                return /*#__PURE__*/ jsx("div", {
-                    css: this.props.styles.scorePercentage,
-                    "data-automation": "sdk-quiz-score-percentage"
-                }, valueToShow);
-            }
-        },
-        {
-            key: "renderAlert",
-            value: function renderAlert() {
-                var _this_props = this.props, quizSessionResult = _this_props.quizSessionResult, sessionItemResults = _this_props.sessionItemResults;
-                var ungradedCount = sessionItemResults.reduce(function(count, sessionItemResult) {
-                    return sessionItemResult.getIn([
-                        'scoredData',
-                        'gradeStatus'
-                    ]) === 'waiting' ? count + 1 : count;
-                }, 0);
-                var hasUngradedQuesitons = ungradedCount > 0;
-                var alerts = [];
-                if (quizSessionResult.isLoaded() && quizSessionResult.autogradingFailed()) {
-                    var msg = t('There was a grading problem. Please inform your instructor.');
-                    alerts.push(/*#__PURE__*/ jsx(Alert, {
-                        key: "autograding_failed",
-                        variant: "warning"
-                    }, msg));
-                }
-                if (hasUngradedQuesitons && quizSessionResult.isLoaded()) {
-                    var ungradedText = t("{\n        count, plural,\n        one {# question requires grading}\n        other {# questions require grading}\n      }", {
-                        count: ungradedCount
-                    });
-                    alerts.push(/*#__PURE__*/ jsx(Alert, {
-                        key: "manual_grading",
-                        variant: "info"
-                    }, ungradedText));
-                }
-                if (alerts.length) {
-                    return /*#__PURE__*/ jsx("div", {
-                        css: this.props.styles.alertWrapper
-                    }, /*#__PURE__*/ jsx("div", {
-                        css: this.props.styles.alertWidth,
-                        "data-automation": "sdk-results-requires-grading"
-                    }, alerts));
-                }
-            }
-        },
-        {
-            key: "renderLetterGrade",
-            value: function renderLetterGrade() {
-                var letterGrade = scoreToLetterGrade(this.percentageVal * 100, this.props.gradingScheme);
-                var gradeText = t('Grade for this attempt');
-                var alt = t('Grade for this attempt: { grade }', {
-                    grade: letterGrade
-                });
-                return /*#__PURE__*/ jsx(AccessibleContent, {
-                    alt: alt
-                }, /*#__PURE__*/ jsx(View, {
-                    as: "div"
-                }, /*#__PURE__*/ jsx(Text, {
-                    size: "xx-large",
-                    weight: "bold",
-                    color: "primary"
-                }, letterGrade)), /*#__PURE__*/ jsx(Text, {
-                    color: "secondary"
-                }, gradeText));
-            }
-        },
-        {
-            key: "renderScoreStats",
-            value: function renderScoreStats() {
-                return /*#__PURE__*/ jsx("div", {
-                    css: this.props.styles.scoreStats
-                }, this.renderProgress(), this.renderPointsDisplay());
-            }
-        },
-        {
-            key: "renderProgress",
-            value: function renderProgress() {
-                if (this.pointsMissing || this.pointsPossibleMissing) {
-                    return null;
-                }
-                return /*#__PURE__*/ jsx("div", {
-                    css: this.props.styles.score,
-                    "data-automation": "sdk-info-score"
-                }, /*#__PURE__*/ jsx(ProgressCircle, {
-                    shouldAnimateOnMount: true,
-                    size: "large",
-                    screenReaderLabel: t('Your Score'),
-                    formatScreenReaderValue: this.progressTextFormatter,
-                    renderValue: this.progressDisplayFormatter,
-                    valueNow: this.percentageVal,
-                    valueMax: 1
-                }));
-            }
-        },
-        {
-            key: "renderPointsDisplay",
-            value: function renderPointsDisplay() {
-                return /*#__PURE__*/ jsx("div", {
-                    css: this.props.styles.infoWrapper
-                }, /*#__PURE__*/ jsx(AccessibleContent, {
-                    alt: this.pointsText
-                }, /*#__PURE__*/ jsx(Text, {
-                    as: "div",
-                    color: "primary",
-                    size: "xx-large",
-                    weight: "bold"
-                }, this.mainPointsText), /*#__PURE__*/ jsx(Text, {
-                    color: "secondary"
-                }, this.subPointsText)));
-            }
-        },
-        {
-            key: "renderTime",
-            value: function renderTime() {
-                var attemptText = t('Time for this attempt');
-                var alt = t('Time for this attempt: { time }', {
-                    time: formatTime(this.props.quizSession.elapsedTime)
-                });
-                return /*#__PURE__*/ jsx(AccessibleContent, {
-                    alt: alt
-                }, /*#__PURE__*/ jsx(View, {
-                    as: "div"
-                }, /*#__PURE__*/ jsx(FormattedDuration, {
-                    fontSize: "xx-large",
-                    fontWeight: "bold",
-                    seconds: this.props.quizSession.elapsedTime
-                })), /*#__PURE__*/ jsx(Text, {
-                    color: "secondary"
-                }, attemptText));
-            }
-        },
-        {
-            key: "render",
-            value: function render() {
-                return /*#__PURE__*/ jsx("div", null, this.renderAlert(), /*#__PURE__*/ jsx("div", {
-                    css: this.props.styles.wrapper
-                }, /*#__PURE__*/ jsx("div", {
-                    css: this.props.styles.info,
-                    className: "fs-mask"
-                }, /*#__PURE__*/ jsx(ScreenReaderContent, null, /*#__PURE__*/ jsx(Heading, {
-                    level: "h2"
-                }, t('Assessment Statistics'))), this.props.restrictQuantitativeData ? this.renderLetterGrade() : this.renderScoreStats(), /*#__PURE__*/ jsx("div", {
-                    css: this.props.styles.infoWrapper
-                }, this.renderTime()))));
-            }
-        }
-    ]);
-    return Info;
-}(_withI18nSupport = withI18nSupport(Component));
-_define_property(Info, "displayName", 'QuizSessionResultInfo');
-_define_property(Info, "componentId", "Quizzes".concat(Info.displayName));
-_define_property(Info, "propTypes", {
-    gradingScheme: PropTypes.arrayOf(PropTypes.shape({
-        name: PropTypes.string,
-        value: PropTypes.number
-    })),
-    quizSession: ImmutablePropTypes.record.isRequired,
-    quizSessionResult: ImmutablePropTypes.record.isRequired,
-    restrictQuantitativeData: PropTypes.bool,
-    sessionItemResults: ImmutablePropTypes.list.isRequired,
-    styles: PropTypes.object
-});
-_define_property(Info, "defaultProps", {
-    gradingScheme: [],
-    restrictQuantitativeData: false
-});
-Info = _ts_decorate([
-    withStyleOverrides(generateStyle, generateComponentTheme)
-], Info);
-export default Info;

package/lib/common/components/resources/quizSessionResult/Info/styles.js

@@ -1,58 +0,0 @@
-var generateStyle = function(componentTheme) {
-    return {
-        alertWrapper: {
-            display: 'flex',
-            flexDirection: 'row',
-            alignItems: 'center',
-            justifyContent: 'center',
-            marginTop: componentTheme.alertWrapperMargin
-        },
-        alertWidth: {
-            flexGrow: 1,
-            maxWidth: '33rem,'
-        },
-        wrapper: {
-            padding: 'none',
-            margin: 'none',
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center'
-        },
-        info: {
-            alignSelf: 'center',
-            display: 'flex',
-            flexWrap: 'wrap',
-            alignItems: 'center',
-            justifyContent: 'center'
-        },
-        scoreStats: {
-            display: 'flex',
-            flexWrap: 'wrap',
-            alignItems: 'center',
-            justifyContent: 'flex-start',
-            flex: '1 1 auto'
-        },
-        score: {
-            display: 'flex',
-            alignItems: 'center',
-            flex: '1 1 auto',
-            margin: componentTheme.scoreMargin,
-            height: '150px',
-            width: '150px',
-            /*
-        progress modal sets a -1 z-index on its content
-        and this raises it above the app background
-      */ zIndex: componentTheme.scoreZIndex
-        },
-        scorePercentage: {
-            fontSize: componentTheme.scorePercentageFontSize,
-            fontWeight: componentTheme.scorePercentageFontWeight
-        },
-        infoWrapper: {
-            flex: '1 1 auto',
-            margin: componentTheme.infoWrapperMargin,
-            paddingLeft: componentTheme.inforWrapperPadding
-        }
-    };
-};
-export default generateStyle;

package/lib/common/components/resources/quizSessionResult/Info/theme.js

@@ -1,13 +0,0 @@
-var generateComponentTheme = function(param) {
-    var spacing = param.spacing, typography = param.typography;
-    return {
-        alertWrapperMargin: spacing.xSmall,
-        scoreMargin: spacing.small,
-        scoreZIndex: '2222',
-        scorePercentageFontSize: typography.fontSizeLarge,
-        scorePercentageFontWeight: typography.fontWeightBold,
-        infoWrapperMargin: spacing.small,
-        inforWrapperPadding: spacing.small
-    };
-};
-export default generateComponentTheme;