@instructure/quiz-core 22.15.0 → 22.15.1

package/lib/banks/components/BankEntry/presenter.js

@@ -1,753 +1,977 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.BankEntry = void 0;
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = require("react");
-var _reactDom = _interopRequireDefault(require("react-dom"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _immutable = _interopRequireDefault(require("immutable"));
-var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));
-var _differenceWith = _interopRequireDefault(require("lodash/differenceWith"));
-var _intersectionWith = _interopRequireDefault(require("lodash/intersectionWith"));
-var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
-var _isUndefined = _interopRequireDefault(require("lodash/isUndefined"));
-var _keyBy = _interopRequireDefault(require("lodash/keyBy"));
-var _uiAlerts = require("@instructure/ui-alerts");
-var _uiBreadcrumb = require("@instructure/ui-breadcrumb");
-var _uiButtons = require("@instructure/ui-buttons");
-var _uiText = require("@instructure/ui-text");
-var _uiHeading = require("@instructure/ui-heading");
-var _uiIcons = require("@instructure/ui-icons");
-var _uiA11yContent = require("@instructure/ui-a11y-content");
-var _emotion = require("@instructure/emotion");
-var _HeaderBreadCrumb = require("../HeaderBreadCrumb");
-var _EntrySave = _interopRequireDefault(require("../../../common/components/resources/entry/EntrySave"));
-var _ItemEdit = _interopRequireDefault(require("../../../common/components/resources/item/ItemEdit"));
-var _ItemFeedbackModal = _interopRequireDefault(require("../../../building/components/resources/ItemFeedbackModal"));
-var _ItemShow = _interopRequireDefault(require("../../../common/components/resources/item/ItemShow"));
-var _Page = _interopRequireDefault(require("../../../common/components/layout/Page"));
-var _Spinner = _interopRequireDefault(require("../../../common/components/shared/spinner/Spinner"));
-var _StimulusEditInfo = _interopRequireDefault(require("../../../common/components/resources/stimulus/StimulusEditInfo"));
-var _StimulusShowInfo = _interopRequireDefault(require("../../../common/components/resources/stimulus/StimulusShowInfo"));
-var _TagSuggestSelect = _interopRequireDefault(require("../../../common/components/shared/TagSuggestSelect"));
-var _WarningWrapper = _interopRequireDefault(require("../../../common/components/resources/WarningWrapper"));
-var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/format-message"));
-var _items = require("../../../building/api/items");
-var _stimuli = require("../../../building/api/stimuli");
-var _warningHelpers = require("../../../common/util/warningHelpers");
-var _NavWrapper = _interopRequireDefault(require("../NavWrapper"));
-var _quizCommon = require("@instructure/quiz-common");
-var _styles = _interopRequireDefault(require("./styles"));
-var _theme = _interopRequireDefault(require("./theme"));
-var _dec, _class, _BankEntry;
-/** @jsx jsx */
-function _callSuper(_this, derived, args) {
-  function isNativeReflectConstruct() {
-    if (typeof Reflect === "undefined" || !Reflect.construct) return false;
-    if (Reflect.construct.sham) return false;
-    if (typeof Proxy === "function") return true;
-    try {
-      return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
-    } catch (e) {
-      return false;
+/** @jsx jsx */ function _assert_this_initialized(self) {
+    if (self === void 0) {
+        throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
     }
-  }
-  derived = (0, _getPrototypeOf2["default"])(derived);
-  return (0, _possibleConstructorReturn2["default"])(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], (0, _getPrototypeOf2["default"])(_this).constructor) : derived.apply(_this, args));
+    return self;
 }
