@instructure/quiz-core 22.10.2 → 22.11.1-rc.88

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

@@ -4,147 +4,150 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.AddContentBody = 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 = require("react");
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));
-var _first = _interopRequireDefault(require("lodash/first"));
-var _uiIcons = require("@instructure/ui-icons");
+exports.quizGenerationButtonPropTypes = exports["default"] = exports.AddContentBody = void 0;
+var _emotion = require("@instructure/emotion");
+var _quizCommon = require("@instructure/quiz-common");
+var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/format-message"));
 var _uiButtons = require("@instructure/ui-buttons");
 var _uiGrid = require("@instructure/ui-grid");
-var _uiView = require("@instructure/ui-view");
+var _uiIcons = require("@instructure/ui-icons");
 var _uiText = require("@instructure/ui-text");
-var _emotion = require("@instructure/emotion");
+var _uiView = require("@instructure/ui-view");
+var _first = _interopRequireDefault(require("lodash/first"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react = _interopRequireWildcard(require("react"));
+var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));
 var _InteractionTypes = _interopRequireDefault(require("../../../../shared/InteractionTypes"));
-var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
-var _quizCommon = require("@instructure/quiz-common");
 var _styles = _interopRequireDefault(require("./styles"));
 var _theme = _interopRequireDefault(require("./theme"));
