@instructure/quiz-core 22.10.1 → 22.11.0

package/es/common/components/resources/quiz/AddContent/Body/presenter.js

@@ -1,143 +1,137 @@
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-var _dec, _class, _AddContentBody;
-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;
-    }
-  }
-  derived = _getPrototypeOf(derived);
-  return _possibleConstructorReturn(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], _getPrototypeOf(_this).constructor) : derived.apply(_this, args));
-}
 /** @jsx jsx */
-import { Component } from 'react';
-import PropTypes from 'prop-types';
-import ImmutablePropTypes from 'react-immutable-proptypes';
-import first from 'lodash/first';
-import { IconBankLine } from '@instructure/ui-icons';
-import { IconButton } from '@instructure/ui-buttons';
+import { jsx } from '@instructure/emotion';
+import { BUILD_TRAY_OPEN, BUILD_TRAY_POSITION, BUILD_TRAY_STIMULUS_ID, withStyleOverrides } from '@instructure/quiz-common';
+import t from '@instructure/quiz-i18n/es/format-message';
+import { Button, IconButton } from '@instructure/ui-buttons';
 import { Grid } from '@instructure/ui-grid';
-import { View } from '@instructure/ui-view';
+import { IconAiSolid, IconBankLine } from '@instructure/ui-icons';
 import { Text } from '@instructure/ui-text';
-import { jsx } from '@instructure/emotion';
+import { View } from '@instructure/ui-view';
+import first from 'lodash/first';
+import PropTypes from 'prop-types';
+import React, { useCallback } from 'react';
+import ImmutablePropTypes from 'react-immutable-proptypes';
 import InteractionTypes from '../../../../shared/InteractionTypes';
-import t from '@instructure/quiz-i18n/es/format-message';
-import { BUILD_TRAY_OPEN, BUILD_TRAY_POSITION, BUILD_TRAY_STIMULUS_ID, withStyleOverrides } from '@instructure/quiz-common';
 import generateStyle from './styles';
 import generateComponentTheme from './theme';
