@instructure/quiz-core 22.14.1 → 22.15.1

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

@@ -1,448 +1,537 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.BankEntryRow = void 0;
-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 = _interopRequireWildcard(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _partial = _interopRequireDefault(require("lodash/partial"));
-var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));
-var _immutable = _interopRequireDefault(require("immutable"));
-var _uiIcons = require("@instructure/ui-icons");
-var _uiButtons = require("@instructure/ui-buttons");
-var _uiText = require("@instructure/ui-text");
-var _uiList = require("@instructure/ui-list");
-var _uiHeading = require("@instructure/ui-heading");
-var _uiAlerts = require("@instructure/ui-alerts");
-var _emotion = require("@instructure/emotion");
-var _quizCommon = require("@instructure/quiz-common");
-var _quizRce = require("@instructure/quiz-rce");
-var _quizInteractions = require("@instructure/quiz-interactions");
-var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/format-message"));
-var _CopyMoveBankEntryModal = _interopRequireDefault(require("../CopyMoveBankEntryModal"));
-var _ExpandButton = _interopRequireDefault(require("../../../common/components/shared/ExpandButton"));
-var _QuizEntry = _interopRequireDefault(require("../../../common/records/QuizEntry"));
-var _ItemShow = _interopRequireDefault(require("../../../common/components/resources/item/ItemShow"));
-var _StimulusShowInfo = _interopRequireDefault(require("../../../common/components/resources/stimulus/StimulusShowInfo"));
-var _TagDisplay = _interopRequireDefault(require("../../../common/components/shared/TagDisplay"));
-var _styles = _interopRequireDefault(require("./styles"));
-var _theme = _interopRequireDefault(require("./theme"));
-var _overlay = _interopRequireDefault(require("../../../common/components/shared/overlay"));
-var _dec, _class, _BankEntryRow;
-/** @jsx jsx */
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-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 BankEntryRow = exports.BankEntryRow = (_dec = (0, _quizCommon.withStyleOverrides)(_styles["default"], _theme["default"]), _dec(_class = (_BankEntryRow = /*#__PURE__*/function (_withI18nSupport) {
-  function BankEntryRow() {
-    var _this2;
-    (0, _classCallCheck2["default"])(this, BankEntryRow);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this2 = _callSuper(this, BankEntryRow, [].concat(args));
-    (0, _defineProperty2["default"])(_this2, "incrementPosition", function () {
-      _this2.props.setUi(_quizCommon.BUILD_TRAY_POSITION, _this2.props.position + 1);
-    });
-    (0, _defineProperty2["default"])(_this2, "deleteBankEntry", function () {
-      var confirmBody = (0, _emotion.jsx)(_uiAlerts.Alert, {
-        variant: "error",
-        padding: "0"
-      }, (0, _emotion.jsx)("div", {
-        css: _this2.props.styles.deleteAlert
-      }, (0, _emotion.jsx)("div", {
-        css: _this2.props.styles.deletePreface
-      }, _this2.getDeletePreface()), (0, _emotion.jsx)(_uiList.List, null, (0, _emotion.jsx)(_uiList.List.Item, null, _formatMessage["default"].rich('will <0>NOT</0> remove it from any assessments', [function (_ref) {
-        var children = _ref.children;
-        return (0, _emotion.jsx)(_uiText.Text, {
-          weight: "bold",
-          key: "0"
-        }, children);
-      }])), (0, _emotion.jsx)(_uiList.List.Item, null, (0, _formatMessage["default"])('will lose its statistical link in reporting')), (0, _emotion.jsx)(_uiList.List.Item, null, (0, _formatMessage["default"])('will remove access for all users with whom this bank has been shared')))));
-      _this2.props.withConfirm((0, _partial["default"])(_this2.props.removeBankEntry, _this2.props.bank.id, _this2.props.bankEntry.id), {
-        title: (0, _formatMessage["default"])('Delete {type}', {
-          type: _this2.type()
-        }),
-        text: confirmBody,
-        continueText: (0, _formatMessage["default"])('Delete'),
-        continueVariant: 'danger',
-        size: 'medium'
-      });
-    });
-    (0, _defineProperty2["default"])(_this2, "addToQuiz", function () {
-      if (_this2.props.activeQuizId) {
-        var newEntry = _QuizEntry["default"].create({
-          entryId: _this2.props.bankEntry.id,
-          entryType: 'BankEntry',
-          position: _this2.props.position,
-          stimulusQuizEntryId: _this2.props.stimulusId
-        });
-        _this2.props.addEntryToQuiz(_this2.props.activeQuizId, newEntry.entryId, newEntry.entryType, newEntry.getProperties(), false).then(function () {
-          _this2.props.screenreaderNotification((0, _formatMessage["default"])('Bank Entry was successfully added to the quiz'));
-        });
-        if (_this2.props.position) _this2.incrementPosition();
-      }
-    });
-    (0, _defineProperty2["default"])(_this2, "openCopyMoveBankEntryModal", function () {
-      _this2.props.openModal([_quizCommon.COPY_MOVE_BANK_ENTRY_MODAL, _this2.props.bankEntry.entryType, _this2.props.bankEntry.entry.toJS().id].join(':'), {
-        modalTrigger: _this2.copyMoveBankEntryButton
-      });
-    });
-    (0, _defineProperty2["default"])(_this2, "createEntryForBank", function () {
-      var createEntry = _this2.isItemEntry() ? _this2.props.createItem : _this2.props.createStimulus;
-      return createEntry(_this2.getEntry(), _this2.props.bank.id, 'bank');
-    });
-    (0, _defineProperty2["default"])(_this2, "storeCopyMoveBankEntryButtonRef", function (c) {
-      _this2.copyMoveBankEntryButton = c;
-    });
-    (0, _defineProperty2["default"])(_this2, "storeEditButtonRef", function (c) {
-      _this2.editButton = c;
-    });
-    (0, _defineProperty2["default"])(_this2, "renderTrashButton", function () {
-      var title = (0, _formatMessage["default"])('Delete {type}', {
-        type: _this2.type()
-      });
-      return (0, _emotion.jsx)(_uiButtons.IconButton, {
-        size: "medium",
-        withBackground: false,
-        withBorder: false,
-        onClick: _this2.deleteBankEntry,
-        "data-automation": "sdk-delete-bank-entry-button",
-        renderIcon: _uiIcons.IconTrashLine,
-        title: title,
-        screenReaderLabel: title
-      });
-    });
-    (0, _defineProperty2["default"])(_this2, "navigateToBankEntry", function () {
-      _this2.props.setUi(_quizCommon.SET_EDIT_BUTTON_FOCUS, _this2.props.bankEntry.id);
-      _this2.props.navigateToBankEntry(_this2.props.bankEntry.id, _this2.props.bank.id);
-    });
-    return _this2;
-  }
-  (0, _inherits2["default"])(BankEntryRow, _withI18nSupport);
-  return (0, _createClass2["default"])(BankEntryRow, [{
-    key: "componentDidMount",
-    value: function componentDidMount() {
-      if (this.props.bankEntry.id === this.props.setEditButtonFocus) {
-        this.editButton.focus();
-        this.props.clearUi(_quizCommon.SET_EDIT_BUTTON_FOCUS);
-      }
-    }
-  }, {
-    key: "getEntry",
-    value: function getEntry() {
-      return this.props.bankEntry.getEntry();
-    }
-  }, {
-    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: "type",
-    value: function type() {
-      if (this.isStimulusEntry()) {
-        return (0, _formatMessage["default"])('Stimulus');
-      }
-      if (this.isPassageEntry()) {
-        return (0, _formatMessage["default"])('Text Block');
-      }
-      return (0, _formatMessage["default"])('Question');
-    }
-  }, {
-    key: "entryIdentifier",
-    value: function entryIdentifier() {
-      var title = this.getEntry().title;
-      if (this.isStimulusEntry()) {
-        return (0, _formatMessage["default"])('Stimulus { title }', {
-          title: title
-        });
-      }
-      if (this.isPassageEntry()) {
-        return (0, _formatMessage["default"])('Text Block { title }', {
-          title: title
-        });
-      }
-      return (0, _formatMessage["default"])('Question { itemBody }', {
-        itemBody: (0, _quizInteractions.extractTextFromHtml)(title)
-      });
-    }
-  }, {
-    key: "getDeletePreface",
-    value: function getDeletePreface() {
-      if (this.isStimulusEntry()) {
-        return (0, _formatMessage["default"])('Deleting this stimulus:');
-      }
-      if (this.isPassageEntry()) {
-        return (0, _formatMessage["default"])('Deleting this text block:');
-      }
-      return (0, _formatMessage["default"])('Deleting this question:');
-    }
-  }, {
-    key: "moveModalTitle",
-    value: function moveModalTitle() {
-      return (0, _formatMessage["default"])('Copy / Move {type}', {
-        type: this.type()
-      });
+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: "renderExpandButton",
-    value: function renderExpandButton() {
-      var type = this.type();
-      var title = this.props.isExpanded ? (0, _formatMessage["default"])('Collapse {type} details', {
-        type: type
-      }) : (0, _formatMessage["default"])('Expand {type} details', {
-        type: type
-      });
-      return (0, _emotion.jsx)("div", {
-        css: this.props.styles.expandButtonContainer
-      }, (0, _emotion.jsx)(_ExpandButton["default"], {
-        onClick: this.props.toggleExpanded,
-        title: title,
-        isExpanded: this.props.isExpanded,
-        "data-automation": "expand-bank-question-button"
-      }));
+}
+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: "renderAddButton",
-    value: function renderAddButton() {
-      if (!this.props.isQuizContentLocked && this.props.addEntryToQuiz) {
-        var title = (0, _formatMessage["default"])('Add {type} to this quiz', {
-          type: this.type()
+}
+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
         });
-        return (0, _emotion.jsx)("div", {
-          css: [this.props.styles.buttons, this.props.styles.addButton]
-        }, (0, _emotion.jsx)(_uiButtons.IconButton, {
-          color: "primary",
-          shape: "circle",
-          size: "small",
-          onClick: this.addToQuiz,
-          "data-automation": "sdk-add-bank-entry-button",
-          disabled: this.props.bankEntry.isStimulus && this.props.stimulusId !== null,
-          renderIcon: _uiIcons.IconPlusLine,
-          title: title,
-          screenReaderLabel: title
-        }));
-      }
-      // This empty div is necessary for spacing
-      return (0, _emotion.jsx)("div", null);
-    }
-  }, {
-    key: "renderMoveButton",
-    value: function renderMoveButton() {
-      var title = this.moveModalTitle();
-      return (0, _emotion.jsx)(_uiButtons.IconButton, {
-        ref: this.storeCopyMoveBankEntryButtonRef,
-        size: "medium",
-        withBackground: false,
-        withBorder: false,
-        onClick: this.openCopyMoveBankEntryModal,
-        "data-automation": "sdk-copy-move-bank-entry-button",
-        renderIcon: _uiIcons.IconCopyLine,
-        title: title,
-        screenReaderLabel: title
-      });
-    }
-  }, {
-    key: "entryHeader",
-    value: function entryHeader() {
-      var entry = this.getEntry();
-      if (this.isItemEntry()) {
-        return entry.getInteractionType().name;
-      } else {
-        return entry.isPassage ? (0, _formatMessage["default"])('Text Block') : (0, _formatMessage["default"])('Stimulus');
-      }
+    } else {
+        obj[key] = value;
     }
-  }, {
-    key: "renderHeader",
-    value: function renderHeader() {
-      return (0, _emotion.jsx)("div", null, (0, _emotion.jsx)("div", {
-        css: this.props.styles.headerRow
-      }, this.renderAddButton(), (0, _emotion.jsx)("div", {
-        css: this.props.styles.buttons
-      }, this.props.bank.canEdit() && (0, _emotion.jsx)(_react["default"].Fragment, null, this.renderEditButton(), this.renderMoveButton(), this.renderTrashButton()), this.renderExpandButton())), (0, _emotion.jsx)("div", {
-        css: this.props.styles.headerText
-      }, (0, _emotion.jsx)(_uiHeading.Heading, {
-        level: "reset",
-        as: "h2"
-      }, (0, _formatMessage["default"])('{entryHeader} | {entryIdentifier}', {
-        entryHeader: this.entryHeader(),
-        entryIdentifier: this.entryIdentifier()
-      }))));
+    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: "renderEntryCollapsed",
-    value: function renderEntryCollapsed() {
-      var itemOrStimulus = this.getEntry();
-
-      // render item's body as html
-      // or title plain text
-      if (itemOrStimulus.itemBody) {
-        return (0, _emotion.jsx)(_quizRce.RichContentRenderer, {
-          customStyles: this.props.styles.stem,
-          content: itemOrStimulus.itemBody
-        });
-      } else {
-        return (0, _emotion.jsx)("div", {
-          css: this.props.styles.stem
-        }, itemOrStimulus.title);
-      }
+    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: "renderEntryExpanded",
-    value: function renderEntryExpanded() {
-      var entry = this.getEntry();
-      if (this.isItemEntry()) {
-        return (0, _emotion.jsx)(_ItemShow["default"], {
-          entry: entry,
-          guid: this.props.bankEntry.id
-        });
-      } else {
-        return (0, _emotion.jsx)(_StimulusShowInfo["default"], {
-          stimulus: entry
+    return _assert_this_initialized(self);
+}
+function _set_prototype_of(o, p) {
+    _set_prototype_of = Object.setPrototypeOf || function setPrototypeOf(o, p) {
+        o.__proto__ = p;
+        return o;
+    };
+    return _set_prototype_of(o, p);
+}
+function _type_of(obj) {
+    "@swc/helpers - typeof";
+    return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
+}
+function _is_native_reflect_construct() {
+    try {
+        var result = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function() {}));
+    } catch (_) {}
+    return (_is_native_reflect_construct = function() {
+        return !!result;
+    })();
+}
+function _ts_decorate(decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for(var i = decorators.length - 1; i >= 0; i--)if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+}
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import partial from 'lodash/partial';
+import ImmutablePropTypes from 'react-immutable-proptypes';
+import Immutable from 'immutable';
+import { IconEditLine, IconPlusLine, IconCopyLine, IconTrashLine } from '@instructure/ui-icons';
+import { IconButton } from '@instructure/ui-buttons';
+import { Text } from '@instructure/ui-text';
+import { List } from '@instructure/ui-list';
+import { Heading } from '@instructure/ui-heading';
+import { Alert } from '@instructure/ui-alerts';
+import { jsx } from '@instructure/emotion';
+import { BUILD_TRAY_POSITION, COPY_MOVE_BANK_ENTRY_MODAL, SET_EDIT_BUTTON_FOCUS, withI18nSupport, withStyleOverrides } from '@instructure/quiz-common';
+import { RichContentRenderer } from '@instructure/quiz-rce';
+import { extractTextFromHtml } from '@instructure/quiz-interactions';
+import t from '@instructure/quiz-i18n/format-message';
+import CopyMoveBankEntryModal from '../CopyMoveBankEntryModal';
+import ExpandButton from '../../../common/components/shared/ExpandButton';
+import QuizEntry from '../../../common/records/QuizEntry';
+import ItemShow from '../../../common/components/resources/item/ItemShow';
+import StimulusShowInfo from '../../../common/components/resources/stimulus/StimulusShowInfo';
+import TagDisplay from '../../../common/components/shared/TagDisplay';
+import generateStyle from './styles';
+import generateComponentTheme from './theme';
+import Overlay from '../../../common/components/shared/overlay';
+var _withI18nSupport;
+export var BankEntryRow = /*#__PURE__*/ function(_superClass) {
+    "use strict";
+    _inherits(BankEntryRow, _superClass);
+    function BankEntryRow() {
+        _class_call_check(this, BankEntryRow);
+        var _this;
+        _this = _call_super(this, BankEntryRow, arguments), _define_property(_this, "incrementPosition", function() {
+            _this.props.setUi(BUILD_TRAY_POSITION, _this.props.position + 1);
+        }), _define_property(_this, "deleteBankEntry", function() {
+            var confirmBody = /*#__PURE__*/ jsx(Alert, {
+                variant: "error",
+                padding: "0"
+            }, /*#__PURE__*/ jsx("div", {
+                css: _this.props.styles.deleteAlert
+            }, /*#__PURE__*/ jsx("div", {
+                css: _this.props.styles.deletePreface
+            }, _this.getDeletePreface()), /*#__PURE__*/ jsx(List, null, /*#__PURE__*/ jsx(List.Item, null, t.rich('will <0>NOT</0> remove it from any assessments', [
+                function(param) {
+                    var children = param.children;
+                    return /*#__PURE__*/ jsx(Text, {
+                        weight: "bold",
+                        key: "0"
+                    }, children);
+                }
+            ])), /*#__PURE__*/ jsx(List.Item, null, t('will lose its statistical link in reporting')), /*#__PURE__*/ jsx(List.Item, null, t('will remove access for all users with whom this bank has been shared')))));
+            _this.props.withConfirm(partial(_this.props.removeBankEntry, _this.props.bank.id, _this.props.bankEntry.id), {
+                title: t('Delete {type}', {
+                    type: _this.type()
+                }),
+                text: confirmBody,
+                continueText: t('Delete'),
+                continueVariant: 'danger',
+                size: 'medium'
+            });
+        }), _define_property(_this, "addToQuiz", function() {
+            if (_this.props.activeQuizId) {
+                var newEntry = QuizEntry.create({
+                    entryId: _this.props.bankEntry.id,
+                    entryType: 'BankEntry',
+                    position: _this.props.position,
+                    stimulusQuizEntryId: _this.props.stimulusId
+                });
+                _this.props.addEntryToQuiz(_this.props.activeQuizId, newEntry.entryId, newEntry.entryType, newEntry.getProperties(), false).then(function() {
+                    _this.props.screenreaderNotification(t('Bank Entry was successfully added to the quiz'));
+                });
+                if (_this.props.position) _this.incrementPosition();
+            }
+        }), _define_property(_this, "openCopyMoveBankEntryModal", function() {
+            _this.props.openModal([
+                COPY_MOVE_BANK_ENTRY_MODAL,
+                _this.props.bankEntry.entryType,
+                _this.props.bankEntry.entry.toJS().id
+            ].join(':'), {
+                modalTrigger: _this.copyMoveBankEntryButton
+            });
+        }), _define_property(_this, "createEntryForBank", function() {
+            var createEntry = _this.isItemEntry() ? _this.props.createItem : _this.props.createStimulus;
+            return createEntry(_this.getEntry(), _this.props.bank.id, 'bank');
+        }), _define_property(_this, "storeCopyMoveBankEntryButtonRef", function(c) {
+            _this.copyMoveBankEntryButton = c;
+        }), _define_property(_this, "storeEditButtonRef", function(c) {
+            _this.editButton = c;
+        }), _define_property(_this, "renderTrashButton", function() {
+            var title = t('Delete {type}', {
+                type: _this.type()
+            });
+            return /*#__PURE__*/ jsx(IconButton, {
+                size: "medium",
+                withBackground: false,
+                withBorder: false,
+                onClick: _this.deleteBankEntry,
+                "data-automation": "sdk-delete-bank-entry-button",
+                renderIcon: IconTrashLine,
+                title: title,
+                screenReaderLabel: title
+            });
+        }), _define_property(_this, "navigateToBankEntry", function() {
+            _this.props.setUi(SET_EDIT_BUTTON_FOCUS, _this.props.bankEntry.id);
+            _this.props.navigateToBankEntry(_this.props.bankEntry.id, _this.props.bank.id);
         });
-      }
-    }
-  }, {
-    key: "renderEditButton",
-    value: function renderEditButton() {
-      var title = (0, _formatMessage["default"])('Edit {type}', {
-        type: this.type()
-      });
-      return (0, _emotion.jsx)(_uiButtons.IconButton, {
-        ref: this.storeEditButtonRef,
-        size: "medium",
-        withBackground: false,
-        withBorder: false,
-        onClick: this.navigateToBankEntry,
-        "data-automation": "sdk-edit-bank-entry-button",
-        renderIcon: _uiIcons.IconEditLine,
-        title: title,
-        screenReaderLabel: title
-      });
+        return _this;
     }
-  }, {
-    key: "renderTags",
-    value: function renderTags() {
-      if (!this.props.useBankTags) {
-        return null;
-      }
-      return (0, _emotion.jsx)(_TagDisplay["default"], {
-        tagAssociations: this.props.tagAssociations
-      });
-    }
-  }, {
-    key: "renderFooter",
-    value: function renderFooter() {
-      var lastUpdate = _formatMessage["default"].rich('<0>Last Update</0> { updatedAt }', {
-        0: function _(_ref2) {
-          var children = _ref2.children;
-          return (0, _emotion.jsx)(_uiText.Text, {
-            key: "lastUpdate",
-            weight: "bold",
-            color: "primary"
-          }, children);
+    _create_class(BankEntryRow, [
+        {
+            key: "componentDidMount",
+            value: function componentDidMount() {
+                if (this.props.bankEntry.id === this.props.setEditButtonFocus) {
+                    this.editButton.focus();
+                    this.props.clearUi(SET_EDIT_BUTTON_FOCUS);
+                }
+            }
         },
-        updatedAt: this.formatDatetimeMedium(this.props.bankEntry.get('updatedAt'))
-      });
-      return (0, _emotion.jsx)("div", {
-        css: this.props.styles.footer
-      }, (0, _emotion.jsx)("span", null, lastUpdate), this.renderTags());
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var isExpanded = this.props.isExpanded;
-      return (0, _emotion.jsx)(_overlay["default"], {
-        onClick: this.props.toggleExpanded,
-        tabIndex: "-1",
-        ariaLabel: this.entryIdentifier()
-      }, (0, _emotion.jsx)("div", {
-        role: "group"
-      }, (0, _emotion.jsx)("div", {
-        css: this.props.styles.entryDetail,
-        "data-automation": "sdk-bankEntryItem"
-      }, this.renderHeader(), isExpanded ? this.renderEntryExpanded() : this.renderEntryCollapsed()), isExpanded && this.renderFooter()), (0, _emotion.jsx)(_CopyMoveBankEntryModal["default"], {
-        createEntry: this.createEntryForBank,
-        label: this.moveModalTitle(),
-        sourceBankId: this.props.bank.id,
-        sourceBankEntryId: this.props.bankEntry.id,
-        entryId: this.props.bankEntry.entry.get('id'),
-        entryType: this.props.bankEntry.entryType
-      }));
-    }
-  }]);
-}((0, _quizCommon.withI18nSupport)(_react.Component)), (0, _defineProperty2["default"])(_BankEntryRow, "displayName", 'BankEntryRow'), (0, _defineProperty2["default"])(_BankEntryRow, "componentId", "Quizzes".concat(_BankEntryRow.displayName)), (0, _defineProperty2["default"])(_BankEntryRow, "propTypes", {
-  activeQuizId: _propTypes["default"].string,
-  addEntryToQuiz: _propTypes["default"].func,
-  bankEntry: _reactImmutableProptypes["default"].record.isRequired,
-  bank: _reactImmutableProptypes["default"].record.isRequired,
-  clearUi: _propTypes["default"].func.isRequired,
-  createItem: _propTypes["default"].func.isRequired,
-  createStimulus: _propTypes["default"].func.isRequired,
-  isQuizContentLocked: _propTypes["default"].bool.isRequired,
-  isExpanded: _propTypes["default"].bool,
-  navigateToBankEntry: _propTypes["default"].func.isRequired,
-  openModal: _propTypes["default"].func.isRequired,
-  position: _propTypes["default"].number,
-  removeBankEntry: _propTypes["default"].func.isRequired,
-  screenreaderNotification: _propTypes["default"].func.isRequired,
-  setEditButtonFocus: _propTypes["default"].bool,
-  setUi: _propTypes["default"].func.isRequired,
-  stimulusId: _propTypes["default"].string,
-  tagAssociations: _reactImmutableProptypes["default"].listOf(_reactImmutableProptypes["default"].map),
-  useBankTags: _propTypes["default"].bool.isRequired,
-  toggleExpanded: _propTypes["default"].func.isRequired,
-  withConfirm: _propTypes["default"].func.isRequired,
-  locale: _propTypes["default"].string,
-  timezone: _propTypes["default"].string,
-  styles: _propTypes["default"].object
-}), (0, _defineProperty2["default"])(_BankEntryRow, "defaultProps", {
-  activeQuizId: null,
-  addEntryToQuiz: null,
-  stimulusId: null,
-  isQuizContentLocked: false,
-  isExpanded: false,
-  position: 0,
-  setEditButtonFocus: false,
-  tagAssociations: _immutable["default"].List(),
-  locale: null,
-  timezone: null
-}), (0, _defineProperty2["default"])(_BankEntryRow, "contextTypes", {
-  locale: _propTypes["default"].string,
-  timezone: _propTypes["default"].string
-}), _BankEntryRow)) || _class);
-var _default = exports["default"] = BankEntryRow;
+        {
+            key: "getEntry",
+            value: function getEntry() {
+                return this.props.bankEntry.getEntry();
+            }
+        },
+        {
+            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: "type",
+            value: function type() {
+                if (this.isStimulusEntry()) {
+                    return t('Stimulus');
+                }
+                if (this.isPassageEntry()) {
+                    return t('Text Block');
+                }
+                return t('Question');
+            }
+        },
+        {
+            key: "entryIdentifier",
+            value: function entryIdentifier() {
+                var title = this.getEntry().title;
+                if (this.isStimulusEntry()) {
+                    return t('Stimulus { title }', {
+                        title: title
+                    });
+                }
+                if (this.isPassageEntry()) {
+                    return t('Text Block { title }', {
+                        title: title
+                    });
+                }
+                return t('Question { itemBody }', {
+                    itemBody: extractTextFromHtml(title)
+                });
+            }
+        },
+        {
+            key: "getDeletePreface",
+            value: function getDeletePreface() {
+                if (this.isStimulusEntry()) {
+                    return t('Deleting this stimulus:');
+                }
+                if (this.isPassageEntry()) {
+                    return t('Deleting this text block:');
+                }
+                return t('Deleting this question:');
+            }
+        },
+        {
+            key: "moveModalTitle",
+            value: function moveModalTitle() {
+                return t('Copy / Move {type}', {
+                    type: this.type()
+                });
+            }
+        },
+        {
+            key: "renderExpandButton",
+            value: function renderExpandButton() {
+                var type = this.type();
+                var title = this.props.isExpanded ? t('Collapse {type} details', {
+                    type: type
+                }) : t('Expand {type} details', {
+                    type: type
+                });
+                return /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.expandButtonContainer
+                }, /*#__PURE__*/ jsx(ExpandButton, {
+                    onClick: this.props.toggleExpanded,
+                    title: title,
+                    isExpanded: this.props.isExpanded,
+                    "data-automation": "expand-bank-question-button"
+                }));
+            }
+        },
+        {
+            key: "renderAddButton",
+            value: function renderAddButton() {
+                if (!this.props.isQuizContentLocked && this.props.addEntryToQuiz) {
+                    var title = t('Add {type} to this quiz', {
+                        type: this.type()
+                    });
+                    return /*#__PURE__*/ jsx("div", {
+                        css: [
+                            this.props.styles.buttons,
+                            this.props.styles.addButton
+                        ]
+                    }, /*#__PURE__*/ jsx(IconButton, {
+                        color: "primary",
+                        shape: "circle",
+                        size: "small",
+                        onClick: this.addToQuiz,
+                        "data-automation": "sdk-add-bank-entry-button",
+                        disabled: this.props.bankEntry.isStimulus && this.props.stimulusId !== null,
+                        renderIcon: IconPlusLine,
+                        title: title,
+                        screenReaderLabel: title
+                    }));
+                }
+                // This empty div is necessary for spacing
+                return /*#__PURE__*/ jsx("div", null);
+            }
+        },
+        {
+            key: "renderMoveButton",
+            value: function renderMoveButton() {
+                var title = this.moveModalTitle();
+                return /*#__PURE__*/ jsx(IconButton, {
+                    ref: this.storeCopyMoveBankEntryButtonRef,
+                    size: "medium",
+                    withBackground: false,
+                    withBorder: false,
+                    onClick: this.openCopyMoveBankEntryModal,
+                    "data-automation": "sdk-copy-move-bank-entry-button",
+                    renderIcon: IconCopyLine,
+                    title: title,
+                    screenReaderLabel: title
+                });
+            }
+        },
+        {
+            key: "entryHeader",
+            value: function entryHeader() {
+                var entry = this.getEntry();
+                if (this.isItemEntry()) {
+                    return entry.getInteractionType().name;
+                } else {
+                    return entry.isPassage ? t('Text Block') : t('Stimulus');
+                }
+            }
+        },
+        {
+            key: "renderHeader",
+            value: function renderHeader() {
+                return /*#__PURE__*/ jsx("div", null, /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.headerRow
+                }, this.renderAddButton(), /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.buttons
+                }, this.props.bank.canEdit() && /*#__PURE__*/ jsx(React.Fragment, null, this.renderEditButton(), this.renderMoveButton(), this.renderTrashButton()), this.renderExpandButton())), /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.headerText
+                }, /*#__PURE__*/ jsx(Heading, {
+                    level: "reset",
+                    as: "h2"
+                }, t('{entryHeader} | {entryIdentifier}', {
+                    entryHeader: this.entryHeader(),
+                    entryIdentifier: this.entryIdentifier()
+                }))));
+            }
+        },
+        {
+            key: "renderEntryCollapsed",
+            value: function renderEntryCollapsed() {
+                var itemOrStimulus = this.getEntry();
+                // render item's body as html
+                // or title plain text
+                if (itemOrStimulus.itemBody) {
+                    return /*#__PURE__*/ jsx(RichContentRenderer, {
+                        customStyles: this.props.styles.stem,
+                        content: itemOrStimulus.itemBody
+                    });
+                } else {
+                    return /*#__PURE__*/ jsx("div", {
+                        css: this.props.styles.stem
+                    }, itemOrStimulus.title);
+                }
+            }
+        },
+        {
+            key: "renderEntryExpanded",
+            value: function renderEntryExpanded() {
+                var entry = this.getEntry();
+                if (this.isItemEntry()) {
+                    return /*#__PURE__*/ jsx(ItemShow, {
+                        entry: entry,
+                        guid: this.props.bankEntry.id
+                    });
+                } else {
+                    return /*#__PURE__*/ jsx(StimulusShowInfo, {
+                        stimulus: entry
+                    });
+                }
+            }
+        },
+        {
+            key: "renderEditButton",
+            value: function renderEditButton() {
+                var title = t('Edit {type}', {
+                    type: this.type()
+                });
+                return /*#__PURE__*/ jsx(IconButton, {
+                    ref: this.storeEditButtonRef,
+                    size: "medium",
+                    withBackground: false,
+                    withBorder: false,
+                    onClick: this.navigateToBankEntry,
+                    "data-automation": "sdk-edit-bank-entry-button",
+                    renderIcon: IconEditLine,
+                    title: title,
+                    screenReaderLabel: title
+                });
+            }
+        },
+        {
+            key: "renderTags",
+            value: function renderTags() {
+                if (!this.props.useBankTags) {
+                    return null;
+                }
+                return /*#__PURE__*/ jsx(TagDisplay, {
+                    tagAssociations: this.props.tagAssociations
+                });
+            }
+        },
+        {
+            key: "renderFooter",
+            value: function renderFooter() {
+                var lastUpdate = t.rich('<0>Last Update</0> { updatedAt }', {
+                    0: function(param) {
+                        var children = param.children;
+                        return /*#__PURE__*/ jsx(Text, {
+                            key: "lastUpdate",
+                            weight: "bold",
+                            color: "primary"
+                        }, children);
+                    },
+                    updatedAt: this.formatDatetimeMedium(this.props.bankEntry.get('updatedAt'))
+                });
+                return /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.footer
+                }, /*#__PURE__*/ jsx("span", null, lastUpdate), this.renderTags());
+            }
+        },
+        {
+            key: "render",
+            value: function render() {
+                var isExpanded = this.props.isExpanded;
+                return /*#__PURE__*/ jsx(Overlay, {
+                    onClick: this.props.toggleExpanded,
+                    tabIndex: "-1",
+                    ariaLabel: this.entryIdentifier()
+                }, /*#__PURE__*/ jsx("div", {
+                    role: "group"
+                }, /*#__PURE__*/ jsx("div", {
+                    css: this.props.styles.entryDetail,
+                    "data-automation": "sdk-bankEntryItem"
+                }, this.renderHeader(), isExpanded ? this.renderEntryExpanded() : this.renderEntryCollapsed()), isExpanded && this.renderFooter()), /*#__PURE__*/ jsx(CopyMoveBankEntryModal, {
+                    createEntry: this.createEntryForBank,
+                    label: this.moveModalTitle(),
+                    sourceBankId: this.props.bank.id,
+                    sourceBankEntryId: this.props.bankEntry.id,
+                    entryId: this.props.bankEntry.entry.get('id'),
+                    entryType: this.props.bankEntry.entryType
+                }));
+            }
+        }
+    ]);
+    return BankEntryRow;
+}(_withI18nSupport = withI18nSupport(Component));
+_define_property(BankEntryRow, "displayName", 'BankEntryRow');
+_define_property(BankEntryRow, "componentId", "Quizzes".concat(BankEntryRow.displayName));
+_define_property(BankEntryRow, "propTypes", {
+    activeQuizId: PropTypes.string,
+    addEntryToQuiz: PropTypes.func,
+    bankEntry: ImmutablePropTypes.record.isRequired,
+    bank: ImmutablePropTypes.record.isRequired,
+    clearUi: PropTypes.func.isRequired,
+    createItem: PropTypes.func.isRequired,
+    createStimulus: PropTypes.func.isRequired,
+    isQuizContentLocked: PropTypes.bool.isRequired,
+    isExpanded: PropTypes.bool,
+    navigateToBankEntry: PropTypes.func.isRequired,
+    openModal: PropTypes.func.isRequired,
+    position: PropTypes.number,
+    removeBankEntry: PropTypes.func.isRequired,
+    screenreaderNotification: PropTypes.func.isRequired,
+    setEditButtonFocus: PropTypes.bool,
+    setUi: PropTypes.func.isRequired,
+    stimulusId: PropTypes.string,
+    tagAssociations: ImmutablePropTypes.listOf(ImmutablePropTypes.map),
+    useBankTags: PropTypes.bool.isRequired,
+    toggleExpanded: PropTypes.func.isRequired,
+    withConfirm: PropTypes.func.isRequired,
+    locale: PropTypes.string,
+    timezone: PropTypes.string,
+    styles: PropTypes.object
+});
+_define_property(BankEntryRow, "defaultProps", {
+    activeQuizId: null,
+    addEntryToQuiz: null,
+    stimulusId: null,
+    isQuizContentLocked: false,
+    isExpanded: false,
+    position: 0,
+    setEditButtonFocus: false,
+    tagAssociations: Immutable.List(),
+    locale: null,
+    timezone: null
+});
+_define_property(BankEntryRow, "contextTypes", {
+    locale: PropTypes.string,
+    timezone: PropTypes.string
+});
+BankEntryRow = _ts_decorate([
+    withStyleOverrides(generateStyle, generateComponentTheme)
+], BankEntryRow);
+export default BankEntryRow;