-var _dec, _class, _AddContentBody;
+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; }
 /** @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;
-    }
-  }
-  derived = (0, _getPrototypeOf2["default"])(derived);
-  return (0, _possibleConstructorReturn2["default"])(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], (0, _getPrototypeOf2["default"])(_this).constructor) : derived.apply(_this, args));
-}
-var AddContentBody = exports.AddContentBody = (_dec = (0, _quizCommon.withStyleOverrides)(_styles["default"], _theme["default"]), _dec(_class = (_AddContentBody = /*#__PURE__*/function (_Component) {
-  function AddContentBody() {
-    var _this2;
-    (0, _classCallCheck2["default"])(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,
+    _ref$containerType = _ref.containerType,
+    containerType = _ref$containerType === void 0 ? 'popover' : _ref$containerType;
+  var openBankTray = (0, _react.useCallback)(function () {
+    onOpenBankTray();
+    setUi(_quizCommon.BUILD_TRAY_OPEN, true);
+    setUi(_quizCommon.BUILD_TRAY_POSITION, position);
+    setUi(_quizCommon.BUILD_TRAY_STIMULUS_ID, parentEntryId);
+  }, [onOpenBankTray, setUi, position, parentEntryId]);
+  var addStimulus = (0, _react.useCallback)(function (isPassage) {
+    if (editingQuizEntry) {
+      setNextQuizEntry(null, quizId, position);
+    } else {
+      createStimulus(quizId, position, isPassage);
     }
-    _this2 = _callSuper(this, AddContentBody, [].concat(args));
-    // ==============================
-    // ACTIONS
-    // ==============================
-    (0, _defineProperty2["default"])(_this2, "openBankTray", function () {
-      _this2.props.onOpenBankTray();
-      _this2.props.setUi(_quizCommon.BUILD_TRAY_OPEN, true);
-      _this2.props.setUi(_quizCommon.BUILD_TRAY_POSITION, _this2.props.position);
-      _this2.props.setUi(_quizCommon.BUILD_TRAY_STIMULUS_ID, _this2.props.parentEntryId);
-    });
-    (0, _defineProperty2["default"])(_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();
-    });
-    (0, _defineProperty2["default"])(_this2, "addItem", function (interactionTypeData) {
-      if (_this2.props.quizEntryWithErrorsShowing) {
-        _this2.props.screenreaderNotification((0, _formatMessage["default"])('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 = (0, _react.useCallback)(function (interactionTypeData) {
+    if (quizEntryWithErrorsShowing) {
+      screenreaderNotification((0, _formatMessage["default"])('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: (0, _first["default"])(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: (0, _first["default"])(interactionTypeData.userResponseTypeOptions)
+        }, parentEntryId, stimulusId);
       }
-      _this2.props.onAddItem();
-    });
-    // ==============================
-    // RENDERING
-    // ==============================
-    (0, _defineProperty2["default"])(_this2, "renderBankButton", function () {
-      return (0, _emotion.jsx)(_uiButtons.IconButton, {
-        size: "large",
-        onClick: _this2.openBankTray,
-        "data-automation": "sdk-add-banked-content-button",
-        screenReaderLabel: (0, _formatMessage["default"])('Add banked content')
-      }, (0, _emotion.jsx)(_uiIcons.IconBankLine, null));
-    });
-    (0, _defineProperty2["default"])(_this2, "renderPopoverHeader", function () {
-      var text = _this2.props.showHeaderText ? (0, _formatMessage["default"])('Insert Content') : '';
-      return (0, _emotion.jsx)("div", {
-        css: _this2.props.styles.popoverHeaderBox
-      }, (0, _emotion.jsx)("div", {
-        css: _this2.props.styles.popoverHeader
-      }, (0, _emotion.jsx)(_uiGrid.Grid, {
-        vAlign: "middle",
-        colSpacing: "none",
-        rowSpacing: "none"
-      }, (0, _emotion.jsx)(_uiGrid.Grid.Row, null, (0, _emotion.jsx)(_uiGrid.Grid.Col, null, (0, _emotion.jsx)(_uiText.Text, {
-        color: "primary"
-      }, text)), (0, _emotion.jsx)(_uiGrid.Grid.Col, {
-        width: "auto"
-      }, _this2.renderBankButton())))));
-    });
-    return _this2;
-  }
-  (0, _inherits2["default"])(AddContentBody, _Component);
-  return (0, _createClass2["default"])(AddContentBody, [{
-    key: "render",
-    value: function render() {
-      return (0, _emotion.jsx)("div", {
-        css: this.props.styles.popoverContent,
-        role: "dialog",
-        "aria-label": (0, _formatMessage["default"])('Insert Content')
-      }, this.renderPopoverHeader(), (0, _emotion.jsx)(_uiView.View, {
-        padding: "small"
-      }, (0, _emotion.jsx)(_InteractionTypes["default"], {
-        columns: 2,
-        addItem: this.addItem,
-        addStimulus: this.addStimulus,
-        allowStimulusCreation: this.props.allowStimulusCreation,
-        types: this.props.interactionTypes
-      })));
     }
-  }]);
-}(_react.Component), (0, _defineProperty2["default"])(_AddContentBody, "displayName", 'AddContentBody'), (0, _defineProperty2["default"])(_AddContentBody, "componentId", "Quizzes".concat(_AddContentBody.displayName)), (0, _defineProperty2["default"])(_AddContentBody, "propTypes", {
+    onAddItem();
+  }, [quizEntryWithErrorsShowing, screenreaderNotification, editingQuizEntry, setNextQuizEntry, quizId, position, stimulusId, parentEntryId, createItem, onAddItem]);
+  var renderBankButton = function renderBankButton() {
+    return (0, _emotion.jsx)(_uiButtons.IconButton, {
+      size: "large",
+      onClick: openBankTray,
+      "data-automation": "sdk-add-banked-content-button",
+      screenReaderLabel: (0, _formatMessage["default"])('Add banked content')
+    }, (0, _emotion.jsx)(_uiIcons.IconBankLine, null));
+  };
+  var renderPopoverHeader = function renderPopoverHeader() {
+    var _slotProps$quizGenera, _slotProps$quizGenera2, _slotProps$quizGenera3;
+    var text = showHeaderText ? (0, _formatMessage["default"])('Insert Content') : '';
+    return (0, _emotion.jsx)("div", {
+      css: styles.popoverHeaderBox
+    }, (0, _emotion.jsx)("div", {
+      css: styles.popoverHeader
+    }, (0, _emotion.jsx)(_uiGrid.Grid, {
+      vAlign: "middle",
+      colSpacing: "none",
+      rowSpacing: "none"
+    }, (0, _emotion.jsx)(_uiGrid.Grid.Row, null, (0, _emotion.jsx)(_uiGrid.Grid.Col, null, (0, _emotion.jsx)(_uiText.Text, {
+      color: "primary"
+    }, text)), (0, _emotion.jsx)(_uiGrid.Grid.Col, {
+      width: "auto"
+    }, renderBankButton())))), ((_slotProps$quizGenera = slotProps.quizGenerationButton) === null || _slotProps$quizGenera === void 0 ? void 0 : _slotProps$quizGenera.visible) && (0, _emotion.jsx)(_uiView.View, {
+      as: "div",
+      maxWidth: containerType === 'modal' ? '100%' : '50%',
+      padding: containerType === 'modal' ? 'x-small 0 small' : 'x-small x-small small 0'
+    }, (0, _emotion.jsx)(_uiButtons.Button, {
+      size: "small",
+      display: "block",
+      color: "ai-primary",
+      textAlign: "start",
+      renderIcon: _uiIcons.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,
+      "data-automation": "sdk-interaction-button-ai"
+    }, (0, _formatMessage["default"])('Generate with AI'))));
+  };
+  return (0, _emotion.jsx)("div", {
+    css: styles.popoverContent,
+    role: "dialog",
+    "aria-label": (0, _formatMessage["default"])('Insert Content')
+  }, renderPopoverHeader(), (0, _emotion.jsx)(_uiView.View, {
+    padding: "small"
+  }, (0, _emotion.jsx)(_InteractionTypes["default"], {
+    columns: 2,
+    addItem: addItem,
+    addStimulus: addStimulus,
+    allowStimulusCreation: allowStimulusCreation,
+    types: interactionTypes
+  })));
+}
+var AddContentBody = exports.AddContentBody = (0, _quizCommon.withStyleOverrides)(_styles["default"], _theme["default"])(UnstyledAddContentBody);
+var quizGenerationButtonPropTypes = exports.quizGenerationButtonPropTypes = _propTypes["default"].shape({
+  onClick: _propTypes["default"].func.isRequired,
+  visible: _propTypes["default"].bool,
+  disabled: _propTypes["default"].bool
+});
+AddContentBody.displayName = 'AddContentBody';
+AddContentBody.componentId = "Quizzes".concat(AddContentBody.displayName);
+AddContentBody.propTypes = {
   allowStimulusCreation: _propTypes["default"].bool.isRequired,
   createItem: _propTypes["default"].func.isRequired,
   createStimulus: _propTypes["default"].func.isRequired,
@@ -161,15 +164,9 @@ var AddContentBody = exports.AddContentBody = (_dec = (0, _quizCommon.withStyleO
   setUi: _propTypes["default"].func.isRequired,
   showHeaderText: _propTypes["default"].bool,
   stimulusId: _propTypes["default"].string,
-  styles: _propTypes["default"].object
-}), (0, _defineProperty2["default"])(_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["default"].object,
+  slotProps: _propTypes["default"].shape({
+    quizGenerationButton: quizGenerationButtonPropTypes
+  })
+};
 var _default = exports["default"] = AddContentBody;

package/lib/common/components/resources/quiz/AddContent/Button/index.js

@@ -17,7 +17,7 @@ var _uiIcons = require("@instructure/ui-icons");
 var _uiA11yContent = require("@instructure/ui-a11y-content");
 var _uiButtons = require("@instructure/ui-buttons");
 var _emotion = require("@instructure/emotion");
-var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
+var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/format-message"));
 var _styles = _interopRequireDefault(require("./styles"));
 var _theme = _interopRequireDefault(require("./theme"));
 var _quizCommon = require("@instructure/quiz-common");

package/lib/common/components/resources/quiz/AddContent/Modal/presenter.js

@@ -4,94 +4,80 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = exports.AddContentModal = 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"));
+exports.AddContentModal = AddContentModal;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _uiButtons = require("@instructure/ui-buttons");
 var _uiHeading = require("@instructure/ui-heading");
 var _quizCommon = require("@instructure/quiz-common");
-var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/es/format-message"));
+var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/format-message"));
 var _Body = _interopRequireDefault(require("../Body"));
-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;
+var _presenter = require("../Body/presenter");
+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) { (0, _defineProperty2["default"])(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; }
+function AddContentModal(_ref) {
+  var allowStimulusCreation = _ref.allowStimulusCreation,
+    closeModal = _ref.closeModal,
+    modalOpen = _ref.modalOpen,
+    _ref$parentEntryId = _ref.parentEntryId,
+    parentEntryId = _ref$parentEntryId === void 0 ? void 0 : _ref$parentEntryId,
+    position = _ref.position,
+    quizId = _ref.quizId,
+    _ref$stimulusId = _ref.stimulusId,
+    stimulusId = _ref$stimulusId === void 0 ? void 0 : _ref$stimulusId,
+    _ref$slotProps = _ref.slotProps,
+    slotProps = _ref$slotProps === void 0 ? {} : _ref$slotProps;
+  var handleGenerateWithAiClick = 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, position);
+    closeModal();
+  };
+  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_quizCommon.Modal, {
+    open: modalOpen,
+    onDismiss: closeModal,
+    size: "large",
+    label: (0, _formatMessage["default"])('Add Content')
+  }, /*#__PURE__*/_react["default"].createElement(_quizCommon.ModalHeader, null, /*#__PURE__*/_react["default"].createElement(_uiHeading.Heading, {
+    level: "reset",
+    as: "h2"
+  }, (0, _formatMessage["default"])('Insert Content')), /*#__PURE__*/_react["default"].createElement(_uiButtons.CloseButton, {
+    onClick: closeModal,
+    placement: "end",
+    offset: "medium",
+    screenReaderLabel: (0, _formatMessage["default"])('Close')
+  })), /*#__PURE__*/_react["default"].createElement(_quizCommon.ModalBody, null, /*#__PURE__*/_react["default"].createElement(_Body["default"], {
+    allowStimulusCreation: allowStimulusCreation,
+    onOpenBankTray: closeModal,
+    onAddItem: closeModal,
+    parentEntryId: parentEntryId,
+    position: position,
+    quizId: quizId,
+    showHeaderText: false,
+    stimulusId: stimulusId,
+    containerType: "modal",
+    slotProps: {
+      quizGenerationButton: _objectSpread(_objectSpread({}, (slotProps === null || slotProps === void 0 ? void 0 : slotProps.quizGenerationButton) || {}), {}, {
+        onClick: handleGenerateWithAiClick
+      })
     }
-  }
-  derived = (0, _getPrototypeOf2["default"])(derived);
-  return (0, _possibleConstructorReturn2["default"])(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], (0, _getPrototypeOf2["default"])(_this).constructor) : derived.apply(_this, args));
+  })), /*#__PURE__*/_react["default"].createElement(_quizCommon.ModalFooter, null, /*#__PURE__*/_react["default"].createElement(_uiButtons.Button, {
+    onClick: closeModal
+  }, (0, _formatMessage["default"])('Cancel')))));
 }