-export var AddContentBody = (_dec = withStyleOverrides(generateStyle, generateComponentTheme), _dec(_class = (_AddContentBody = /*#__PURE__*/function (_Component) {
-  function AddContentBody() {
-    var _this2;
-    _classCallCheck(this, AddContentBody);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
+function UnstyledAddContentBody(_ref) {
+  var allowStimulusCreation = _ref.allowStimulusCreation,
+    createItem = _ref.createItem,
+    createStimulus = _ref.createStimulus,
+    editingQuizEntry = _ref.editingQuizEntry,
+    interactionTypes = _ref.interactionTypes,
+    _ref$onOpenBankTray = _ref.onOpenBankTray,
+    onOpenBankTray = _ref$onOpenBankTray === void 0 ? function () {} : _ref$onOpenBankTray,
+    _ref$onAddItem = _ref.onAddItem,
+    onAddItem = _ref$onAddItem === void 0 ? function () {} : _ref$onAddItem,
+    parentEntryId = _ref.parentEntryId,
+    position = _ref.position,
+    quizEntryWithErrorsShowing = _ref.quizEntryWithErrorsShowing,
+    quizId = _ref.quizId,
+    screenreaderNotification = _ref.screenreaderNotification,
+    setNextQuizEntry = _ref.setNextQuizEntry,
+    setUi = _ref.setUi,
+    _ref$showHeaderText = _ref.showHeaderText,
+    showHeaderText = _ref$showHeaderText === void 0 ? true : _ref$showHeaderText,
+    stimulusId = _ref.stimulusId,
+    styles = _ref.styles,
+    _ref$slotProps = _ref.slotProps,
+    slotProps = _ref$slotProps === void 0 ? {} : _ref$slotProps;
+  var openBankTray = useCallback(function () {
+    onOpenBankTray();
+    setUi(BUILD_TRAY_OPEN, true);
+    setUi(BUILD_TRAY_POSITION, position);
+    setUi(BUILD_TRAY_STIMULUS_ID, parentEntryId);
+  }, [onOpenBankTray, setUi, position, parentEntryId]);
+  var addStimulus = useCallback(function (isPassage) {
+    if (editingQuizEntry) {
+      setNextQuizEntry(null, quizId, position);
+    } else {
+      createStimulus(quizId, position, isPassage);
     }
-    _this2 = _callSuper(this, AddContentBody, [].concat(args));
-    // ==============================
-    // ACTIONS
-    // ==============================
-    _defineProperty(_this2, "openBankTray", function () {
-      _this2.props.onOpenBankTray();
-      _this2.props.setUi(BUILD_TRAY_OPEN, true);
-      _this2.props.setUi(BUILD_TRAY_POSITION, _this2.props.position);
-      _this2.props.setUi(BUILD_TRAY_STIMULUS_ID, _this2.props.parentEntryId);
-    });
-    _defineProperty(_this2, "addStimulus", function (isPassage) {
-      if (_this2.props.editingQuizEntry) {
-        _this2.props.setNextQuizEntry(null, _this2.props.quizId, _this2.props.position);
-      } else {
-        _this2.props.createStimulus(_this2.props.quizId, _this2.props.position, isPassage);
-      }
-      _this2.props.onAddItem();
-    });
-    _defineProperty(_this2, "addItem", function (interactionTypeData) {
-      if (_this2.props.quizEntryWithErrorsShowing) {
-        _this2.props.screenreaderNotification(t('Question {itemPosition, number} cannot be saved due to invalid input data', {
-          itemPosition: Math.ceil(_this2.props.quizEntryWithErrorsShowing.position)
-        }));
+    onAddItem();
+  }, [editingQuizEntry, setNextQuizEntry, quizId, position, createStimulus, onAddItem]);
+  var addItem = useCallback(function (interactionTypeData) {
+    if (quizEntryWithErrorsShowing) {
+      screenreaderNotification(t('Question {itemPosition, number} cannot be saved due to invalid input data', {
+        itemPosition: Math.ceil(quizEntryWithErrorsShowing.position)
+      }));
+    } else {
+      if (editingQuizEntry) {
+        setNextQuizEntry(interactionTypeData, quizId, position, stimulusId, parentEntryId);
       } else {
-        var _this2$props = _this2.props,
-          quizId = _this2$props.quizId,
-          position = _this2$props.position,
-          stimulusId = _this2$props.stimulusId,
-          parentEntryId = _this2$props.parentEntryId;
-        if (_this2.props.editingQuizEntry) {
-          _this2.props.setNextQuizEntry(interactionTypeData, quizId, position, stimulusId, parentEntryId);
-        } else {
-          var defaultInteractionData = interactionTypeData.getDefaultInteractionData();
-          var scoringData = interactionTypeData.getDefaultScoringData(defaultInteractionData);
-          _this2.props.createItem(quizId, position, {
-            id: interactionTypeData.id,
-            interactionData: defaultInteractionData,
-            itemBody: interactionTypeData.itemBody,
-            properties: interactionTypeData.defaultProperties,
-            scoringAlgorithm: interactionTypeData.scoringAlgorithmDefault,
-            scoringData: scoringData,
-            userResponseType: first(interactionTypeData.userResponseTypeOptions)
-          }, parentEntryId, stimulusId);
-        }
+        var defaultInteractionData = interactionTypeData.getDefaultInteractionData();
+        var scoringData = interactionTypeData.getDefaultScoringData(defaultInteractionData);
+        createItem(quizId, position, {
+          id: interactionTypeData.id,
+          interactionData: defaultInteractionData,
+          itemBody: interactionTypeData.itemBody,
+          properties: interactionTypeData.defaultProperties,
+          scoringAlgorithm: interactionTypeData.scoringAlgorithmDefault,
+          scoringData: scoringData,
+          userResponseType: first(interactionTypeData.userResponseTypeOptions)
+        }, parentEntryId, stimulusId);
       }
-      _this2.props.onAddItem();
-    });
-    // ==============================
-    // RENDERING
-    // ==============================
-    _defineProperty(_this2, "renderBankButton", function () {
-      return jsx(IconButton, {
-        size: "large",
-        onClick: _this2.openBankTray,
-        "data-automation": "sdk-add-banked-content-button",
-        screenReaderLabel: t('Add banked content')
-      }, jsx(IconBankLine, null));
-    });
-    _defineProperty(_this2, "renderPopoverHeader", function () {
-      var text = _this2.props.showHeaderText ? t('Insert Content') : '';
-      return jsx("div", {
-        css: _this2.props.styles.popoverHeaderBox
-      }, jsx("div", {
-        css: _this2.props.styles.popoverHeader
-      }, jsx(Grid, {
-        vAlign: "middle",
-        colSpacing: "none",
-        rowSpacing: "none"
-      }, jsx(Grid.Row, null, jsx(Grid.Col, null, jsx(Text, {
-        color: "primary"
-      }, text)), jsx(Grid.Col, {
-        width: "auto"
-      }, _this2.renderBankButton())))));
-    });
-    return _this2;
-  }
-  _inherits(AddContentBody, _Component);
-  return _createClass(AddContentBody, [{
-    key: "render",
-    value: function render() {
-      return jsx("div", {
-        css: this.props.styles.popoverContent,
-        role: "dialog",
-        "aria-label": t('Insert Content')
-      }, this.renderPopoverHeader(), jsx(View, {
-        padding: "small"
-      }, jsx(InteractionTypes, {
-        columns: 2,
-        addItem: this.addItem,
-        addStimulus: this.addStimulus,
-        allowStimulusCreation: this.props.allowStimulusCreation,
-        types: this.props.interactionTypes
-      })));
     }
-  }]);
-}(Component), _defineProperty(_AddContentBody, "displayName", 'AddContentBody'), _defineProperty(_AddContentBody, "componentId", "Quizzes".concat(_AddContentBody.displayName)), _defineProperty(_AddContentBody, "propTypes", {
+    onAddItem();
+  }, [quizEntryWithErrorsShowing, screenreaderNotification, editingQuizEntry, setNextQuizEntry, quizId, position, stimulusId, parentEntryId, createItem, onAddItem]);
+  var renderBankButton = function renderBankButton() {
+    return jsx(IconButton, {
+      size: "large",
+      onClick: openBankTray,
+      "data-automation": "sdk-add-banked-content-button",
+      screenReaderLabel: t('Add banked content')
+    }, jsx(IconBankLine, null));
+  };
+  var renderPopoverHeader = function renderPopoverHeader() {
+    var _slotProps$quizGenera, _slotProps$quizGenera2, _slotProps$quizGenera3;
+    var text = showHeaderText ? t('Insert Content') : '';
+    return jsx("div", {
+      css: styles.popoverHeaderBox
+    }, jsx("div", {
+      css: styles.popoverHeader
+    }, jsx(Grid, {
+      vAlign: "middle",
+      colSpacing: "none",
+      rowSpacing: "none"
+    }, jsx(Grid.Row, null, jsx(Grid.Col, null, jsx(Text, {
+      color: "primary"
+    }, text)), jsx(Grid.Col, {
+      width: "auto"
+    }, renderBankButton())))), ((_slotProps$quizGenera = slotProps.quizGenerationButton) === null || _slotProps$quizGenera === void 0 ? void 0 : _slotProps$quizGenera.visible) && jsx(View, {
+      as: "div",
+      padding: "x-small 0 small"
+    }, jsx(Button, {
+      color: "ai-primary",
+      display: "block",
+      renderIcon: IconAiSolid,
+      onClick: (_slotProps$quizGenera2 = slotProps.quizGenerationButton) === null || _slotProps$quizGenera2 === void 0 ? void 0 : _slotProps$quizGenera2.onClick,
+      disabled: (_slotProps$quizGenera3 = slotProps.quizGenerationButton) === null || _slotProps$quizGenera3 === void 0 ? void 0 : _slotProps$quizGenera3.disabled
+    }, t('Generate with AI'))));
+  };
+  return jsx("div", {
+    css: styles.popoverContent,
+    role: "dialog",
+    "aria-label": t('Insert Content')
+  }, renderPopoverHeader(), jsx(View, {
+    padding: "small"
+  }, jsx(InteractionTypes, {
+    columns: 2,
+    addItem: addItem,
+    addStimulus: addStimulus,
+    allowStimulusCreation: allowStimulusCreation,
+    types: interactionTypes
+  })));
+}
+export var AddContentBody = withStyleOverrides(generateStyle, generateComponentTheme)(UnstyledAddContentBody);
+export var quizGenerationButtonPropTypes = PropTypes.shape({
+  onClick: PropTypes.func.isRequired,
+  visible: PropTypes.bool,
+  disabled: PropTypes.bool
+});
+AddContentBody.displayName = 'AddContentBody';
+AddContentBody.componentId = "Quizzes".concat(AddContentBody.displayName);
+AddContentBody.propTypes = {
   allowStimulusCreation: PropTypes.bool.isRequired,
   createItem: PropTypes.func.isRequired,
   createStimulus: PropTypes.func.isRequired,
@@ -154,15 +148,9 @@ export var AddContentBody = (_dec = withStyleOverrides(generateStyle, generateCo
   setUi: PropTypes.func.isRequired,
   showHeaderText: PropTypes.bool,
   stimulusId: PropTypes.string,
-  styles: PropTypes.object
-}), _defineProperty(_AddContentBody, "defaultProps", {
-  editingQuizEntry: void 0,
-  interactionTypes: void 0,
-  onAddItem: Function.prototype,
-  parentEntryId: void 0,
-  onOpenBankTray: Function.prototype,
-  quizEntryWithErrorsShowing: void 0,
-  showHeaderText: true,
-  stimulusId: void 0
-}), _AddContentBody)) || _class);
+  styles: PropTypes.object,
+  slotProps: PropTypes.shape({
+    quizGenerationButton: quizGenerationButtonPropTypes
+  })
+};
 export default AddContentBody;

package/es/common/components/resources/quiz/AddContent/Popover/presenter.js

@@ -1,125 +1,135 @@
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-var _dec, _class, _AddContentPopover;
-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;
-    }
-  }
-  derived = _getPrototypeOf(derived);
-  return _possibleConstructorReturn(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], _getPrototypeOf(_this).constructor) : derived.apply(_this, args));
-}
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 /** @jsx jsx */
-import { Component } from 'react';
-import PropTypes from 'prop-types';
-import { Popover } from '@instructure/ui-popover';
 import { jsx } from '@instructure/emotion';