-var BankEntry = exports.BankEntry = (_dec = (0, _quizCommon.withStyleOverrides)(_styles["default"], _theme["default"]), _dec(_class = (_BankEntry = /*#__PURE__*/function (_Component) {
-  function BankEntry() {
-    var _this2;
-    (0, _classCallCheck2["default"])(this, BankEntry);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this2 = _callSuper(this, BankEntry, [].concat(args));
-    (0, _defineProperty2["default"])(_this2, "state", {
-      validationErrorsFromApi: {}
-    });
-    (0, _defineProperty2["default"])(_this2, "setNavToBankRef", function (node) {
-      _this2.navToBankRef = node;
-    });
-    (0, _defineProperty2["default"])(_this2, "navigateToBank", function () {
-      _this2.props.navigateToBank(_this2.props.bankId);
-    });
-    (0, _defineProperty2["default"])(_this2, "handleTitleChange", function (e) {
-      _this2.props.changeItemTitle(_this2.props.entry.id, e.target.value);
-    });
-    (0, _defineProperty2["default"])(_this2, "clearValidationErrorsFromApi", function (inputId) {
-      if (inputId === _quizCommon.CLEAR_ALL_INPUT_VALIDATION_ERRORS) {
-        _this2.setState({
-          validationErrorsFromApi: {}
-        });
-      }
-      if (_this2.state.validationErrorsFromApi[inputId]) {
-        var newErrors = Object.assign({}, _this2.state.validationErrorsFromApi);
-        delete newErrors[inputId];
-        _this2.setState({
-          validationErrorsFromApi: newErrors
-        });
-      }
-    });
-    (0, _defineProperty2["default"])(_this2, "submitHandler", /*#__PURE__*/(0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee() {
-      return _regenerator["default"].wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            _context.prev = 0;
-            if (!_this2.props.entry.isTemporary()) {
-              _context.next = 6;
-              break;
-            }
-            _context.next = 4;
-            return _this2.temporarySubmit();
-          case 4:
-            _context.next = 8;
-            break;
-          case 6:
-            _context.next = 8;
-            return _this2.normalSubmit();
-          case 8:
-            _context.next = 16;
-            break;
-          case 10:
-            _context.prev = 10;
-            _context.t0 = _context["catch"](0);
-            if (!_context.t0.validationErrorsFromApi) {
-              _context.next = 15;
-              break;
-            }
-            _this2.setState({
-              validationErrorsFromApi: _context.t0.validationErrorsFromApi
-            });
-            // Throwing an error here would cause an alert banner to show,
-            // which we don't want in the case of a simple input validation error
-            return _context.abrupt("return", _quizCommon.API_INPUT_VALIDATION_ERROR);
-          case 15:
-            throw _context.t0;
-          case 16:
-            _this2.navigateToBank();
-          case 17:
-          case "end":
-            return _context.stop();
-        }
-      }, _callee, null, [[0, 10]]);
-    })));
-    (0, _defineProperty2["default"])(_this2, "handleRef", function (node) {
-      _this2.itemEditArea = node;
-    });
-    (0, _defineProperty2["default"])(_this2, "clearChanges", function () {
-      _this2.clearValidationErrorsFromApi(_quizCommon.CLEAR_ALL_INPUT_VALIDATION_ERRORS);
-      if (!_this2.props.entry) return;
-      if (_this2.props.entry.isTemporary()) {
-        _this2.props.clearTemporaryBankItem(_this2.props.bankId);
-      }
-      _this2.props.clearModifications('items', _this2.props.entry.id);
-      _this2.props.setPendingDeletionTagAssociations(_this2.props.bankEntry.entryType, _this2.props.entry.id, []);
-      _this2.props.setPendingAdditionTagAssociations(_this2.props.bankEntry.entryType, _this2.props.entry.id, []);
-    });
-    (0, _defineProperty2["default"])(_this2, "handlePointsChange", function (points) {
-      _this2.props.changeQuizEntryPoints(_this2.props.entry.id, points);
-    });
-    (0, _defineProperty2["default"])(_this2, "editProps", function (entry) {
-      return {
-        cancelHandler: _this2.navigateToBank,
-        clearChanges: _this2.clearChanges,
-        clearValidationErrorsFromApi: _this2.clearValidationErrorsFromApi,
-        contextUuid: null,
-        entry: entry,
-        guid: "".concat(_this2.props.bankEntry.id, "_bank_entry_edit"),
-        handleQuizEntryPointsChange: _this2.handlePointsChange,
-        itemEditArea: _this2.itemEditArea,
-        parentId: _this2.props.bankId,
-        parentType: _quizCommon.PARENT_TYPE_BANK,
-        stimulus: entry,
-        submitHandler: _this2.submitHandler,
-        validationErrorsFromApi: _this2.state.validationErrorsFromApi,
-        scope: _this2.props.scope
-      };
-    });
-    (0, _defineProperty2["default"])(_this2, "openFeedbackModal", function () {
-      _this2.props.setUi(_quizCommon.ITEM_FEEDBACK_MODAL_ITEM, _this2.props.entry.getWorkingInstance());
-      _this2.props.setUi(_quizCommon.ITEM_FEEDBACK_MODAL_FEEDBACK, _this2.props.entry.getWorkingInstance().feedback);
-      _this2.props.openModal(_quizCommon.ITEM_FEEDBACK_MODAL, {
-        modalTrigger: _this2.addFeedbackButton
-      });
-    });
-    (0, _defineProperty2["default"])(_this2, "storeFeedbackButtonRef", function (button) {
-      _this2.addFeedbackButton = button;
-    });
-    (0, _defineProperty2["default"])(_this2, "compareTagValues", function (left, right) {
-      return left.tag_value === right.tag_value;
-    });
-    (0, _defineProperty2["default"])(_this2, "tagToAssociation", function (_ref2) {
-      var value = _ref2.value;
-      return {
-        tag_value: value
-      };
-    });
-    (0, _defineProperty2["default"])(_this2, "handleTagChange", function (tags) {
-      var bankEntry = _this2.props.bankEntry;
-      var tagAssociations = _this2.props.tagAssociations.toJS();
-      var associations = tags.map(_this2.tagToAssociation);
-      var removed = (0, _differenceWith["default"])(tagAssociations, associations, _this2.compareTagValues);
-      var created = (0, _differenceWith["default"])(associations, tagAssociations, _this2.compareTagValues);
-      // If a tag that was removed is being re-added,
-      // remove from both addAssociations and deletedTags
-      var restored = (0, _intersectionWith["default"])(created, removed, _this2.compareTagValues);
-      var addOperations = (0, _differenceWith["default"])(created, restored, _isEqual["default"]);
-      var deleteOperations = (0, _differenceWith["default"])(removed, restored, _this2.compareTagValues);
-      var bankEntryId = _this2.getBankEntryId(bankEntry);
-      _this2.props.setPendingDeletionTagAssociations(bankEntry.entryType, bankEntryId, deleteOperations);
-      _this2.props.setPendingAdditionTagAssociations(bankEntry.entryType, bankEntryId, addOperations);
-    });
-    return _this2;
-  }
-  (0, _inherits2["default"])(BankEntry, _Component);
-  return (0, _createClass2["default"])(BankEntry, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      if (!this.isTemporary()) {
-        this.props.getBankEntry(this.props.bankId, this.props.bankEntryId);
-      }
-      if (this.navToBankRef) {
-        _reactDom["default"].findDOMNode(this.navToBankRef).focus();
-      }
-      this.props.getBank(this.props.bankId);
-    }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      this.props.setShouldClone(false);
-    }
-  }, {
-    key: "UNSAFE_componentWillMount",
-    value: function UNSAFE_componentWillMount() {
-      this.props.setShouldClone(false);
-    }
-  }, {
-    key: "isTemporary",
-    value: function isTemporary() {
-      return this.props.entry && this.props.entry.isTemporary();
-    }
-  }, {
-    key: "getBankEntryTypeSlug",
-    value: function getBankEntryTypeSlug() {
-      return this.props.bankEntry.entryType;
-    }
-  }, {
-    key: "getEntry",
-    value: function getEntry() {
-      return this.props.entry;
-    }
-  }, {
-    key: "isItemEntry",
-    value: function isItemEntry() {
-      return this.props.bankEntry.entryType === 'Item';
-    }
-  }, {
-    key: "isStimulusEntry",
-    value: function isStimulusEntry() {
-      var _this$props$bankEntry;
-      return (_this$props$bankEntry = this.props.bankEntry) === null || _this$props$bankEntry === void 0 ? void 0 : _this$props$bankEntry.isStimulusEntry;
-    }
-  }, {
-    key: "isPassageEntry",
-    value: function isPassageEntry() {
-      var _this$props$bankEntry2;
-      return (_this$props$bankEntry2 = this.props.bankEntry) === null || _this$props$bankEntry2 === void 0 ? void 0 : _this$props$bankEntry2.isPassageEntry;
-    }
-  }, {
-    key: "getEditWarning",
-    value: function getEditWarning() {
-      if (this.isStimulusEntry()) {
-        return (0, _formatMessage["default"])('Edits made here will appear on any assessment using this stimulus.');
-      }
-      if (this.isPassageEntry()) {
-        return (0, _formatMessage["default"])('Edits made here will appear on any assessment using this text block.');
-      }
-      return (0, _formatMessage["default"])('Edits made here will appear on any assessment using this question.');
-    }
-  }, {
-    key: "entryLinkName",
-    value: function entryLinkName() {
-      var translations = {
-        "new": {
-          question: (0, _formatMessage["default"])('New Question'),
-          stimulus: (0, _formatMessage["default"])('New Stimulus'),
-          passage: (0, _formatMessage["default"])('New Text Block')
-        },
-        edit: {
-          question: (0, _formatMessage["default"])('Edit Question'),
-          stimulus: (0, _formatMessage["default"])('Edit Stimulus'),
-          passage: (0, _formatMessage["default"])('Edit Text Block')
-        }
-      };
-      var operation = this.isTemporary() ? 'new' : 'edit';
-      switch (true) {
-        case this.isItemEntry():
-          return translations[operation]['question'];
-        case this.isStimulusEntry():
-          return translations[operation]['stimulus'];
-        case this.isPassageEntry():
-          return translations[operation]['passage'];
-      }
-    }
-  }, {
-    key: "renderBankBreadCrumbLink",
-    value: function renderBankBreadCrumbLink() {
-      return (0, _emotion.jsx)(_uiBreadcrumb.BreadcrumbLink, {
-        key: "bank",
-        onClick: this.navigateToBank,
-        ref: this.setNavToBankRef
-      }, this.props.bank.title);
-    }
-  }, {
-    key: "renderBankEntryBreadCrumbLink",
-    value: function renderBankEntryBreadCrumbLink() {
-      return (0, _emotion.jsx)(_uiBreadcrumb.BreadcrumbLink, {
-        key: "bankEntry"
-      }, this.entryLinkName());
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) {
+    try {
+        var info = gen[key](arg);
+        var value = info.value;
+    } catch (error) {
+        reject(error);
+        return;
     }
-  }, {
-    key: "renderNav",
-    value: function renderNav() {
-      var _this$props = this.props,
-        scope = _this$props.scope,
-        closeTray = _this$props.closeTray,
-        navigateToBanks = _this$props.navigateToBanks,
-        navigateToBuild = _this$props.navigateToBuild,
-        returnToUrl = _this$props.returnToUrl;
-      var isScopeEmpty = !Object.keys(scope).length;
-      return (0, _emotion.jsx)(_NavWrapper["default"], {
-        closeTray: closeTray,
-        navigateToBanks: navigateToBanks,
-        navigateToBuild: navigateToBuild,
-        returnToUrl: isScopeEmpty ? null : returnToUrl,
-        scope: scope,
-        isCompact: this.props.isCompact,
-        iceTopNavBarEnabled: this.props.iceTopNavBarEnabled,
-        menuItemPath: "/banks/".concat(this.props.bankId, "/bank_entries/").concat(this.props.bankEntryId || 'new')
-      }, this.renderBankBreadCrumbLink(), this.renderBankEntryBreadCrumbLink());
+    if (info.done) {
+        resolve(value);
+    } else {
+        Promise.resolve(value).then(_next, _throw);
     }
-  }, {
-    key: "renderTitle",
-    value: function renderTitle(entry) {
-      if (this.isItemEntry()) {
-        return (0, _emotion.jsx)(_quizCommon.TextInput, {
-          renderLabel: (0, _emotion.jsx)(_uiA11yContent.ScreenReaderContent, null, (0, _formatMessage["default"])('Edit question title')),
-          type: "text",
-          placeholder: (0, _formatMessage["default"])('Question Title'),
-          onChange: this.handleTitleChange,
-          value: entry.getWorkingInstance().title || ''
+}
+function _async_to_generator(fn) {
+    return function() {
+        var self = this, args = arguments;
+        return new Promise(function(resolve, reject) {
+            var gen = fn.apply(self, args);
+            function _next(value) {
+                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value);
+            }
+            function _throw(err) {
+                asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err);
+            }
+            _next(undefined);
         });
-      }
-    }
-  }, {
-    key: "getIdentifier",
-    value: function getIdentifier(entry) {
-      if (!entry) return;
-      switch (true) {
-        case this.isItemEntry():
-          return (0, _formatMessage["default"])('Question { id }', {
-            id: entry.id
-          });
-        case this.isStimulusEntry():
-          return (0, _formatMessage["default"])('Stimulus { id }', {
-            id: entry.id
-          });
-        case this.isPassageEntry():
-          return (0, _formatMessage["default"])('Text Block { id }', {
-            id: entry.id
-          });
-        default:
-          return;
-      }
-    }
-  }, {
-    key: "getTemporaryIdentifier",
-    value: function getTemporaryIdentifier() {
-      switch (true) {
-        case this.isItemEntry():
-          return (0, _formatMessage["default"])('New Question');
-        case this.isStimulusEntry():
-          return (0, _formatMessage["default"])('New Stimulus');
-        case this.isPassageEntry():
-          return (0, _formatMessage["default"])('New Text Block');
-        default:
-          return;
-      }
-    }
-  }, {
-    key: "getEntryName",
-    value: function getEntryName(entry) {
-      var _entry$getInteraction;
-      if (!entry) return;
-      switch (true) {
-        case this.isItemEntry():
-          return (_entry$getInteraction = entry.getInteractionType()) === null || _entry$getInteraction === void 0 ? void 0 : _entry$getInteraction.name;
-        case this.isStimulusEntry():
-          return (0, _formatMessage["default"])('Stimulus');
-        case this.isPassageEntry():
-          return (0, _formatMessage["default"])('Text Block');
-        default:
-          return;
-      }
-    }
-  }, {
-    key: "renderHeader",
-    value: function renderHeader(entry) {
-      if (!entry) return;
-      var props = this.editProps(entry);
-      var identifier = this.getIdentifier(entry);
-      var tempIdentifier = this.getTemporaryIdentifier();
-      var itemIdentifier = this.isTemporary() ? tempIdentifier : identifier;
-      var entryName = this.getEntryName(entry);
-      return (0, _emotion.jsx)("div", {
-        css: this.props.styles.header
-      }, (0, _emotion.jsx)("div", {
-        css: this.props.styles.leftHeader
-      }, (0, _emotion.jsx)("div", {
-        css: this.props.styles.headerText
-      }, (0, _emotion.jsx)(_uiHeading.Heading, {
-        level: "reset",
-        as: "h2"
-      }, (0, _formatMessage["default"])('{entryName} | {itemIdentifier}', {
-        entryName: entryName,
-        itemIdentifier: itemIdentifier
-      })))), this.renderTitle(entry), (0, _emotion.jsx)("div", {
-        css: this.props.styles.rightHeader
-      }, (0, _emotion.jsx)(_EntrySave["default"], props)));
+    };
+}
+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");
     }
-  }, {
-    key: "hasPendingTagModifications",
-    value: function hasPendingTagModifications() {
-      return !this.props.pendingDeletionTags.isEmpty() || !this.props.pendingAdditionTags.isEmpty();
+}
+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);
     }
