@instructure/quiz-core 20.36.1 → 20.37.1

package/es/common/components/AccessCodeTextInput/index.js

@@ -0,0 +1,47 @@
+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";
+import React, { Component } from 'react';
+import MaskedTextInput from "../MaskedTextInput/index.js";
+import { ScreenReaderContent } from '@instructure/ui-a11y-content';
+import t from '@instructure/quiz-i18n/es/format-message';
+export var AccessCodeTextInput = /*#__PURE__*/function (_Component) {
+  _inherits(AccessCodeTextInput, _Component);
+  var _super = _createSuper(AccessCodeTextInput);
+  function AccessCodeTextInput() {
+    var _this;
+    _classCallCheck(this, AccessCodeTextInput);
+    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 = {
+      masked: true
+    };
+    _this.handleMaskedChange = function () {
+      _this.setState(function (state) {
+        return {
+          masked: !state.masked
+        };
+      });
+    };
+    return _this;
+  }
+  _createClass(AccessCodeTextInput, [{
+    key: "render",
+    value: function render() {
+      return /*#__PURE__*/React.createElement(MaskedTextInput, Object.assign({
+        renderLabel: /*#__PURE__*/React.createElement(ScreenReaderContent, null, t('Access Code')),
+        display: "inline-block",
+        type: "text",
+        onMaskedChange: this.handleMaskedChange,
+        masked: this.state.masked,
+        checkboxLabel: t('Show access code')
+      }, this.props));
+    }
+  }]);
+  AccessCodeTextInput.displayName = "AccessCodeTextInput";
+  return AccessCodeTextInput;
+}(Component);
+export default AccessCodeTextInput;

package/es/common/components/ImportModal/presenter.js

@@ -14,9 +14,8 @@ import { ProgressBar } from '@instructure/ui-progress';
 import { Heading } from '@instructure/ui-heading';
 import { Tabs } from '@instructure/ui-tabs';
 import { ToggleDetails } from '@instructure/ui-toggle-details';
-import { TextInput } from '@instructure/ui-text-input';
 import { jsx } from '@instructure/emotion';
-import { ImportantModal, ModalHeader, ModalBody, ModalFooter, FILE_UPLOAD_SELECT, FILE_UPLOAD_IMPORTING, FILE_UPLOAD_SUCCESS, FILE_UPLOAD_FAILURE, FILE_UPLOAD_ERROR, XSMALL_SIDE_MARGIN, withStyleOverrides } from '@instructure/quiz-common';
+import { ImportantModal, ModalHeader, ModalBody, ModalFooter, FILE_UPLOAD_SELECT, FILE_UPLOAD_IMPORTING, FILE_UPLOAD_SUCCESS, FILE_UPLOAD_FAILURE, FILE_UPLOAD_ERROR, TextInput, XSMALL_SIDE_MARGIN, withStyleOverrides } from '@instructure/quiz-common';
 import generateStyle from "./styles.js";
 import generateComponentTheme from "./theme.js";
 import ImportFileSelector from "./ImportFileSelector/index.js";

package/es/common/components/MaskedTextInput/MaskedTextInput.stories.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import { MaskedTextInput } from "./index.js";
+var props = {
+  renderLabel: 'Example of a masked text input',
+  checkboxLabel: 'Select to show the current value',
+  value: 'Is it secret? Is it safe?',
+  onMaskedChange: Function.prototype
+};
+export default {
+  title: MaskedTextInput.name
+};
+export var whenMasked = function whenMasked() {
+  return /*#__PURE__*/React.createElement(MaskedTextInput, props);
+};
+export var whenUnmasked = function whenUnmasked() {
+  return /*#__PURE__*/React.createElement(MaskedTextInput, Object.assign({}, props, {
+    masked: false
+  }));
+};

package/es/common/components/MaskedTextInput/index.js