+import { DELETED_QUIZ_ENTRY, withStyleOverrides } from '@instructure/quiz-common';
+import { Popover } from '@instructure/ui-popover';
+import PropTypes from 'prop-types';
+import React, { useCallback, useEffect, useRef } from 'react';
+import { bindActionCreators } from 'redux';
+import { createBulkItems } from '../../../../../../building/api/items';
+import { createBulkQuizEntries } from '../../../../../../building/api/quizEntries';
+import { addAlert } from '../../../../../../common/actions/alerts';
+import { connect } from '../../../../../../common/react-redux';
 import CustomPropTypes from '../../../../../util/CustomPropTypes';
 import { onPhone, onTablet } from '../../../../../util/windowChecks';
-import AddContentButton from '../Button';
 import AddContentBody from '../Body';
-import { DELETED_QUIZ_ENTRY, withStyleOverrides } from '@instructure/quiz-common';
+import AddContentButton from '../Button';
 import generateStyle from './styles';
 import generateComponentTheme from './theme';
-export var AddContentPopover = (_dec = withStyleOverrides(generateStyle, generateComponentTheme), _dec(_class = (_AddContentPopover = /*#__PURE__*/function (_Component) {
-  function AddContentPopover() {
-    var _this2;
-    _classCallCheck(this, AddContentPopover);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
+import { quizGenerationButtonPropTypes } from '../Body/presenter';
+function UnstyledAddContentPopover(_ref) {
+  var _ref$allowStimulusCre = _ref.allowStimulusCreation,
+    allowStimulusCreation = _ref$allowStimulusCre === void 0 ? true : _ref$allowStimulusCre,
+    clearUi = _ref.clearUi,
+    isEditing = _ref.isEditing,
+    _ref$isMobile = _ref.isMobile,
+    isMobile = _ref$isMobile === void 0 ? onPhone() || onTablet() : _ref$isMobile,
+    openAddContentModal = _ref.openAddContentModal,
+    _ref$parentEntryId = _ref.parentEntryId,
+    parentEntryId = _ref$parentEntryId === void 0 ? null : _ref$parentEntryId,
+    position = _ref.position,
+    quizId = _ref.quizId,
+    shouldFocus = _ref.shouldFocus,
+    _ref$stimulusId = _ref.stimulusId,
+    stimulusId = _ref$stimulusId === void 0 ? null : _ref$stimulusId,
+    switchOffEditing = _ref.switchOffEditing,
+    switchOnEditing = _ref.switchOnEditing,
+    _ref$useStimulusTrigg = _ref.useStimulusTrigger,
+    useStimulusTrigger = _ref$useStimulusTrigg === void 0 ? false : _ref$useStimulusTrigg,
+    styles = _ref.styles,
+    _ref$slotProps = _ref.slotProps,
+    slotProps = _ref$slotProps === void 0 ? {} : _ref$slotProps;
+  var popoverTrigger = useRef(null);
+  useEffect(function () {
+    if (shouldFocus) {
+      setTimeout(function () {
+        if (popoverTrigger.current) popoverTrigger.current.focus();
+        clearUi(DELETED_QUIZ_ENTRY);
+      }, 100);
     }
-    _this2 = _callSuper(this, AddContentPopover, [].concat(args));
-    _defineProperty(_this2, "showContent", function () {
-      _this2.props.switchOnEditing();
-    });
-    _defineProperty(_this2, "hideContent", function () {
-      _this2.props.switchOffEditing();
-    });
-    _defineProperty(_this2, "storePopoverTriggerRef", function (b) {
-      _this2.popoverTrigger = b;
-    });
-    _defineProperty(_this2, "renderPopoverButton", function () {
-      return jsx(Popover, {
-        on: "click",
-        onShowContent: _this2.showContent,
-        onHideContent: _this2.hideContent,
-        isShowingContent: _this2.props.isEditing,
-        shouldCloseOnEscape: true,
-        shouldContainFocus: true,
-        renderTrigger: _this2.renderAddContentButton()
-      }, jsx(AddContentBody, {
-        allowStimulusCreation: _this2.props.allowStimulusCreation,
-        onOpenBankTray: _this2.props.switchOffEditing,
-        onAddItem: _this2.props.switchOffEditing,
-        parentEntryId: _this2.props.parentEntryId,
-        position: _this2.props.position,
-        quizId: _this2.props.quizId,
-        stimulusId: _this2.props.stimulusId
-      }));
-    });
-    _defineProperty(_this2, "openAddContentModal", function () {
-      _this2.props.openAddContentModal({
-        allowStimulusCreation: _this2.props.allowStimulusCreation,
-        parentEntryId: _this2.props.parentEntryId,
-        position: _this2.props.position,
-        quizId: _this2.props.quizId,
-        stimulusId: _this2.props.stimulusId
-      });
-    });
-    return _this2;
+  }, [shouldFocus, clearUi]);
+  function handleGenerateWithAiClick() {
+    var _slotProps$quizGenera, _slotProps$quizGenera2;
+    slotProps === null || slotProps === void 0 || (_slotProps$quizGenera = slotProps.quizGenerationButton) === null || _slotProps$quizGenera === void 0 || (_slotProps$quizGenera2 = _slotProps$quizGenera.onClick) === null || _slotProps$quizGenera2 === void 0 || _slotProps$quizGenera2.call(_slotProps$quizGenera);
+    switchOffEditing();
   }
-  _inherits(AddContentPopover, _Component);
-  return _createClass(AddContentPopover, [{
-    key: "componentDidUpdate",
-    value: function componentDidUpdate() {
-      var _this3 = this;
-      if (this.props.shouldFocus) {
-        setTimeout(function () {
-          _this3.popoverTrigger && _this3.popoverTrigger.focus();
-          _this3.props.clearUi(DELETED_QUIZ_ENTRY);
-        }, 100); // force after modal attempt to refocus delete button
+  var showContent = useCallback(function () {
+    switchOnEditing();
+  }, [switchOnEditing]);
+  var hideContent = useCallback(function () {
+    switchOffEditing();
+  }, [switchOffEditing]);
+  var storePopoverTriggerRef = useCallback(function (b) {
+    popoverTrigger.current = b;
+  }, []);
+  var renderAddContentButton = function renderAddContentButton() {
+    var onClick = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
+    return jsx(AddContentButton, {
+      ref: storePopoverTriggerRef,
+      onClick: onClick,
+      isEditing: isEditing,
+      useStimulusTrigger: useStimulusTrigger
+    });
+  };
+  var renderPopoverButton = function renderPopoverButton() {
+    return jsx(Popover, {
+      on: "click",
+      onShowContent: showContent,
+      onHideContent: hideContent,
+      isShowingContent: isEditing,
+      shouldCloseOnEscape: true,
+      shouldContainFocus: true,
+      renderTrigger: renderAddContentButton()
+    }, jsx(AddContentBody, {
+      allowStimulusCreation: allowStimulusCreation,
+      onOpenBankTray: switchOffEditing,
+      onAddItem: switchOffEditing,
+      parentEntryId: parentEntryId,
+      position: position,
+      quizId: quizId,
+      stimulusId: stimulusId,
+      slotProps: {
+        quizGenerationButton: _objectSpread(_objectSpread({}, (slotProps === null || slotProps === void 0 ? void 0 : slotProps.quizGenerationButton) || {}), {}, {
+          onClick: handleGenerateWithAiClick
+        })
       }
-    }
-  }, {
-    key: "renderAddContentButton",
-    value: function renderAddContentButton() {
-      var onClick = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
-      return jsx(AddContentButton, {
-        ref: this.storePopoverTriggerRef,
-        onClick: onClick,
-        isEditing: this.props.isEditing,
-        useStimulusTrigger: this.props.useStimulusTrigger
-      });
-    }
-  }, {
-    key: "renderModalButton",
-    value: function renderModalButton() {
-      return this.renderAddContentButton(this.openAddContentModal);
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var borderLine = this.props.useStimulusTrigger ? null : jsx("div", {
-        css: this.props.styles.borderLine
-      });
-      var button = this.props.isMobile ? this.renderModalButton() : this.renderPopoverButton();
-      return jsx("div", {
-        css: this.props.styles.wrapper,
-        "data-automation": "sdk-build-add-content"
-      }, borderLine, button);
-    }
-  }]);
-}(Component), _defineProperty(_AddContentPopover, "displayName", 'AddContentPopover'), _defineProperty(_AddContentPopover, "componentId", "Quizzes".concat(_AddContentPopover.displayName)), _defineProperty(_AddContentPopover, "propTypes", {
+    }));
+  };
+  var openAddContentModalHandler = useCallback(function () {
+    openAddContentModal({
+      allowStimulusCreation: allowStimulusCreation,
+      parentEntryId: parentEntryId,
+      position: position,
+      quizId: quizId,
+      stimulusId: stimulusId
+    });
+  }, [openAddContentModal, allowStimulusCreation, parentEntryId, position, quizId, stimulusId]);
+  var renderModalButton = function renderModalButton() {
+    return renderAddContentButton(openAddContentModalHandler);
+  };
+  var borderLine = useStimulusTrigger ? null : jsx("div", {
+    css: styles.borderLine
+  });
+  var button = isMobile ? renderModalButton() : renderPopoverButton();
+  return jsx("div", {
+    css: styles.wrapper,
+    "data-automation": "sdk-build-add-content"
+  }, borderLine, button);
+}
+var AddContentPopoverWithStyles = withStyleOverrides(generateStyle, generateComponentTheme)(UnstyledAddContentPopover);
+var mapDispatchToProps = function mapDispatchToProps(dispatch) {
+  return {
+    addAlert: addAlert,
+    createBulkItems: bindActionCreators(createBulkItems, dispatch),
+    createBulkQuizEntries: bindActionCreators(createBulkQuizEntries, dispatch)
+  };
+};
+export var AddContentPopover = connect(null, mapDispatchToProps)(AddContentPopoverWithStyles);
+AddContentPopover.displayName = 'AddContentPopover';
+AddContentPopover.componentId = "Quizzes".concat(AddContentPopover.displayName);
+AddContentPopover.propTypes = {
   appContainer: CustomPropTypes.selectors.isRequired,
   allowStimulusCreation: PropTypes.bool,
   clearUi: PropTypes.func.isRequired,
@@ -134,12 +144,9 @@ export var AddContentPopover = (_dec = withStyleOverrides(generateStyle, generat
   switchOffEditing: PropTypes.func.isRequired,
   switchOnEditing: PropTypes.func.isRequired,
   useStimulusTrigger: PropTypes.bool,
-  styles: PropTypes.object
-}), _defineProperty(_AddContentPopover, "defaultProps", {
-  allowStimulusCreation: true,
-  isMobile: onPhone() || onTablet(),
-  parentEntryId: null,
-  stimulusId: null,
-  useStimulusTrigger: false
-}), _AddContentPopover)) || _class);
+  styles: PropTypes.object,
+  slotProps: PropTypes.shape({
+    quizGenerationButton: quizGenerationButtonPropTypes
+  })
+};
 export default AddContentPopover;

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

@@ -1,9 +1,6 @@
 import { connect } from '../../../react-redux';
 import InteractionTypes from './presenter';
-import { featureOn } from '../../../../common/util/featureCheck';
 function mapStateToProps(state) {
-  return {
-    allowPassageCreation: featureOn('passage')
-  };
+  return {};
 }
 export default connect(mapStateToProps)(InteractionTypes);

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

@@ -146,7 +146,7 @@ export var InteractionTypes = (_dec = withStyleOverrides(generateStyle, generate
         }, _this2.renderInteractionTypeButton({
           name: 'Stimulus',
           slug: 'stimulus'
-        })), _this2.props.allowPassageCreation && jsx(Grid.Col, {
+        })), jsx(Grid.Col, {
           width: 12 / _this2.props.columns,
           key: "passage"
         }, _this2.renderInteractionTypeButton({
@@ -174,12 +174,10 @@ export var InteractionTypes = (_dec = withStyleOverrides(generateStyle, generate
   addItem: PropTypes.func.isRequired,
   addStimulus: PropTypes.func.isRequired,
   allowStimulusCreation: PropTypes.bool,
-  allowPassageCreation: PropTypes.bool,
   types: ImmutablePropTypes.list,
   styles: PropTypes.object
 }), _defineProperty(_InteractionTypes, "defaultProps", {
   allowStimulusCreation: true,
-  allowPassageCreation: false,
   types: List()
 }), _InteractionTypes)) || _class);
 export default InteractionTypes;