-  }, {
-    key: "createTagsForClone",
-    value: function createTagsForClone(newBankEntry, tags) {
-      this.props.createTagAssociations(newBankEntry.id, newBankEntry.entry_type, newBankEntry.entry.id, tags.map(function (tag) {
-        return tag.tag_value;
-      }));
-      // Pending tag associations were applied to the original bank entry, so clear those out
-      this.props.setPendingAdditionTagAssociations(this.props.bankEntry.entryType, this.props.entry.id, []);
-      this.props.setPendingDeletionTagAssociations(this.props.bankEntry.entryType, this.props.entry.id, []);
+}
+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;
     }
-  }, {
-    key: "updateTagsForEntry",
-    value: function () {
-      var _updateTagsForEntry = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee2() {
-        return _regenerator["default"].wrap(function _callee2$(_context2) {
-          while (1) switch (_context2.prev = _context2.next) {
-            case 0:
-              if (this.props.shouldClone) {
-                _context2.next = 5;
-                break;
-              }
-              _context2.next = 3;
-              return this.props.createTagAssociations(this.props.bankEntryId, this.props.bankEntry.entryType, this.getBankEntryId(this.props.bankEntry), this.props.pendingAdditionTags.map(function (tagToAdd) {
-                return tagToAdd.get('tag_value');
-              }));
-            case 3:
-              _context2.next = 5;
-              return this.props.deleteTagAssociations(this.props.bankEntryId, this.props.bankEntry.entryType, this.getBankEntryId(this.props.bankEntry), this.props.pendingDeletionTags.map(function (tagToDelete) {
-                return tagToDelete.get('id');
-              }));
-            case 5:
-            case "end":
-              return _context2.stop();
-          }
-        }, _callee2, this);
-      }));
-      function updateTagsForEntry() {
-        return _updateTagsForEntry.apply(this, arguments);
-      }
-      return updateTagsForEntry;
-    }()
-  }, {
-    key: "normalSubmit",
-    value: function () {
-      var _normalSubmit = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee3() {
-        var entry, tags, createEntryCb, newBankEntry, workingEntry, updateFunc, toClear;
-        return _regenerator["default"].wrap(function _callee3$(_context3) {
-          while (1) switch (_context3.prev = _context3.next) {
-            case 0:
-              entry = this.props.entry;
-              if (!(entry.hasModifications() || this.props.shouldClone && this.hasPendingTagModifications())) {
-                _context3.next = 17;
-                break;
-              }
-              if (!this.props.shouldClone) {
-                _context3.next = 11;
-                break;
-              }
-              tags = this.visibleTagAssociations();
-              createEntryCb = this.isItemEntry() ? _items.createItem : _stimuli.createStimulus;
-              _context3.next = 7;
-              return this.props.cloneBankEntry(this.props.bankEntry, createEntryCb);
-            case 7:
-              newBankEntry = _context3.sent;
-              this.createTagsForClone(newBankEntry, tags);
-              _context3.next = 15;
-              break;
-            case 11:
-              workingEntry = entry.getWorkingInstance();
-              updateFunc = this.isItemEntry() ? this.props.updateItem : this.props.updateStimulus;
-              _context3.next = 15;
-              return updateFunc(workingEntry, this.props.bankId, 'bank');
-            case 15:
-              toClear = this.isItemEntry() ? 'items' : 'stimuli';
-              this.props.clearModifications(toClear, entry.id);
-            case 17:
-              if (!this.hasPendingTagModifications()) {
-                _context3.next = 20;
-                break;
-              }
-              _context3.next = 20;
-              return this.updateTagsForEntry();
-            case 20:
-            case "end":
-              return _context3.stop();
-          }
-        }, _callee3, this);
-      }));
-      function normalSubmit() {
-        return _normalSubmit.apply(this, arguments);
-      }
-      return normalSubmit;
-    }()
-  }, {
-    key: "temporarySubmit",
-    value: function () {
-      var _temporarySubmit = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee4() {
-        var entry, workingEntry, workingBankEntry, createEntryCb, newBankEntry, toClear;
-        return _regenerator["default"].wrap(function _callee4$(_context4) {
-          while (1) switch (_context4.prev = _context4.next) {
-            case 0:
-              entry = this.props.entry;
-              workingEntry = entry.getWorkingInstance();
-              workingBankEntry = this.props.bankEntry.getWorkingInstance();
-              createEntryCb = this.isItemEntry() ? _items.createItem : _stimuli.createStimulus;
-              _context4.next = 6;
-              return this.props.createEntryAndBankEntry(this.props.bankId, workingEntry, workingBankEntry, createEntryCb);
-            case 6:
-              newBankEntry = _context4.sent;
-              if (this.hasPendingTagModifications()) {
-                this.props.createTagAssociations(newBankEntry.id, newBankEntry.entry_type, newBankEntry.entry.id, this.props.pendingAdditionTags.map(function (tagToAdd) {
-                  return tagToAdd.get('tag_value');
-                }));
-              }
-              toClear = this.isItemEntry() ? 'items' : 'stimuli';
-              this.props.clearModifications(toClear, entry.id);
-              this.props.clearTemporaryBankItem(this.props.bankId);
-            case 11:
-            case "end":
-              return _context4.stop();
-          }
-        }, _callee4, this);
-      }));
-      function temporarySubmit() {
-        return _temporarySubmit.apply(this, arguments);
-      }
-      return temporarySubmit;
-    }()
-  }, {
-    key: "renderFeedbackSection",
-    value: function renderFeedbackSection() {
-      if (!this.isItemEntry()) {
-        return;
-      }
-      var shouldClone = this.props.shouldClone;
-      var disabled = this.props.entry.isImmutable() && !shouldClone;
-      var icon, text;
-      if (this.props.entry.getWorkingInstance().hasFeedback()) {
-        icon = _uiIcons.IconDiscussionSolid;
-        text = (0, _formatMessage["default"])('Edit Question Level Feedback (present)');
-      } else {
-        icon = _uiIcons.IconDiscussionLine;
-        text = (0, _formatMessage["default"])('Edit Question Level Feedback');
-      }
-      return (0, _emotion.jsx)(_uiButtons.IconButton, {
-        onClick: this.openFeedbackModal,
-        withBackground: false,
-        withBorder: false,
-        disabled: disabled,
-        ref: this.storeFeedbackButtonRef,
-        renderIcon: icon,
-        screenReaderLabel: text
-      });
+    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");
     }
-  }, {
-    key: "getBankEntryId",
-    value: function getBankEntryId(bankEntry) {
-      // bankEntry.entry can be either 'TEMPORARY_ITEM' or an entire Map
-      return bankEntry.entry ? bankEntry.entry.get ? bankEntry.entry.get('id') : bankEntry.entry : null;
+    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;
     }
-  }, {
-    key: "visibleTagAssociations",
-    value: function visibleTagAssociations() {
-      var _this$props2 = this.props,
-        pendingAdditionTags = _this$props2.pendingAdditionTags,
-        pendingDeletionTags = _this$props2.pendingDeletionTags,
-        tagAssociations = _this$props2.tagAssociations;
-      var existingValues = (0, _keyBy["default"])(tagAssociations.toJS(), function (t) {
-        return t.tag_value;
-      });
-      var noDuplicates = pendingAdditionTags.filter(function (t) {
-        return (0, _isUndefined["default"])(existingValues[t.get('tag_value')]);
-      });
-      return tagAssociations.filter(function (tag) {
-        return !pendingDeletionTags.includes(tag);
-      }).concat(noDuplicates).toJS();
+    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;
+}
+function _ts_generator(thisArg, body) {
+    var f, y, t, _ = {
+        label: 0,
+        sent: function() {
+            if (t[0] & 1) throw t[1];
+            return t[1];
+        },
+        trys: [],
+        ops: []
+    }, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
+    return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() {
+        return this;
+    }), g;
+    function verb(n) {
+        return function(v) {
+            return step([
+                n,
+                v
+            ]);
+        };
     }
-  }, {
-    key: "visibleTags",
-    value: function visibleTags() {
-      return this.visibleTagAssociations().map(function (a) {
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while(g && (g = 0, op[0] && (_ = 0)), _)try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [
+                op[0] & 2,
+                t.value
+            ];
+            switch(op[0]){
+                case 0:
+                case 1:
+                    t = op;
+                    break;
+                case 4:
+                    _.label++;
+                    return {
+                        value: op[1],
+                        done: false
+                    };
+                case 5:
+                    _.label++;
+                    y = op[1];
+                    op = [
+                        0
+                    ];
+                    continue;
+                case 7:
+                    op = _.ops.pop();
+                    _.trys.pop();
+                    continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) {
+                        _ = 0;
+                        continue;
+                    }
+                    if (op[0] === 3 && (!t || op[1] > t[0] && op[1] < t[3])) {
+                        _.label = op[1];
+                        break;
+                    }
+                    if (op[0] === 6 && _.label < t[1]) {
+                        _.label = t[1];
+                        t = op;
+                        break;
+                    }
+                    if (t && _.label < t[2]) {
+                        _.label = t[2];
+                        _.ops.push(op);
+                        break;
+                    }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop();
+                    continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) {
+            op = [
+                6,
+                e
+            ];
+            y = 0;
+        } finally{
+            f = t = 0;
+        }
+        if (op[0] & 5) throw op[1];
         return {
-          id: a.tag_id,
-          value: a.tag_value
+            value: op[0] ? op[1] : void 0,
+            done: true
         };
-      });
     }