@@ -0,0 +1,64 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+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";
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { View } from '@instructure/ui-view';
+import { Checkbox } from '@instructure/ui-checkbox';
+import { omitProps } from '@instructure/ui-react-utils';
+import { TextInput } from '@instructure/quiz-common';
+var maskedTextInputPropTypes = {
+  /**
+   * The label to be used for the checkbox that controls whether the input is masked
+   */
+  checkboxLabel: PropTypes.string.isRequired,
+  /**
+   * Whether or not the input text is masked
+   */
+  masked: PropTypes.bool,
+  /**
+   * The function to call when the user clicks the checkbox to either mask or unmask the input
+   */
+  onMaskedChange: PropTypes.func
+};
+export var MaskedTextInput = /*#__PURE__*/function (_Component) {
+  _inherits(MaskedTextInput, _Component);
+  var _super = _createSuper(MaskedTextInput);
+  function MaskedTextInput() {
+    _classCallCheck(this, MaskedTextInput);
+    return _super.apply(this, arguments);
+  }
+  _createClass(MaskedTextInput, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        checkboxLabel = _this$props.checkboxLabel,
+        masked = _this$props.masked,
+        onMaskedChange = _this$props.onMaskedChange,
+        type = _this$props.type;
+      var textInputProps = _objectSpread(_objectSpread({}, omitProps(this.props, maskedTextInputPropTypes)), {}, {
+        type: masked ? 'password' : type
+      });
+      return /*#__PURE__*/React.createElement(View, {
+        as: "div"
+      }, /*#__PURE__*/React.createElement(TextInput, textInputProps), /*#__PURE__*/React.createElement(View, {
+        as: "div",
+        margin: "small 0"
+      }, /*#__PURE__*/React.createElement(Checkbox, {
+        label: checkboxLabel,
+        checked: !masked,
+        onChange: onMaskedChange
+      })));
+    }
+  }]);
+  MaskedTextInput.displayName = "MaskedTextInput";
+  return MaskedTextInput;
+}(Component);
+MaskedTextInput.propTypes = _objectSpread(_objectSpread({}, maskedTextInputPropTypes), TextInput.propTypes);
+MaskedTextInput.defaultProps = _objectSpread(_objectSpread({}, TextInput.defaultProps), {}, {
+  masked: true,
+  onMaskedChange: Function.prototype
+});
+export default MaskedTextInput;

package/es/common/components/layout/Page/styles.js

@@ -17,16 +17,7 @@ var generateStyle = function generateStyle(componentTheme, props) {
       overflowY: 'auto'
     }), {}, {
       transition: componentTheme.contentTransition,
-      width: '100%',
-      '.user_content p': {
-        margin: componentTheme.userContentMargin,
-        '&:first-of-type': {
-          marginTop: componentTheme.userContentZeroMargin
-        },
-        '&:last-child': {
-          marginBottom: componentTheme.userContentZeroMargin
-        }
-      }
+      width: '100%'
     })
   };
 };

package/es/common/components/layout/navbar/externalStyles.js

@@ -0,0 +1,7 @@
+export var generateExternalStyle = function generateExternalStyle() {
+  return {
+    showBrandIcon: true,
+    desktopBottomBorder: true,
+    desktopBottomBorderInverse: true
+  };
+};

package/es/common/components/layout/navbar/styles.js

@@ -1,10 +1,9 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import { generateExternalStyle } from "./externalStyles.js";
 var generateStyle = function generateStyle(componentTheme) {
-  return {
-    showBrandIcon: true,
-    desktopBottomBorder: true,
-    desktopBottomBorderInverse: true,
+  return _objectSpread({
     backgroundColor: componentTheme.backgroundColor,
     phoneBreakPoint: componentTheme.phoneBreakPoint
-  };
+  }, generateExternalStyle());
 };
 export default generateStyle;

package/es/common/components/layout/sidebar/Sidebar/externalStyles.js