-var AddContentModal = exports.AddContentModal = /*#__PURE__*/function (_Component) {
-  function AddContentModal() {
-    (0, _classCallCheck2["default"])(this, AddContentModal);
-    return _callSuper(this, AddContentModal, arguments);
-  }
-  (0, _inherits2["default"])(AddContentModal, _Component);
-  return (0, _createClass2["default"])(AddContentModal, [{
-    key: "cancelButton",
-    value: function cancelButton() {
-      return /*#__PURE__*/_react["default"].createElement(_uiButtons.Button, {
-        onClick: this.props.closeModal
-      }, (0, _formatMessage["default"])('Cancel'));
-    }
-  }, {
-    key: "renderContent",
-    value: function renderContent() {
-      return /*#__PURE__*/_react["default"].createElement(_Body["default"], {
-        allowStimulusCreation: this.props.allowStimulusCreation,
-        onOpenBankTray: this.props.closeModal,
-        onAddItem: this.props.closeModal,
-        parentEntryId: this.props.parentEntryId,
-        position: this.props.position,
-        quizId: this.props.quizId,
-        showHeaderText: false,
-        stimulusId: this.props.stimulusId
-      });
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_quizCommon.Modal, {
-        open: this.props.modalOpen,
-        onDismiss: this.props.closeModal,
-        size: "large",
-        label: (0, _formatMessage["default"])('Add Content')
-      }, /*#__PURE__*/_react["default"].createElement(_quizCommon.ModalHeader, null, /*#__PURE__*/_react["default"].createElement(_uiHeading.Heading, {
-        level: "reset",
-        as: "h2"
-      }, (0, _formatMessage["default"])('Insert Content')), /*#__PURE__*/_react["default"].createElement(_uiButtons.CloseButton, {
-        onClick: this.props.closeModal,
-        placement: "end",
-        offset: "medium",
-        screenReaderLabel: (0, _formatMessage["default"])('Close')
-      })), /*#__PURE__*/_react["default"].createElement(_quizCommon.ModalBody, null, this.renderContent()), /*#__PURE__*/_react["default"].createElement(_quizCommon.ModalFooter, null, this.cancelButton())));
-    }
-  }]);
-}(_react.Component);
-(0, _defineProperty2["default"])(AddContentModal, "propTypes", {
+AddContentModal.propTypes = {
   allowStimulusCreation: _propTypes["default"].bool.isRequired,
   closeModal: _propTypes["default"].func.isRequired,
   modalOpen: _propTypes["default"].bool.isRequired,
   parentEntryId: _propTypes["default"].string,
   position: _propTypes["default"].number.isRequired,
   quizId: _propTypes["default"].string.isRequired,
-  stimulusId: _propTypes["default"].string
-});
-(0, _defineProperty2["default"])(AddContentModal, "defaultProps", {
+  stimulusId: _propTypes["default"].string,
+  slotProps: _propTypes["default"].shape({
+    quizGenerationButton: _presenter.quizGenerationButtonPropTypes
+  })
+};
+AddContentModal.defaultProps = {
   parentEntryId: void 0,
   stimulusId: void 0
-});
-var _default = exports["default"] = AddContentModal;
+};