-  }, {
-    key: "renderEntry",
-    value: function renderEntry(entry) {
-      var _this3 = this;
-      if (!entry) return;
-      var _this$props3 = this.props,
-        bankEntry = _this$props3.bankEntry,
-        useBankTags = _this$props3.useBankTags;
-      var props = this.editProps(entry);
-      var propsFunc = this.isItemEntry() ? _warningHelpers.propsForItemVersioningWrapper : _warningHelpers.propsForStimulusVersioningWrapper;
-      var versioningProps = propsFunc(entry.isImmutable(), this.props.shouldClone, this.props.setShouldClone, this.navigateToBank, true, 'warning', this.isPassageEntry());
-      var canEdit = !entry.isImmutable() || this.props.shouldClone;
-      var ItemComponent = canEdit ? _ItemEdit["default"] : _ItemShow["default"];
-      var StimulusComponent = canEdit ? _StimulusEditInfo["default"] : _StimulusShowInfo["default"];
-      var EntryComponent = this.isItemEntry() ? ItemComponent : StimulusComponent;
-      var entryType = bankEntry.entryType;
-      var entryId = this.getBankEntryId(bankEntry);
-      var tags = function tags() {
-        return (0, _emotion.jsx)(_TagSuggestSelect["default"], {
-          allowNewTags: true,
-          noMatchText: (0, _formatMessage["default"])('Enter a tag to find or create'),
-          parentType: entryType,
-          parentId: entryId,
-          onChange: _this3.handleTagChange,
-          tags: _this3.visibleTags()
+}
+import { Component } from 'react';
+import ReactDOM from 'react-dom';
+import PropTypes from 'prop-types';
+import Immutable from 'immutable';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import differenceWith from 'lodash/differenceWith';
+import intersectionWith from 'lodash/intersectionWith';
+import isEqual from 'lodash/isEqual';
+import isUndefined from 'lodash/isUndefined';
+import keyBy from 'lodash/keyBy';
+import { Alert } from '@instructure/ui-alerts';
+import { BreadcrumbLink } from '@instructure/ui-breadcrumb';
+import { IconButton } from '@instructure/ui-buttons';
+import { Text } from '@instructure/ui-text';
+import { Heading } from '@instructure/ui-heading';
+import { IconDiscussionLine, IconDiscussionSolid } from '@instructure/ui-icons';
+import { ScreenReaderContent } from '@instructure/ui-a11y-content';
+import { jsx } from '@instructure/emotion';
+import { HeaderBreadCrumb } from '../HeaderBreadCrumb';
+import EntrySave from '../../../common/components/resources/entry/EntrySave';
+import ItemEdit from '../../../common/components/resources/item/ItemEdit';
+import ItemFeedbackModal from '../../../building/components/resources/ItemFeedbackModal';
+import ItemShow from '../../../common/components/resources/item/ItemShow';
+import Page from '../../../common/components/layout/Page';
+import Spinner from '../../../common/components/shared/spinner/Spinner';
+import StimulusEditInfo from '../../../common/components/resources/stimulus/StimulusEditInfo';
+import StimulusShowInfo from '../../../common/components/resources/stimulus/StimulusShowInfo';
+import TagSuggestSelect from '../../../common/components/shared/TagSuggestSelect';
+import WarningWrapper from '../../../common/components/resources/WarningWrapper';
+import t from '@instructure/quiz-i18n/format-message';
+import { createItem } from '../../../building/api/items';
+import { createStimulus } from '../../../building/api/stimuli';
+import { propsForItemVersioningWrapper, propsForStimulusVersioningWrapper } from '../../../common/util/warningHelpers';
+import NavWrapper from '../NavWrapper';
+import { API_INPUT_VALIDATION_ERROR, CLEAR_ALL_INPUT_VALIDATION_ERRORS, ITEM_FEEDBACK_MODAL, ITEM_FEEDBACK_MODAL_ITEM, ITEM_FEEDBACK_MODAL_FEEDBACK, PARENT_TYPE_BANK, TextInput, withStyleOverrides } from '@instructure/quiz-common';
+import generateStyle from './styles';
+import generateComponentTheme from './theme';
+export var BankEntry = /*#__PURE__*/ function(Component) {
+    "use strict";
+    _inherits(BankEntry, Component);
+    function BankEntry() {
+        _class_call_check(this, BankEntry);
+        var _this;
+        var _this1;
+        _this = _call_super(this, BankEntry, arguments), _this1 = _this, _define_property(_this1, "state", {
+            validationErrorsFromApi: {}
+        }), _define_property(_this1, "setNavToBankRef", function(node) {
+            _this1.navToBankRef = node;
+        }), _define_property(_this1, "navigateToBank", function() {
+            _this1.props.navigateToBank(_this1.props.bankId);
+        }), _define_property(_this1, "handleTitleChange", function(e) {
+            _this1.props.changeItemTitle(_this1.props.entry.id, e.target.value);
+        }), _define_property(_this1, "clearValidationErrorsFromApi", function(inputId) {
+            if (inputId === CLEAR_ALL_INPUT_VALIDATION_ERRORS) {
+                _this1.setState({
+                    validationErrorsFromApi: {}
+                });
+            }
+            if (_this1.state.validationErrorsFromApi[inputId]) {
+                var newErrors = Object.assign({}, _this1.state.validationErrorsFromApi);
+                delete newErrors[inputId];
+                _this1.setState({
+                    validationErrorsFromApi: newErrors
+                });
+            }
+        }), _define_property(_this1, "submitHandler", function() {
+            return _async_to_generator(function() {
+                var e;
+                return _ts_generator(this, function(_state) {
+                    switch(_state.label){
+                        case 0:
+                            _state.trys.push([
+                                0,
+                                5,
+                                ,
+                                6
+                            ]);
+                            if (!_this1.props.entry.isTemporary()) return [
+                                3,
+                                2
+                            ];
+                            return [
+                                4,
+                                _this1.temporarySubmit()
+                            ];
+                        case 1:
+                            _state.sent();
+                            return [
+                                3,
+                                4
+                            ];
+                        case 2:
+                            return [
+                                4,
+                                _this1.normalSubmit()
+                            ];
+                        case 3:
+                            _state.sent();
+                            _state.label = 4;
+                        case 4:
+                            return [
+                                3,
+                                6
+                            ];
+                        case 5:
+                            e = _state.sent();
+                            if (e.validationErrorsFromApi) {
+                                _this1.setState({
+                                    validationErrorsFromApi: e.validationErrorsFromApi
+                                });
+                                // Throwing an error here would cause an alert banner to show,
+                                // which we don't want in the case of a simple input validation error
+                                return [
+                                    2,
+                                    API_INPUT_VALIDATION_ERROR
+                                ];
+                            }
+                            throw e;
+                        case 6:
+                            _this1.navigateToBank();
+                            return [
+                                2
+                            ];
+                    }
+                });
+            })();
+        }), _define_property(_this1, "handleRef", function(node) {
+            _this1.itemEditArea = node;
+        }), _define_property(_this1, "clearChanges", function() {
+            _this1.clearValidationErrorsFromApi(CLEAR_ALL_INPUT_VALIDATION_ERRORS);
+            if (!_this1.props.entry) return;
+            if (_this1.props.entry.isTemporary()) {
+                _this1.props.clearTemporaryBankItem(_this1.props.bankId);
+            }
+            _this1.props.clearModifications('items', _this1.props.entry.id);
+            _this1.props.setPendingDeletionTagAssociations(_this1.props.bankEntry.entryType, _this1.props.entry.id, []);
+            _this1.props.setPendingAdditionTagAssociations(_this1.props.bankEntry.entryType, _this1.props.entry.id, []);
+        }), _define_property(_this1, "handlePointsChange", function(points) {
+            _this1.props.changeQuizEntryPoints(_this1.props.entry.id, points);
+        }), _define_property(_this1, "editProps", function(entry) {
+            return {
+                cancelHandler: _this1.navigateToBank,
+                clearChanges: _this1.clearChanges,
+                clearValidationErrorsFromApi: _this1.clearValidationErrorsFromApi,
+                contextUuid: null,
+                entry: entry,
+                guid: "".concat(_this1.props.bankEntry.id, "_bank_entry_edit"),
+                handleQuizEntryPointsChange: _this1.handlePointsChange,
+                itemEditArea: _this1.itemEditArea,
+                parentId: _this1.props.bankId,
+                parentType: PARENT_TYPE_BANK,
+                stimulus: entry,
+                submitHandler: _this1.submitHandler,
+                validationErrorsFromApi: _this1.state.validationErrorsFromApi,
+                scope: _this1.props.scope
+            };
+        }), _define_property(_this1, "openFeedbackModal", function() {
+            _this1.props.setUi(ITEM_FEEDBACK_MODAL_ITEM, _this1.props.entry.getWorkingInstance());
+            _this1.props.setUi(ITEM_FEEDBACK_MODAL_FEEDBACK, _this1.props.entry.getWorkingInstance().feedback);
+            _this1.props.openModal(ITEM_FEEDBACK_MODAL, {
+                modalTrigger: _this1.addFeedbackButton
+            });
+        }), _define_property(_this1, "storeFeedbackButtonRef", function(button) {
+            _this1.addFeedbackButton = button;
+        }), _define_property(_this1, "compareTagValues", function(left, right) {
+            return left.tag_value === right.tag_value;
+        }), _define_property(_this1, "tagToAssociation", function(param) {
+            var value = param.value;
+            return {
+                tag_value: value
+            };
+        }), _define_property(_this1, "handleTagChange", function(tags) {
+            var bankEntry = _this1.props.bankEntry;
+            var tagAssociations = _this1.props.tagAssociations.toJS();
+            var associations = tags.map(_this1.tagToAssociation);
+            var removed = differenceWith(tagAssociations, associations, _this1.compareTagValues);
+            var created = differenceWith(associations, tagAssociations, _this1.compareTagValues);
+            // If a tag that was removed is being re-added,
+            // remove from both addAssociations and deletedTags
+            var restored = intersectionWith(created, removed, _this1.compareTagValues);
+            var addOperations = differenceWith(created, restored, isEqual);
+            var deleteOperations = differenceWith(removed, restored, _this1.compareTagValues);
+            var bankEntryId = _this1.getBankEntryId(bankEntry);
+            _this1.props.setPendingDeletionTagAssociations(bankEntry.entryType, bankEntryId, deleteOperations);
+            _this1.props.setPendingAdditionTagAssociations(bankEntry.entryType, bankEntryId, addOperations);
         });
-      };
-      var editWarning = this.getEditWarning();
-      return (0, _emotion.jsx)("div", null, (0, _emotion.jsx)("div", {
-        css: this.props.styles.entryEdit
-      }, (0, _emotion.jsx)(_WarningWrapper["default"], versioningProps, canEdit && (0, _emotion.jsx)(_uiAlerts.Alert, {
-        renderCloseButtonLabel: (0, _formatMessage["default"])('Dismiss'),
-        margin: "0 0 medium 0"
-      }, (0, _emotion.jsx)(_uiText.Text, {
-        color: "primary"
-      }, editWarning)), (0, _emotion.jsx)(EntryComponent, props), useBankTags && tags())), (0, _emotion.jsx)("div", {
-        css: this.props.styles.footer
-      }, (0, _emotion.jsx)("div", {
-        css: this.props.styles.leftFooter
-      }, this.renderFeedbackSection()), (0, _emotion.jsx)("div", {
-        css: this.props.styles.rightFooter
-      }, (0, _emotion.jsx)(_EntrySave["default"], props))));
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var entry = this.props.entry;
-      if (entry && !entry.isLoaded()) {
-        return (0, _emotion.jsx)(_Spinner["default"], null);
-      }
-      return (0, _emotion.jsx)(_Page["default"], null, this.renderNav(), (0, _emotion.jsx)("div", {
-        css: this.props.styles.content,
-        ref: this.handleRef
-      }, this.props.iceTopNavBarEnabled && (0, _emotion.jsx)("div", {
-        css: this.props.styles.breadcrumb
-      }, (0, _emotion.jsx)(_HeaderBreadCrumb.HeaderBreadCrumb, {
-        returnToUrl: this.props.returnToUrl,
-        scope: this.props.scope,
-        navigateToBanks: this.props.navigateToBanks,
-        navigateToBuild: this.props.navigateToBuild
-      }, this.renderBankBreadCrumbLink(), this.renderBankEntryBreadCrumbLink())), this.renderHeader(entry), this.renderEntry(entry), !this.props.isCompact && (0, _emotion.jsx)(_ItemFeedbackModal["default"], {
-        parentId: this.props.bankId,
-        parentType: _quizCommon.PARENT_TYPE_BANK
-      })));
+        return _this;
     }
-  }]);
-}(_react.Component), (0, _defineProperty2["default"])(_BankEntry, "displayName", 'BankEntry'), (0, _defineProperty2["default"])(_BankEntry, "componentId", "Quizzes".concat(_BankEntry.displayName)), (0, _defineProperty2["default"])(_BankEntry, "propTypes", {
-  bankEntryId: _propTypes["default"].string.isRequired,
-  bankId: _propTypes["default"].string.isRequired,
-  bank: _reactImmutableProptypes["default"].record.isRequired,
-  bankEntry: _reactImmutableProptypes["default"].record.isRequired,
-  entry: _reactImmutableProptypes["default"].record,
-  changeItemTitle: _propTypes["default"].func.isRequired,
-  changeQuizEntryPoints: _propTypes["default"].func.isRequired,
-  cloneBankEntry: _propTypes["default"].func.isRequired,
-  clearModifications: _propTypes["default"].func.isRequired,
-  clearTemporaryBankItem: _propTypes["default"].func.isRequired,
-  createEntryAndBankEntry: _propTypes["default"].func.isRequired,
-  closeTray: _propTypes["default"].func,
-  createTagAssociations: _propTypes["default"].func.isRequired,
-  deleteTagAssociations: _propTypes["default"].func.isRequired,
-  getBankEntry: _propTypes["default"].func.isRequired,
-  getBank: _propTypes["default"].func.isRequired,
-  isCompact: _propTypes["default"].bool,
-  navigateToBanks: _propTypes["default"].func.isRequired,
-  // can be from consumer
-  navigateToBank: _propTypes["default"].func.isRequired,
-  // can be from consumer
-  navigateToBuild: _propTypes["default"].func,
-  // from consumer
-  scope: _propTypes["default"].objectOf(_propTypes["default"].shape({
-    type: _propTypes["default"].string,
-    uuid: _propTypes["default"].string,
-    title: _propTypes["default"].string,
-    launch_context_uuid: _propTypes["default"].string,
-    root_account_name: _propTypes["default"].string
-  })),
-  returnToUrl: _propTypes["default"].string,
-  // from consumer
-  openModal: _propTypes["default"].func.isRequired,
-  pendingAdditionTags: _reactImmutableProptypes["default"].listOf(_reactImmutableProptypes["default"].map),
-  pendingDeletionTags: _reactImmutableProptypes["default"].listOf(_reactImmutableProptypes["default"].map),
-  setPendingAdditionTagAssociations: _propTypes["default"].func.isRequired,
-  setPendingDeletionTagAssociations: _propTypes["default"].func.isRequired,
-  setShouldClone: _propTypes["default"].func.isRequired,
-  setTagInput: _propTypes["default"].func.isRequired,
-  setUi: _propTypes["default"].func.isRequired,
-  shouldClone: _propTypes["default"].bool.isRequired,
-  tagAssociations: _reactImmutableProptypes["default"].listOf(_reactImmutableProptypes["default"].map),
-  tagInput: _propTypes["default"].string,
-  updateItem: _propTypes["default"].func.isRequired,
-  updateStimulus: _propTypes["default"].func.isRequired,
-  useBankTags: _propTypes["default"].bool,
-  iceTopNavBarEnabled: _propTypes["default"].bool,
-  styles: _propTypes["default"].object
-}), (0, _defineProperty2["default"])(_BankEntry, "defaultProps", {
-  closeTray: function closeTray() {},
-  entry: null,
-  isCompact: false,
-  navigateToBuild: null,
-  scope: {},
-  returnToUrl: null,
-  pendingAdditionTags: _immutable["default"].List(),
-  pendingDeletionTags: _immutable["default"].List(),
-  tagAssociations: _immutable["default"].List(),
-  tagInput: null,
-  useBankTags: false,
-  iceTopNavBarEnabled: false
-}), _BankEntry)) || _class);
-var _default = exports["default"] = BankEntry;
+    _create_class(BankEntry, [
+        {
+            key: "componentDidMount",
+            value: function componentDidMount() {
+                if (!this.isTemporary()) {
+                    this.props.getBankEntry(this.props.bankId, this.props.bankEntryId);
+                }
+                if (this.navToBankRef) {
+                    ReactDOM.findDOMNode(this.navToBankRef).focus();
+                }
+                this.props.getBank(this.props.bankId);
+            }
+        },
+        {
+            key: "componentWillUnmount",
+            value: function componentWillUnmount() {
+                this.props.setShouldClone(false);
+            }
+        },
+        {
+            key: "UNSAFE_componentWillMount",
+            value: function UNSAFE_componentWillMount() {
+                this.props.setShouldClone(false);
+            }
+        },
+        {
+            key: "isTemporary",
+            value: function isTemporary() {
+                return this.props.entry && this.props.entry.isTemporary();
+            }
+        },
+        {
+            key: "getBankEntryTypeSlug",
+            value: function getBankEntryTypeSlug() {
+                return this.props.bankEntry.entryType;
+            }
+        },
+        {
+            key: "getEntry",
+            value: function getEntry() {
+                return this.props.entry;
+            }
+        },
+        {
+            key: "isItemEntry",
+            value: function isItemEntry() {
+                return this.props.bankEntry.entryType === 'Item';
+            }
+        },
+        {
+            key: "isStimulusEntry",
+            value: function isStimulusEntry() {
+                var _this_props_bankEntry;
+                return (_this_props_bankEntry = this.props.bankEntry) === null || _this_props_bankEntry === void 0 ? void 0 : _this_props_bankEntry.isStimulusEntry;
+            }
+        },
+        {
+            key: "isPassageEntry",
+            value: function isPassageEntry() {
+                var _this_props_bankEntry;
+                return (_this_props_bankEntry = this.props.bankEntry) === null || _this_props_bankEntry === void 0 ? void 0 : _this_props_bankEntry.isPassageEntry;
+            }
+        },
+        {
+            key: "getEditWarning",
+            value: function getEditWarning() {
+                if (this.isStimulusEntry()) {
+                    return t('Edits made here will appear on any assessment using this stimulus.');
+                }
+                if (this.isPassageEntry()) {
+                    return t('Edits made here will appear on any assessment using this text block.');
+                }
+                return t('Edits made here will appear on any assessment using this question.');
+            }
+        },
+        {
+            key: "entryLinkName",
+            value: function entryLinkName() {
+                var translations = {
+                    new: {
+                        question: t('New Question'),
+                        stimulus: t('New Stimulus'),
+                        passage: t('New Text Block')
+                    },
+                    edit: {
+                        question: t('Edit Question'),
+                        stimulus: t('Edit Stimulus'),
+                        passage: t('Edit Text Block')
+                    }
+                };
+                var operation = this.isTemporary() ? 'new' : 'edit';
+                switch(true){
+                    case this.isItemEntry():
+                        return translations[operation]['question'];
+                    case this.isStimulusEntry():
+                        return translations[operation]['stimulus'];
+                    case this.isPassageEntry():
+                        return translations[operation]['passage'];
+                }
+            }
+        },
+        {
+            key: "renderBankBreadCrumbLink",
+            value: function renderBankBreadCrumbLink() {
+                return /*#__PURE__*/ jsx(BreadcrumbLink, {
+                    key: "bank",
+                    onClick: this.navigateToBank,
+                    ref: this.setNavToBankRef
+                }, this.props.bank.title);
+            }
+        },
+        {
+            key: "renderBankEntryBreadCrumbLink",
+            value: function renderBankEntryBreadCrumbLink() {
+                return /*#__PURE__*/ jsx(BreadcrumbLink, {
+                    key: "bankEntry"
+                }, this.entryLinkName());
+            }
+        },
+        {
+            key: "renderNav",
+            value: function renderNav() {
+                var _this_props = this.props, scope = _this_props.scope, closeTray = _this_props.closeTray, navigateToBanks = _this_props.navigateToBanks, navigateToBuild = _this_props.navigateToBuild, returnToUrl = _this_props.returnToUrl;
+                var isScopeEmpty = !Object.keys(scope).length;
+                return /*#__PURE__*/ jsx(NavWrapper, {
+                    closeTray: closeTray,
+                    navigateToBanks: navigateToBanks,
+                    navigateToBuild: navigateToBuild,
+                    returnToUrl: isScopeEmpty ? null : returnToUrl,
+                    scope: scope,
+                    isCompact: this.props.isCompact,
+                    iceTopNavBarEnabled: this.props.iceTopNavBarEnabled,
+                    menuItemPath: "/banks/".concat(this.props.bankId, "/bank_entries/").concat(this.props.bankEntryId || 'new')
+                }, this.renderBankBreadCrumbLink(), this.renderBankEntryBreadCrumbLink());
+            }
+        },
+        {
+            key: "renderTitle",
+            value: function renderTitle(entry) {
+                if (this.isItemEntry()) {
+                    return /*#__PURE__*/ jsx(TextInput, {
+                        renderLabel: /*#__PURE__*/ jsx(ScreenReaderContent, null, t('Edit question title')),
+                        type: "text",
+                        placeholder: t('Question Title'),
+                        onChange: this.handleTitleChange,
+                        value: entry.getWorkingInstance().title || ''
+                    });
+                }
+            }
+        },
+        {
+            key: "getIdentifier",
+            value: function getIdentifier(entry) {
+                if (!entry) return;
+                switch(true){
+                    case this.isItemEntry():
+                        return t('Question { id }', {
+                            id: entry.id
+                        });
+                    case this.isStimulusEntry():
+                        return t('Stimulus { id }', {
+                            id: entry.id
+                        });
+                    case this.isPassageEntry():
+                        return t('Text Block { id }', {
+                            id: entry.id
+                        });
+                    default:
+                        return;
+                }
+            }
+        },
+        {
+            key: "getTemporaryIdentifier",
+            value: function getTemporaryIdentifier() {
+                switch(true){
+                    case this.isItemEntry():
+                        return t('New Question');
+                    case this.isStimulusEntry():
+                        return t('New Stimulus');
+                    case this.isPassageEntry():
+                        return t('New Text Block');
+                    default:
+                        return;
+                }
+            }
+        },
+        {
+            key: "getEntryName",
+            value: function getEntryName(entry) {
+                if (!entry) return;
+                switch(true){
+                    case this.isItemEntry():
+                        var _entry_getInteractionType;
+                        return (_entry_getInteractionType = entry.getInteractionType()) === null || _entry_getInteractionType === void 0 ? void 0 : _entry_getInteractionType.name;
+                    case this.isStimulusEntry():
+                        return t('Stimulus');
+                    case this.isPassageEntry():
+                        return t('Text Block');
+                    default:
+                        return;
+                }
+            }
+        },
+        {
+            key: "renderHeader",
+            value: function renderHeader(entry) {
+                if (!entry) return;
+                var props = this.editProps(entry);
+                var identifier = this.getIdentifier(entry);
+                var tempIdentifier = this.getTemporaryIdentifier();
+                var itemIdentifier = this.isTemporary() ? tempIdentifier : identifier;
+                var entryName = this.getEntryName(entry);
+                return /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.header
+                }, /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.leftHeader
+                }, /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.headerText
+                }, /*#__PURE__*/ jsx(Heading, {
+                    level: "reset",
+                    as: "h2"
+                }, t('{entryName} | {itemIdentifier}', {
+                    entryName: entryName,
+                    itemIdentifier: itemIdentifier
+                })))), this.renderTitle(entry), /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.rightHeader
+                }, /*#__PURE__*/ jsx(EntrySave, props)));
+            }
+        },
+        {
+            key: "hasPendingTagModifications",
+            value: function hasPendingTagModifications() {
+                return !this.props.pendingDeletionTags.isEmpty() || !this.props.pendingAdditionTags.isEmpty();
+            }
+        },
+        {
+            key: "createTagsForClone",
+            value: function createTagsForClone(newBankEntry, tags) {
+                this.props.createTagAssociations(newBankEntry.id, newBankEntry.entry_type, newBankEntry.entry.id, tags.map(function(tag) {
+                    return tag.tag_value;
+                }));
+                // Pending tag associations were applied to the original bank entry, so clear those out
+                this.props.setPendingAdditionTagAssociations(this.props.bankEntry.entryType, this.props.entry.id, []);
+                this.props.setPendingDeletionTagAssociations(this.props.bankEntry.entryType, this.props.entry.id, []);
+            }
+        },
+        {
+            key: "updateTagsForEntry",
+            value: function updateTagsForEntry() {
+                return _async_to_generator(function() {
+                    return _ts_generator(this, function(_state) {
+                        switch(_state.label){
+                            case 0:
+                                if (!!this.props.shouldClone) return [
+                                    3,
+                                    3
+                                ];
+                                return [
+                                    4,
+                                    this.props.createTagAssociations(this.props.bankEntryId, this.props.bankEntry.entryType, this.getBankEntryId(this.props.bankEntry), this.props.pendingAdditionTags.map(function(tagToAdd) {
+                                        return tagToAdd.get('tag_value');
+                                    }))
+                                ];
+                            case 1:
+                                _state.sent();
+                                return [
+                                    4,
+                                    this.props.deleteTagAssociations(this.props.bankEntryId, this.props.bankEntry.entryType, this.getBankEntryId(this.props.bankEntry), this.props.pendingDeletionTags.map(function(tagToDelete) {
+                                        return tagToDelete.get('id');
+                                    }))
+                                ];
+                            case 2:
+                                _state.sent();
+                                _state.label = 3;
+                            case 3:
+                                return [
+                                    2
+                                ];
+                        }
+                    });
+                }).call(this);
+            }
+        },
+        {
+            key: "normalSubmit",
+            value: function normalSubmit() {
+                return _async_to_generator(function() {
+                    var entry, tags, createEntryCb, newBankEntry, workingEntry, updateFunc, toClear;
+                    return _ts_generator(this, function(_state) {
+                        switch(_state.label){
+                            case 0:
+                                entry = this.props.entry;
+                                if (!(entry.hasModifications() || this.props.shouldClone && this.hasPendingTagModifications())) return [
+                                    3,
+                                    5
+                                ];
+                                if (!this.props.shouldClone) return [
+                                    3,
+                                    2
+                                ];
+                                tags = this.visibleTagAssociations();
+                                createEntryCb = this.isItemEntry() ? createItem : createStimulus;
+                                return [
+                                    4,
+                                    this.props.cloneBankEntry(this.props.bankEntry, createEntryCb)
+                                ];
+                            case 1:
+                                newBankEntry = _state.sent();
+                                this.createTagsForClone(newBankEntry, tags);
+                                return [
+                                    3,
+                                    4
+                                ];
+                            case 2:
+                                workingEntry = entry.getWorkingInstance();
+                                updateFunc = this.isItemEntry() ? this.props.updateItem : this.props.updateStimulus;
+                                return [
+                                    4,
+                                    updateFunc(workingEntry, this.props.bankId, 'bank')
+                                ];
+                            case 3:
+                                _state.sent();
+                                _state.label = 4;
+                            case 4:
+                                toClear = this.isItemEntry() ? 'items' : 'stimuli';
+                                this.props.clearModifications(toClear, entry.id);
+                                _state.label = 5;
+                            case 5:
+                                if (!this.hasPendingTagModifications()) return [
+                                    3,
+                                    7
+                                ];
+                                return [
+                                    4,
+                                    this.updateTagsForEntry()
+                                ];
+                            case 6:
+                                _state.sent();
+                                _state.label = 7;
+                            case 7:
+                                return [
+                                    2
+                                ];
+                        }
+                    });
+                }).call(this);
+            }
+        },
+        {
+            key: "temporarySubmit",
+            value: function temporarySubmit() {
+                return _async_to_generator(function() {
+                    var entry, workingEntry, workingBankEntry, createEntryCb, newBankEntry, toClear;
+                    return _ts_generator(this, function(_state) {
+                        switch(_state.label){
+                            case 0:
+                                entry = this.props.entry;
+                                workingEntry = entry.getWorkingInstance();
+                                workingBankEntry = this.props.bankEntry.getWorkingInstance();
+                                createEntryCb = this.isItemEntry() ? createItem : createStimulus;
+                                return [
+                                    4,
+                                    this.props.createEntryAndBankEntry(this.props.bankId, workingEntry, workingBankEntry, createEntryCb)
+                                ];
+                            case 1:
+                                newBankEntry = _state.sent();
+                                if (this.hasPendingTagModifications()) {
+                                    this.props.createTagAssociations(newBankEntry.id, newBankEntry.entry_type, newBankEntry.entry.id, this.props.pendingAdditionTags.map(function(tagToAdd) {
+                                        return tagToAdd.get('tag_value');
+                                    }));
+                                }
+                                toClear = this.isItemEntry() ? 'items' : 'stimuli';
+                                this.props.clearModifications(toClear, entry.id);
+                                this.props.clearTemporaryBankItem(this.props.bankId);
+                                return [
+                                    2
+                                ];
+                        }
+                    });
+                }).call(this);
+            }
+        },
+        {
+            key: "renderFeedbackSection",
+            value: function renderFeedbackSection() {
+                if (!this.isItemEntry()) {
+                    return;
+                }
+                var shouldClone = this.props.shouldClone;
+                var disabled = this.props.entry.isImmutable() && !shouldClone;
+                var icon, text;
+                if (this.props.entry.getWorkingInstance().hasFeedback()) {
+                    icon = IconDiscussionSolid;
+                    text = t('Edit Question Level Feedback (present)');
+                } else {
+                    icon = IconDiscussionLine;
+                    text = t('Edit Question Level Feedback');
+                }
+                return /*#__PURE__*/ jsx(IconButton, {
+                    onClick: this.openFeedbackModal,
+                    withBackground: false,
+                    withBorder: false,
+                    disabled: disabled,
+                    ref: this.storeFeedbackButtonRef,
+                    renderIcon: icon,
+                    screenReaderLabel: text
+                });
+            }
+        },
+        {
+            key: "getBankEntryId",
+            value: function getBankEntryId(bankEntry) {
+                // bankEntry.entry can be either 'TEMPORARY_ITEM' or an entire Map
+                return bankEntry.entry ? bankEntry.entry.get ? bankEntry.entry.get('id') : bankEntry.entry : null;
+            }
+        },
+        {
+            key: "visibleTagAssociations",
+            value: function visibleTagAssociations() {
+                var _this_props = this.props, pendingAdditionTags = _this_props.pendingAdditionTags, pendingDeletionTags = _this_props.pendingDeletionTags, tagAssociations = _this_props.tagAssociations;
+                var existingValues = keyBy(tagAssociations.toJS(), function(t) {
+                    return t.tag_value;
+                });
+                var noDuplicates = pendingAdditionTags.filter(function(t) {
+                    return isUndefined(existingValues[t.get('tag_value')]);
+                });
+                return tagAssociations.filter(function(tag) {
+                    return !pendingDeletionTags.includes(tag);
+                }).concat(noDuplicates).toJS();
+            }
+        },
+        {
+            key: "visibleTags",
+            value: function visibleTags() {
+                return this.visibleTagAssociations().map(function(a) {
+                    return {
+                        id: a.tag_id,
+                        value: a.tag_value
+                    };
+                });
+            }
+        },
+        {
+            key: "renderEntry",
+            value: function renderEntry(entry) {
+                var _this = this;
+                if (!entry) return;
+                var _this_props = this.props, bankEntry = _this_props.bankEntry, useBankTags = _this_props.useBankTags;
+                var props = this.editProps(entry);
+                var propsFunc = this.isItemEntry() ? propsForItemVersioningWrapper : propsForStimulusVersioningWrapper;
+                var versioningProps = propsFunc(entry.isImmutable(), this.props.shouldClone, this.props.setShouldClone, this.navigateToBank, true, 'warning', this.isPassageEntry());
+                var canEdit = !entry.isImmutable() || this.props.shouldClone;
+                var ItemComponent = canEdit ? ItemEdit : ItemShow;
+                var StimulusComponent = canEdit ? StimulusEditInfo : StimulusShowInfo;
+                var EntryComponent = this.isItemEntry() ? ItemComponent : StimulusComponent;
+                var entryType = bankEntry.entryType;
+                var entryId = this.getBankEntryId(bankEntry);
+                var tags = function() {
+                    return /*#__PURE__*/ jsx(TagSuggestSelect, {
+                        allowNewTags: true,
+                        noMatchText: t('Enter a tag to find or create'),
+                        parentType: entryType,
+                        parentId: entryId,
+                        onChange: _this.handleTagChange,
+                        tags: _this.visibleTags()
+                    });
+                };
+                var editWarning = this.getEditWarning();
+                return /*#__PURE__*/ jsx("div", null, /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.entryEdit
+                }, /*#__PURE__*/ jsx(WarningWrapper, versioningProps, canEdit && /*#__PURE__*/ jsx(Alert, {
+                    renderCloseButtonLabel: t('Dismiss'),
+                    margin: "0 0 medium 0"
+                }, /*#__PURE__*/ jsx(Text, {
+                    color: "primary"
+                }, editWarning)), /*#__PURE__*/ jsx(EntryComponent, props), useBankTags && tags())), /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.footer
+                }, /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.leftFooter
+                }, this.renderFeedbackSection()), /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.rightFooter
+                }, /*#__PURE__*/ jsx(EntrySave, props))));
+            }
+        },
+        {
+            key: "render",
+            value: function render() {
+                var entry = this.props.entry;
+                if (entry && !entry.isLoaded()) {
+                    return /*#__PURE__*/ jsx(Spinner, null);
+                }
+                return /*#__PURE__*/ jsx(Page, null, this.renderNav(), /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.content,
+                    ref: this.handleRef
+                }, this.props.iceTopNavBarEnabled && /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.breadcrumb
+                }, /*#__PURE__*/ jsx(HeaderBreadCrumb, {
+                    returnToUrl: this.props.returnToUrl,
+                    scope: this.props.scope,
+                    navigateToBanks: this.props.navigateToBanks,
+                    navigateToBuild: this.props.navigateToBuild
+                }, this.renderBankBreadCrumbLink(), this.renderBankEntryBreadCrumbLink())), this.renderHeader(entry), this.renderEntry(entry), !this.props.isCompact && /*#__PURE__*/ jsx(ItemFeedbackModal, {
+                    parentId: this.props.bankId,
+                    parentType: PARENT_TYPE_BANK
+                })));
+            }
+        }
+    ]);
+    return BankEntry;
+}(Component);
+_define_property(BankEntry, "displayName", 'BankEntry');
+_define_property(BankEntry, "componentId", "Quizzes".concat(BankEntry.displayName));
+_define_property(BankEntry, "propTypes", {
+    bankEntryId: PropTypes.string.isRequired,
+    bankId: PropTypes.string.isRequired,
+    bank: ImmutablePropTypes.record.isRequired,
+    bankEntry: ImmutablePropTypes.record.isRequired,
+    entry: ImmutablePropTypes.record,
+    changeItemTitle: PropTypes.func.isRequired,
+    changeQuizEntryPoints: PropTypes.func.isRequired,
+    cloneBankEntry: PropTypes.func.isRequired,
+    clearModifications: PropTypes.func.isRequired,
+    clearTemporaryBankItem: PropTypes.func.isRequired,
+    createEntryAndBankEntry: PropTypes.func.isRequired,
+    closeTray: PropTypes.func,
+    createTagAssociations: PropTypes.func.isRequired,
+    deleteTagAssociations: PropTypes.func.isRequired,
+    getBankEntry: PropTypes.func.isRequired,
+    getBank: PropTypes.func.isRequired,
+    isCompact: PropTypes.bool,
+    navigateToBanks: PropTypes.func.isRequired,
+    navigateToBank: PropTypes.func.isRequired,
+    navigateToBuild: PropTypes.func,
+    scope: PropTypes.objectOf(PropTypes.shape({
+        type: PropTypes.string,
+        uuid: PropTypes.string,
+        title: PropTypes.string,
+        launch_context_uuid: PropTypes.string,
+        root_account_name: PropTypes.string
+    })),
+    returnToUrl: PropTypes.string,
+    openModal: PropTypes.func.isRequired,
+    pendingAdditionTags: ImmutablePropTypes.listOf(ImmutablePropTypes.map),
+    pendingDeletionTags: ImmutablePropTypes.listOf(ImmutablePropTypes.map),
+    setPendingAdditionTagAssociations: PropTypes.func.isRequired,
+    setPendingDeletionTagAssociations: PropTypes.func.isRequired,
+    setShouldClone: PropTypes.func.isRequired,
+    setTagInput: PropTypes.func.isRequired,
+    setUi: PropTypes.func.isRequired,
+    shouldClone: PropTypes.bool.isRequired,
+    tagAssociations: ImmutablePropTypes.listOf(ImmutablePropTypes.map),
+    tagInput: PropTypes.string,
+    updateItem: PropTypes.func.isRequired,
+    updateStimulus: PropTypes.func.isRequired,
+    useBankTags: PropTypes.bool,
+    iceTopNavBarEnabled: PropTypes.bool,
+    styles: PropTypes.object
+});
+_define_property(BankEntry, "defaultProps", {
+    closeTray: function closeTray() {},
+    entry: null,
+    isCompact: false,
+    navigateToBuild: null,
+    scope: {},
+    returnToUrl: null,
+    pendingAdditionTags: Immutable.List(),
+    pendingDeletionTags: Immutable.List(),
+    tagAssociations: Immutable.List(),
+    tagInput: null,
+    useBankTags: false,
+    iceTopNavBarEnabled: false
+});
+BankEntry = _ts_decorate([
+    withStyleOverrides(generateStyle, generateComponentTheme)
+], BankEntry);
+export default BankEntry;