@@ -0,0 +1,10 @@
+export var generateExternalStyle = function generateExternalStyle(componentTheme) {
+  return {
+    sidebar: {
+      borderTop: "".concat(componentTheme.sidebarBorderWidth, " solid ").concat(componentTheme.sidebarBorderColor),
+      borderRight: "".concat(componentTheme.sidebarBorderWidth, " solid ").concat(componentTheme.sidebarBorderColor),
+      borderBottom: "".concat(componentTheme.sidebarBorderWidth, " solid ").concat(componentTheme.sidebarBorderColor),
+      borderLeft: "".concat(componentTheme.sidebarBorderWidth, " solid ").concat(componentTheme.sidebarBorderColor)
+    }
+  };
+};

package/es/common/components/layout/sidebar/Sidebar/styles.js

@@ -1,18 +1,16 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import merge from 'lodash/merge';
+import { generateExternalStyle } from "./externalStyles.js";
 var generateStyle = function generateStyle(componentTheme, props) {
   var _commonContainer;
   var mq = "@media screen and (".concat(componentTheme.phoneBreakPoint, ")");
   var mp = '@media print';
-  return {
+  return merge({
     sidebar: _objectSpread(_objectSpread(_defineProperty({
       boxSizing: 'border-box',
       width: componentTheme.sidebarWidthClosed,
       backgroundColor: componentTheme.sidebarBackgroundColor,
-      borderTop: "".concat(componentTheme.sidebarBorderWidth, " solid ").concat(componentTheme.sidebarBorderColor),
-      borderRight: "".concat(componentTheme.sidebarBorderWidth, " solid ").concat(componentTheme.sidebarBorderColor),
-      borderBottom: "".concat(componentTheme.sidebarBorderWidth, " solid ").concat(componentTheme.sidebarBorderColor),
-      borderLeft: "".concat(componentTheme.sidebarBorderWidth, " solid ").concat(componentTheme.sidebarBorderColor),
       color: componentTheme.sidebarColor,
       height: '100%',
       overflow: 'hidden',
@@ -111,6 +109,6 @@ var generateStyle = function generateStyle(componentTheme, props) {
     }), _defineProperty(_commonContainer, mp, {
       display: 'none'
     }), _commonContainer)
-  };
+  }, generateExternalStyle(componentTheme));
 };
 export default generateStyle;

package/es/common/components/resources/item/ItemEdit/presenter.js

@@ -7,16 +7,14 @@ import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import OutcomeAlignments from '@instructure/outcomes-ui/es/containers/OutcomeAlignments';
 import OutcomeCount from '@instructure/outcomes-ui/es/containers/OutcomeCount';
-import { FormFieldGroup } from '@instructure/ui-form-field';
 import { ScreenReaderContent } from '@instructure/ui-a11y-content';
 import CustomPropTypes from "../../../../../common/util/CustomPropTypes.js";
 import componentForItem from "../../../../util/componentForItem.js";
-import { liveRegion, COMPONENT_EDIT } from '@instructure/quiz-common';
+import { liveRegion, COMPONENT_EDIT, FormFieldGroup } from '@instructure/quiz-common';
 import t from '@instructure/quiz-i18n/es/format-message';
 import { propsForInteractionEdit } from "../../../../util/interactionTypePropsHelper.js";
 import elementsForSelectors from "../../../../../common/util/ElementsForSelectors.js";
 import { toErrors } from "../../../../util/instUIMessages.js";
-import { featureOn } from "../../../../../common/util/featureCheck.js";
 export var ItemEdit = /*#__PURE__*/function (_Component) {
   _inherits(ItemEdit, _Component);
   var _super = _createSuper(ItemEdit);
@@ -64,7 +62,7 @@ export var ItemEdit = /*#__PURE__*/function (_Component) {
       var launchContextUuid = this.props.scope.launch_context_uuid;
       var launchContextTitle = this.props.scope.title;
       // If editing within a quiz, there is no account launch context
-      if (featureOn('sub_account_bank_sharing') && rootAccountName) {
+      if (rootAccountName) {
         launchContexts.push({
           uuid: this.props.rootAccountUuid,
           name: rootAccountName

package/es/common/components/resources/quiz/instructions/styles.js

@@ -4,20 +4,19 @@ var generateStyle = function generateStyle(componentTheme) {
       position: 'relative',
       width: '100%',
       boxSizing: 'border-box',
-      paddingLeft: componentTheme.wrapperPadding,
-      paddingRight: componentTheme.wrapperPadding,
+      padding: "0 ".concat(componentTheme.wrapperPadding, " ").concat(componentTheme.wrapperPadding),
       '&::after': {
         clear: 'both',
         content: '""',
         display: 'table'
       },
       '.user_content p': {
-        margin: componentTheme.userContentMargin,
+        margin: "".concat(componentTheme.userContentMargin, " 0"),
         '&:first-of-type': {
-          marginTop: componentTheme.userContentZeroMargin
+          margin: "0 0 ".concat(componentTheme.userContentMargin)
         },
         '&:last-child': {
-          marginBottom: componentTheme.userContentMargin
+          margin: "".concat(componentTheme.userContentMargin, " 0 0")
         }
       }
     },

package/es/common/components/resources/quiz/instructions/theme.js

@@ -4,8 +4,7 @@ var generateComponentTheme = function generateComponentTheme(_ref) {
   return {
     wrapperPadding: spacing.large,
     textFontSize: typography.fontSizeMedium,
-    userContentMargin: spacing.mediumSmall,
-    userContentZeroMargin: 0
+    userContentMargin: spacing.mediumSmall
   };
 };
 export default generateComponentTheme;

package/es/common/components/resources/stimulus/StimulusEditInfo/presenter.js

@@ -8,16 +8,13 @@ import { Component } from 'react';
 import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import { ScreenReaderContent } from '@instructure/ui-a11y-content';
-import { TextInput } from '@instructure/ui-text-input';
-import { FormField, FormFieldGroup } from '@instructure/ui-form-field';
 import { jsx } from '@instructure/emotion';
 import { Heading } from '@instructure/ui-heading';
 import { RichContentInput, RCE_SINGLE_LINE_HEIGHT } from '@instructure/quiz-rce';
 import { toErrors } from "../../../../util/instUIMessages.js";
-import { SimpleSelect } from '@instructure/ui-simple-select';
 import { IconUpdownLine } from '@instructure/ui-icons';
 import { ToggleDetails } from '@instructure/ui-toggle-details';
-import { TOP, withStyleOverrides } from '@instructure/quiz-common';
+import { SimpleSelect, TextInput, TOP, withStyleOverrides, FormFieldGroup, FormField } from '@instructure/quiz-common';
 import t from '@instructure/quiz-i18n/es/format-message';
 import generateStyle from "./styles.js";
 import generateComponentTheme from "./theme.js";
@@ -112,6 +109,7 @@ export var StimulusEditInfo = (_dec = withStyleOverrides(generateStyle, generate
       }, jsx(TextInput, {
         messages: this.inputErrors('title'),
         renderLabel: t('Title'),
+        isRequired: true,
         type: "text",
         ref: this.props.setTitleRef,
         onChange: this.onTextInputChange('title'),
@@ -128,13 +126,12 @@ export var StimulusEditInfo = (_dec = withStyleOverrides(generateStyle, generate
       })), jsx("div", {
         css: this.props.styles.section
       }, jsx(FormField, {
-        id: stimulusBodyId,
-        label: t('Content')
+        id: stimulusBodyId
       }, jsx(RichContentInput, {
         actsAsInput: true,
-        label: "",
+        label: t('Content'),
+        isRequired: true,
         messages: this.inputErrors('body'),
-        placeholder: t('Add Stimulus Content...'),
         textareaId: textAreaId,
         defaultContent: stimulus.get('body'),
         onKeyUp: this.onBodyChange,

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

@@ -5,10 +5,9 @@ import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import debounce from 'lodash/fp/debounce';
-import { Select } from '@instructure/ui-select';
 import { Spinner } from '@instructure/ui-spinner';
 import t from '@instructure/quiz-i18n/es/format-message';
-import { SELECT_EMPTY_OPTION } from '@instructure/quiz-common';
+import { SELECT_EMPTY_OPTION, Select } from '@instructure/quiz-common';
 export var GenericAsyncSearch = /*#__PURE__*/function (_Component) {
   _inherits(GenericAsyncSearch, _Component);
   var _super = _createSuper(GenericAsyncSearch);

package/es/common/components/shared/TagSelect/presenter.js

@@ -5,11 +5,10 @@ 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 { Select } from '@instructure/ui-select';
 import TagWrapper from "../TagWrapper/index.js";
 import differenceBy from 'lodash/differenceBy';
 import t from '@instructure/quiz-i18n/es/format-message';
-import { SELECT_EMPTY_OPTION } from '@instructure/quiz-common';
+import { SELECT_EMPTY_OPTION, Select } from '@instructure/quiz-common';
 var tagShape = PropTypes.shape({
   id: PropTypes.string,
   value: PropTypes.string.isRequired

package/es/common/components/shared/TimeUnitsInput/index.js

@@ -138,7 +138,8 @@ export var TimeUnitsInput = /*#__PURE__*/function (_Component) {
         newHours = _breakdownSeconds4.hours,
         newMinutes = _breakdownSeconds4.minutes;
       if (_this.state.shouldResetOnNormalize) {
-        _this.props.onReset();
+        var _this$props$onReset, _this$props;
+        (_this$props$onReset = (_this$props = _this.props).onReset) === null || _this$props$onReset === void 0 ? void 0 : _this$props$onReset.call(_this$props);
       }
       _this.setState({
         days: newDays,

package/es/common/records/Stimulus.js

@@ -71,6 +71,7 @@ export var Stimulus = /*#__PURE__*/function (_ReduxRecord) {
   body: '',
   sourceUrl: '',
   status: 'mutable',
-  orientation: 'left'
+  orientation: 'left',
+  passage: false
 }));
 export default Stimulus;

package/es/index.js

@@ -79,7 +79,9 @@ export { Provider } from "./common/react-redux.js";
 export { FormattedTimer } from "./common/components/shared/FormattedDuration/index.js";
 export { default as TagWrapper } from "./common/components/shared/TagWrapper/index.js";
 export { RetryGradePassbackButton } from "./moderating/components/resources/RetryGradePassbackButton/index.js";
-export { GenericAsyncSearch } from "./common/components/shared/GenericAsyncSearch/GenericAsyncSearch.js"; // Utilities
+export { GenericAsyncSearch } from "./common/components/shared/GenericAsyncSearch/GenericAsyncSearch.js";
+export { MaskedTextInput } from "./common/components/MaskedTextInput/index.js";
+export { AccessCodeTextInput } from "./common/components/AccessCodeTextInput/index.js"; // Utilities
 export { environment as config } from "./config.js";
 export { Fetcher } from "./common/util/Fetcher.js";
 export { httpHeaders } from "./common/util/httpHeaders.js";

package/es/moderating/components/resources/AccommodationsModal/ExtraTimeSettings/index.js

@@ -6,7 +6,7 @@ import _createSuper from "@babel/runtime/helpers/esm/createSuper";
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { View } from '@instructure/ui-view';
-import { SimpleSelect } from '@instructure/ui-simple-select';
+import { SimpleSelect } from '@instructure/quiz-common';
 import TimeUnitsInput from "../../../../../common/components/shared/TimeUnitsInput/index.js";
 import ExtraTimeMultiplier from "../ExtraTimeMultiplier/index.js";
 import { HOUR_IN_SECONDS } from "../../../../../common/components/shared/FormattedDuration/index.js";
@@ -94,7 +94,7 @@ export var ExtraTimeSettings = /*#__PURE__*/function (_Component) {
         minutesLabel: t('Minutes'),
         minutesDataAutomation: "sdk-moderation-time-minutes",
         description: t('Additional time'),
-        margin: "medium none"
+        margin: "medium none none none"
       }), timeAdjustmentType === 'timerMultiplierEnabled' && /*#__PURE__*/React.createElement(ExtraTimeMultiplier, {
         onChange: this.onChangeMultiplier,
         timerMultiplierValue: timerSettings.timerMultiplierValue,

package/es/moderating/components/resources/AccommodationsModal/index.js

@@ -4,7 +4,6 @@ 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 { Text } from '@instructure/ui-text';
 import { Tooltip } from '@instructure/ui-tooltip';
 import { Modal } from '@instructure/ui-modal';
 import { TruncateText } from '@instructure/ui-truncate-text';
@@ -13,8 +12,6 @@ import { View } from '@instructure/ui-view';
 import { Button, CloseButton } from '@instructure/ui-buttons';
 import t from '@instructure/quiz-i18n/es/format-message';
 import { ScreenReaderContent } from '@instructure/ui-a11y-content';
-import { featureOn } from "../../../../common/util/featureCheck.js";
-import { IfFeature } from "../../../../common/components/shared/IfFeature/index.js";
 export var AccommodationModal = /*#__PURE__*/function (_Component) {
   _inherits(AccommodationModal, _Component);
   var _super = _createSuper(AccommodationModal);
@@ -57,7 +54,7 @@ export var AccommodationModal = /*#__PURE__*/function (_Component) {
       }, _this.props.studentName));
     };
     _this.renderHeading = function () {
-      if (featureOn('atteq_apply_changes_to_current_quiz_attempts')) {
+      if (_this.props.atteqApplyChangesToCurrentQuizAttemptsEnabled) {
         return /*#__PURE__*/React.createElement(Heading, null, /*#__PURE__*/React.createElement(ScreenReaderContent, null, t('Student Accommodation')), t('Student Accommodation'));
       }
       var _this$props = _this.props,
@@ -84,7 +81,7 @@ export var AccommodationModal = /*#__PURE__*/function (_Component) {
   _createClass(AccommodationModal, [{
     key: "labelText",
     value: function labelText() {
-      if (featureOn('atteq_apply_changes_to_current_quiz_attempts')) {
+      if (this.props.atteqApplyChangesToCurrentQuizAttemptsEnabled) {
         return t('Student Accommodation');
       }
       return this.props.studentName || t('Accommodations Modal');
@@ -93,7 +90,6 @@ export var AccommodationModal = /*#__PURE__*/function (_Component) {
     key: "render",
     value: function render() {
       var _this$props2 = this.props,
-        studentName = _this$props2.studentName,
         open = _this$props2.open,
         closeModal = _this$props2.closeModal,
         mountNode = _this$props2.mountNode,
@@ -109,12 +105,7 @@ export var AccommodationModal = /*#__PURE__*/function (_Component) {
         placement: "end",
         offset: "medium",
         screenReaderLabel: t('Close')
-      }), this.renderHeading()), /*#__PURE__*/React.createElement(Modal.Body, null, /*#__PURE__*/React.createElement(IfFeature, {
-        name: "atteq_apply_changes_to_current_quiz_attempts"
-      }, /*#__PURE__*/React.createElement(Text, {
-        weight: "bold",
-        as: "h2"
-      }, studentName)), children), /*#__PURE__*/React.createElement(Modal.Footer, null, /*#__PURE__*/React.createElement(Button, {
+      }), this.renderHeading()), /*#__PURE__*/React.createElement(Modal.Body, null, children), /*#__PURE__*/React.createElement(Modal.Footer, null, /*#__PURE__*/React.createElement(Button, {
         onClick: this.cancelAction,
         margin: "xxx-small",
         "data-automation": "sdk-moderation-cancel"
@@ -137,7 +128,8 @@ AccommodationModal.propTypes = {
   onDismiss: PropTypes.func,
   mountNode: PropTypes.string,
   // this is just to fix chromatic
-  children: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)])
+  children: PropTypes.oneOfType([PropTypes.node, PropTypes.arrayOf(PropTypes.node)]),
+  atteqApplyChangesToCurrentQuizAttemptsEnabled: PropTypes.bool.isRequired
 };
 AccommodationModal.defaultProps = {
   children: [],

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

@@ -325,7 +325,8 @@ export var ModerateTable = (_dec = withStyleOverrides(generateStyle, generateCom
         css: this.props.styles.page
       }, jsx(ModerateTray, {
         onClose: this.onCloseTray,
-        onSave: this.props.onSaveTray
+        onSave: this.props.onSaveTray,
+        atteqApplyChangesToCurrentQuizAttemptsEnabled: this.props.atteqApplyChangesToCurrentQuizAttemptsEnabled
       }, jsx(Flex.Item, null, !this.props.anonymousGrading && _ref6), this.props.children), this.renderContent());
     }
   }]);
@@ -380,7 +381,8 @@ export var ModerateTable = (_dec = withStyleOverrides(generateStyle, generateCom
   getQuizSessions: PropTypes.func.isRequired,
   addSuccess: PropTypes.func.isRequired,
   styles: PropTypes.object,
-  makeStyles: PropTypes.func
+  makeStyles: PropTypes.func,
+  atteqApplyChangesToCurrentQuizAttemptsEnabled: PropTypes.bool.isRequired
 }, _ModerateTable.defaultProps = {
   anonymousGrading: false,
   children: void 0,

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

@@ -8,6 +8,7 @@ import t from '@instructure/quiz-i18n/es/format-message';
 import { Flex } from '@instructure/ui-flex';
 import { View } from '@instructure/ui-view';
 import { Text } from '@instructure/ui-text';
+import { Heading } from '@instructure/ui-heading';
 import { Tooltip } from '@instructure/ui-tooltip';
 import { Tray } from '@instructure/ui-tray';
 import { Button, CloseButton } from '@instructure/ui-buttons';
@@ -15,7 +16,6 @@ import { TruncateText } from '@instructure/ui-truncate-text';
 import { Modal } from '@instructure/ui-modal';
 import { liveRegion } from '@instructure/quiz-common';
 import { ScreenReaderContent } from '@instructure/ui-a11y-content';
-import { featureOn } from "../../../../common/util/featureCheck.js";
 export var ModerateTray = /*#__PURE__*/function (_Component) {
   _inherits(ModerateTray, _Component);
   var _super = _createSuper(ModerateTray);
@@ -67,20 +67,15 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
       _this.props.closeTray();
     };
     _this.renderTitleAndCloseButton = function () {
-      return /*#__PURE__*/React.createElement(Flex, {
-        justifyItems: "space-between"
-      }, /*#__PURE__*/React.createElement(Flex.Item, {
-        shouldGrow: true,
-        shouldShrink: true
-      }, featureOn('atteq_apply_changes_to_current_quiz_attempts') ? /*#__PURE__*/React.createElement(Text, {
-        as: "h2",
-        size: "large",
-        weight: "bold"
-      }, t('In Progress Accommodation')) : _this.renderHeading()), /*#__PURE__*/React.createElement(Flex.Item, null, /*#__PURE__*/React.createElement(CloseButton, {
+      return /*#__PURE__*/React.createElement(Modal.Header, null, /*#__PURE__*/React.createElement(CloseButton, {
         onClick: _this.props.closeTray,
         elementRef: _this.setCloseRef,
+        placement: "end",
+        offset: "medium",
         screenReaderLabel: t('Close')
-      })));
+      }), _this.props.atteqApplyChangesToCurrentQuizAttemptsEnabled ? /*#__PURE__*/React.createElement(Heading, {
+        level: "h3"
+      }, /*#__PURE__*/React.createElement(ScreenReaderContent, null, t('In Progress Accommodation')), t('In Progress Accommodation')) : _this.renderHeading());
     };
     _this.renderChildren = function () {
       return React.Children.map(_this.props.children, function (child) {
@@ -128,12 +123,12 @@ export 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.createElement(View, {
+        React.createElement(Heading, {
           display: "block",
           borderRadius: "small",
           position: "relative",
           withFocusOutline: this.state.titleIsTruncated && focused,
-          as: "h2",
+          level: "h3",
           tabIndex: this.state.isTruncated ? 0 : null
         }, /*#__PURE__*/React.createElement(ScreenReaderContent, null, this.labelText()), /*#__PURE__*/React.createElement(TruncateText, {
           "aria-hidden": "true",
@@ -146,9 +141,6 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
   }, {
     key: "renderName",
     value: function renderName(renderProps) {
-      if (!featureOn('atteq_apply_changes_to_current_quiz_attempts')) {
-        return null;
-      }
       var focused = renderProps && renderProps.focused;
       return (
         /*#__PURE__*/
@@ -159,8 +151,7 @@ export 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.createElement(ScreenReaderContent, null, this.props.participantName), /*#__PURE__*/React.createElement(TruncateText, {
           "aria-hidden": "true",
           maxLines: 2,
@@ -175,9 +166,6 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
     key: "renderNameWithTooltip",
     value: function renderNameWithTooltip() {
       var _this3 = this;
-      if (!featureOn('atteq_apply_changes_to_current_quiz_attempts')) {
-        return null;
-      }
       return this.state.titleIsTruncated ? /*#__PURE__*/React.createElement(Tooltip, {
         placement: "start",
         renderTip: this.props.participantName,
@@ -192,7 +180,7 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
   }, {
     key: "labelText",
     value: function labelText() {
-      if (featureOn('atteq_apply_changes_to_current_quiz_attempts')) {
+      if (this.props.atteqApplyChangesToCurrentQuizAttemptsEnabled) {
         return t('In Progress Accommodation');
       }
       if (this.props.participantName) {
@@ -211,19 +199,21 @@ export var ModerateTray = /*#__PURE__*/function (_Component) {
         onExited: this.handleTrayExited,
         open: this.props.isOpen,
         placement: "end",
-        size: 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.createElement(Flex, {
         as: "div",
         direction: "column",
         height: "100vh"
-      }, /*#__PURE__*/React.createElement(Flex.Item, {
-        padding: "small medium"
-      }, this.renderTitleAndCloseButton()), /*#__PURE__*/React.createElement(Flex.Item, {
+      }, this.renderTitleAndCloseButton(), this.props.atteqApplyChangesToCurrentQuizAttemptsEnabled && /*#__PURE__*/React.createElement(Flex.Item, {
+        padding: "medium medium 0 medium"
+      }, this.renderNameWithTooltip()), /*#__PURE__*/React.createElement(Flex.Item, {
+        padding: "medium"
+      }, t('These settings apply to current and all future attempts.')), /*#__PURE__*/React.createElement(Flex.Item, {
         shouldGrow: true,
         padding: "0 medium"
-      }, this.renderNameWithTooltip(), this.renderChildren()), featureOn('add_time_to_existing_quiz_sessions') && /*#__PURE__*/React.createElement(Flex.Item, null, this.renderFooter())));
+      }, this.renderChildren()), this.props.atteqApplyChangesToCurrentQuizAttemptsEnabled && /*#__PURE__*/React.createElement(Flex.Item, null, this.renderFooter())));
     }
   }]);
   ModerateTray.displayName = "ModerateTray";
@@ -235,7 +225,8 @@ ModerateTray.propTypes = {
   isOpen: PropTypes.bool.isRequired,
   onClose: PropTypes.func,
   onSave: PropTypes.func.isRequired,
-  participantName: PropTypes.string
+  participantName: PropTypes.string,
+  atteqApplyChangesToCurrentQuizAttemptsEnabled: PropTypes.bool.isRequired
 };
 ModerateTray.defaultProps = {
   onClose: void 0,