@instructure/canvas-rce 5.6.0 → 5.6.1

package/testcafe/build/72.js

@@ -8,7 +8,7 @@
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"onSubmit\", function() { return onSubmit; });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"../../node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _format_message__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../../../../format-message */ \"./src/format-message.js\");\n/* harmony import */ var _reducers_imageSection__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../reducers/imageSection */ \"./src/rce/plugins/instructure_icon_maker/reducers/imageSection.js\");\n/* harmony import */ var _shared_Upload_UploadFile__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../shared/Upload/UploadFile */ \"./src/rce/plugins/shared/Upload/UploadFile.js\");\n/*\n * Copyright (C) 2022 - present Instructure, Inc.\n *\n * This file is part of Canvas.\n *\n * Canvas is free software: you can redistribute it and/or modify it under\n * the terms of the GNU Affero General Public License as published by the Free\n * Software Foundation, version 3 of the License.\n *\n * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY\n * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR\n * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more\n * details.\n *\n * You should have received a copy of the GNU Affero General Public License along\n * with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\n\n\n\nconst onSubmit = dispatch => (_editor, _accept, _selectedPanel, uploadData) => {\n  const {\n    theFile\n  } = uploadData;\n  dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_2__[\"actions\"].SET_IMAGE,\n    payload: theFile.preview\n  });\n  dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_2__[\"actions\"].SET_IMAGE_NAME,\n    payload: theFile.name\n  });\n  dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_2__[\"actions\"].SET_IMAGE_COLLECTION_OPEN,\n    payload: false\n  });\n  dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_2__[\"actions\"].SET_CROPPER_OPEN,\n    payload: true\n  });\n};\n\nconst Upload = _ref => {\n  let {\n    editor,\n    dispatch\n  } = _ref;\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_shared_Upload_UploadFile__WEBPACK_IMPORTED_MODULE_3__[\"UploadFile\"], {\n    accept: \"image/*\",\n    editor: editor,\n    label: Object(_format_message__WEBPACK_IMPORTED_MODULE_1__[\"default\"])('Upload Image'),\n    panels: ['COMPUTER'],\n    onDismiss: () => {\n      dispatch(_reducers_imageSection__WEBPACK_IMPORTED_MODULE_2__[\"actions\"].CLEAR_MODE);\n    },\n    requireA11yAttributes: false,\n    onSubmit: onSubmit(dispatch)\n  });\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (Upload);\n\n//# sourceURL=webpack:///./src/rce/plugins/instructure_icon_maker/components/CreateIconMakerForm/ImageSection/Upload.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"onSubmit\", function() { return onSubmit; });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"../../node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! prop-types */ \"../../node_modules/prop-types/index.js\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var _format_message__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../../../format-message */ \"./src/format-message.js\");\n/* harmony import */ var _reducers_imageSection__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../reducers/imageSection */ \"./src/rce/plugins/instructure_icon_maker/reducers/imageSection.js\");\n/* harmony import */ var _reducers_svgSettings__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../reducers/svgSettings */ \"./src/rce/plugins/instructure_icon_maker/reducers/svgSettings.js\");\n/* harmony import */ var _shared_Upload_UploadFile__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../shared/Upload/UploadFile */ \"./src/rce/plugins/shared/Upload/UploadFile.js\");\n/* harmony import */ var _compressionUtils__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./compressionUtils */ \"./src/rce/plugins/instructure_icon_maker/components/CreateIconMakerForm/ImageSection/compressionUtils.js\");\n/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./utils */ \"./src/rce/plugins/instructure_icon_maker/components/CreateIconMakerForm/ImageSection/utils.js\");\n/*\n * Copyright (C) 2022 - present Instructure, Inc.\n *\n * This file is part of Canvas.\n *\n * Canvas is free software: you can redistribute it and/or modify it under\n * the terms of the GNU Affero General Public License as published by the Free\n * Software Foundation, version 3 of the License.\n *\n * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY\n * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR\n * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more\n * details.\n *\n * You should have received a copy of the GNU Affero General Public License along\n * with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\n\n\n\n\n\n\n\n\nfunction dispatchCompressedImage(theFile, dispatch) {\n  dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_3__[\"actions\"].SET_IMAGE,\n    payload: ''\n  });\n  dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_3__[\"actions\"].SET_CROPPER_OPEN,\n    payload: true\n  });\n  dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_3__[\"actions\"].SET_IMAGE_COLLECTION_OPEN,\n    payload: false\n  });\n  return Object(_compressionUtils__WEBPACK_IMPORTED_MODULE_6__[\"compressImage\"])(theFile.preview).then(blob => {\n    dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_3__[\"actions\"].SET_COMPRESSION_STATUS,\n      payload: true\n    });\n    dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_3__[\"actions\"].SET_IMAGE,\n      payload: blob\n    });\n    dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_3__[\"actions\"].SET_IMAGE_NAME,\n      payload: theFile.name\n    });\n  }).catch(() => {\n    // If compression fails, use the original one\n    // TODO: We can show the user that compression failed in some way\n    dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_3__[\"actions\"].SET_IMAGE,\n      payload: theFile.preview\n    });\n    dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_3__[\"actions\"].SET_IMAGE_NAME,\n      payload: theFile.name\n    });\n  });\n}\n\nconst onSubmit = (dispatch, onChange) => (_editor, _accept, _selectedPanel, uploadData) => {\n  const {\n    theFile\n  } = uploadData;\n\n  if (Object(_utils__WEBPACK_IMPORTED_MODULE_7__[\"isAnUnsupportedGifPngImage\"])(theFile)) {\n    dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_3__[\"actions\"].SET_IMAGE_COLLECTION_OPEN,\n      payload: false\n    });\n    return onChange({\n      type: _reducers_svgSettings__WEBPACK_IMPORTED_MODULE_4__[\"actions\"].SET_ERROR,\n      payload: Object(_format_message__WEBPACK_IMPORTED_MODULE_2__[\"default\"])('GIF/PNG format images larger than {size} KB are not currently supported.', {\n        size: _utils__WEBPACK_IMPORTED_MODULE_7__[\"MAX_GIF_PNG_SIZE_BYTES\"] / 1024\n      })\n    });\n  }\n\n  if (Object(_compressionUtils__WEBPACK_IMPORTED_MODULE_6__[\"canCompressImage\"])() && Object(_compressionUtils__WEBPACK_IMPORTED_MODULE_6__[\"shouldCompressImage\"])(theFile)) {\n    return dispatchCompressedImage(theFile, dispatch);\n  }\n\n  dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_3__[\"actions\"].SET_IMAGE,\n    payload: theFile.preview\n  });\n  dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_3__[\"actions\"].SET_IMAGE_NAME,\n    payload: theFile.name\n  });\n  dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_3__[\"actions\"].SET_IMAGE_COLLECTION_OPEN,\n    payload: false\n  });\n  dispatch({ ..._reducers_imageSection__WEBPACK_IMPORTED_MODULE_3__[\"actions\"].SET_CROPPER_OPEN,\n    payload: true\n  });\n};\n\nconst Upload = _ref => {\n  let {\n    editor,\n    dispatch,\n    onChange\n  } = _ref;\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_shared_Upload_UploadFile__WEBPACK_IMPORTED_MODULE_5__[\"UploadFile\"], {\n    accept: \"image/*\",\n    editor: editor,\n    label: Object(_format_message__WEBPACK_IMPORTED_MODULE_2__[\"default\"])('Upload Image'),\n    panels: ['COMPUTER'],\n    onDismiss: () => {\n      dispatch(_reducers_imageSection__WEBPACK_IMPORTED_MODULE_3__[\"actions\"].CLEAR_MODE);\n    },\n    requireA11yAttributes: false,\n    onSubmit: onSubmit(dispatch, onChange)\n  });\n};\n\nUpload.propTypes = {\n  editor: prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.object.isRequired,\n  dispatch: prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.func,\n  onChange: prop_types__WEBPACK_IMPORTED_MODULE_1___default.a.func\n};\nUpload.defaultProps = {\n  dispatch: () => {},\n  onChange: () => {}\n};\n/* harmony default export */ __webpack_exports__[\"default\"] = (Upload);\n\n//# sourceURL=webpack:///./src/rce/plugins/instructure_icon_maker/components/CreateIconMakerForm/ImageSection/Upload.js?");
 
 /***/ })
 

package/testcafe/build/73.js

@@ -8,7 +8,7 @@
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Embed\", function() { return Embed; });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"../../node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _instructure_ui_modal__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @instructure/ui-modal */ \"../../node_modules/@instructure/ui-modal/es/index.js\");\n/* harmony import */ var _format_message__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../format-message */ \"./src/format-message.js\");\n/* harmony import */ var _instructure_ui_buttons__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @instructure/ui-buttons */ \"../../node_modules/@instructure/ui-buttons/es/index.js\");\n/* harmony import */ var _instructure_ui_heading__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @instructure/ui-heading */ \"../../node_modules/@instructure/ui-heading/es/index.js\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! prop-types */ \"../../node_modules/prop-types/index.js\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var _instructure_ui_text_area__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @instructure/ui-text-area */ \"../../node_modules/@instructure/ui-text-area/es/index.js\");\n/*\n * Copyright (C) 2020 - present Instructure, Inc.\n *\n * This file is part of Canvas.\n *\n * Canvas is free software: you can redistribute it and/or modify it under\n * the terms of the GNU Affero General Public License as published by the Free\n * Software Foundation, version 3 of the License.\n *\n * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY\n * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR\n * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more\n * details.\n *\n * You should have received a copy of the GNU Affero General Public License along\n * with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\n\n\n\n\n\n\nfunction Embed(_ref) {\n  let {\n    onSubmit,\n    onDismiss\n  } = _ref;\n  const [embedCode, setEmbedCode] = Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useState\"])('');\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_modal__WEBPACK_IMPORTED_MODULE_1__[\"Modal\"], {\n    \"data-mce-component\": true,\n    label: Object(_format_message__WEBPACK_IMPORTED_MODULE_2__[\"default\"])('Embed'),\n    size: \"medium\",\n    onDismiss: onDismiss,\n    open: true,\n    shouldCloseOnDocumentClick: false\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_modal__WEBPACK_IMPORTED_MODULE_1__[\"Modal\"].Header, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_buttons__WEBPACK_IMPORTED_MODULE_3__[\"CloseButton\"], {\n    onClick: onDismiss,\n    offset: \"medium\",\n    placement: \"end\"\n  }, Object(_format_message__WEBPACK_IMPORTED_MODULE_2__[\"default\"])('Close')), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_heading__WEBPACK_IMPORTED_MODULE_4__[\"Heading\"], null, Object(_format_message__WEBPACK_IMPORTED_MODULE_2__[\"default\"])('Embed'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_modal__WEBPACK_IMPORTED_MODULE_1__[\"Modal\"].Body, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_text_area__WEBPACK_IMPORTED_MODULE_6__[\"TextArea\"], {\n    maxHeight: \"10rem\",\n    label: Object(_format_message__WEBPACK_IMPORTED_MODULE_2__[\"default\"])('Embed Code'),\n    value: embedCode,\n    onChange: e => {\n      setEmbedCode(e.target.value);\n    }\n  })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_modal__WEBPACK_IMPORTED_MODULE_1__[\"Modal\"].Footer, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_buttons__WEBPACK_IMPORTED_MODULE_3__[\"Button\"], {\n    onClick: onDismiss\n  }, Object(_format_message__WEBPACK_IMPORTED_MODULE_2__[\"default\"])('Close')), \"\\xA0\", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_buttons__WEBPACK_IMPORTED_MODULE_3__[\"Button\"], {\n    onClick: e => {\n      e.preventDefault();\n      onSubmit(embedCode);\n      onDismiss();\n    },\n    variant: \"primary\",\n    type: \"submit\",\n    disabled: !embedCode\n  }, Object(_format_message__WEBPACK_IMPORTED_MODULE_2__[\"default\"])('Submit'))));\n}\nEmbed.propTypes = {\n  onSubmit: prop_types__WEBPACK_IMPORTED_MODULE_5__[\"func\"].isRequired,\n  onDismiss: prop_types__WEBPACK_IMPORTED_MODULE_5__[\"func\"].isRequired\n};\n\n//# sourceURL=webpack:///./src/rce/plugins/instructure_media_embed/components/Embed.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"Embed\", function() { return Embed; });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"../../node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _instructure_ui_modal__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @instructure/ui-modal */ \"../../node_modules/@instructure/ui-modal/es/index.js\");\n/* harmony import */ var _format_message__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../../format-message */ \"./src/format-message.js\");\n/* harmony import */ var _instructure_ui_buttons__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @instructure/ui-buttons */ \"../../node_modules/@instructure/ui-buttons/es/index.js\");\n/* harmony import */ var _instructure_ui_heading__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @instructure/ui-heading */ \"../../node_modules/@instructure/ui-heading/es/index.js\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! prop-types */ \"../../node_modules/prop-types/index.js\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_5___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_5__);\n/* harmony import */ var _instructure_ui_text_area__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @instructure/ui-text-area */ \"../../node_modules/@instructure/ui-text-area/es/index.js\");\n/*\n * Copyright (C) 2020 - present Instructure, Inc.\n *\n * This file is part of Canvas.\n *\n * Canvas is free software: you can redistribute it and/or modify it under\n * the terms of the GNU Affero General Public License as published by the Free\n * Software Foundation, version 3 of the License.\n *\n * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY\n * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR\n * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more\n * details.\n *\n * You should have received a copy of the GNU Affero General Public License along\n * with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\n\n\n\n\n\n\nfunction Embed(_ref) {\n  let {\n    onSubmit,\n    onDismiss\n  } = _ref;\n  const [embedCode, setEmbedCode] = Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useState\"])('');\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_modal__WEBPACK_IMPORTED_MODULE_1__[\"Modal\"], {\n    \"data-mce-component\": true,\n    label: Object(_format_message__WEBPACK_IMPORTED_MODULE_2__[\"default\"])('Embed'),\n    size: \"medium\",\n    onDismiss: onDismiss,\n    open: true,\n    shouldCloseOnDocumentClick: false\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_modal__WEBPACK_IMPORTED_MODULE_1__[\"Modal\"].Header, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_buttons__WEBPACK_IMPORTED_MODULE_3__[\"CloseButton\"], {\n    onClick: onDismiss,\n    offset: \"medium\",\n    placement: \"end\",\n    screenReaderLabel: Object(_format_message__WEBPACK_IMPORTED_MODULE_2__[\"default\"])('Close')\n  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_heading__WEBPACK_IMPORTED_MODULE_4__[\"Heading\"], null, Object(_format_message__WEBPACK_IMPORTED_MODULE_2__[\"default\"])('Embed'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_modal__WEBPACK_IMPORTED_MODULE_1__[\"Modal\"].Body, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_text_area__WEBPACK_IMPORTED_MODULE_6__[\"TextArea\"], {\n    maxHeight: \"10rem\",\n    label: Object(_format_message__WEBPACK_IMPORTED_MODULE_2__[\"default\"])('Embed Code'),\n    value: embedCode,\n    onChange: e => {\n      setEmbedCode(e.target.value);\n    }\n  })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_modal__WEBPACK_IMPORTED_MODULE_1__[\"Modal\"].Footer, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_buttons__WEBPACK_IMPORTED_MODULE_3__[\"Button\"], {\n    onClick: onDismiss\n  }, Object(_format_message__WEBPACK_IMPORTED_MODULE_2__[\"default\"])('Close')), \"\\xA0\", /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_buttons__WEBPACK_IMPORTED_MODULE_3__[\"Button\"], {\n    onClick: e => {\n      e.preventDefault();\n      onSubmit(embedCode);\n      onDismiss();\n    },\n    variant: \"primary\",\n    type: \"submit\",\n    disabled: !embedCode\n  }, Object(_format_message__WEBPACK_IMPORTED_MODULE_2__[\"default\"])('Submit'))));\n}\nEmbed.propTypes = {\n  onSubmit: prop_types__WEBPACK_IMPORTED_MODULE_5__[\"func\"].isRequired,\n  onDismiss: prop_types__WEBPACK_IMPORTED_MODULE_5__[\"func\"].isRequired\n};\n\n//# sourceURL=webpack:///./src/rce/plugins/instructure_media_embed/components/Embed.js?");
 
 /***/ })
 

package/testcafe/build/75.js

@@ -8,7 +8,7 @@
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"default\", function() { return ComputerPanel; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"styles\", function() { return styles; });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"../../node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! prop-types */ \"../../node_modules/prop-types/index.js\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var aphrodite__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! aphrodite */ \"../../node_modules/aphrodite/es/index.js\");\n/* harmony import */ var _instructure_ui_file_drop__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @instructure/ui-file-drop */ \"../../node_modules/@instructure/ui-file-drop/es/index.js\");\n/* harmony import */ var _instructure_ui_billboard__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @instructure/ui-billboard */ \"../../node_modules/@instructure/ui-billboard/es/index.js\");\n/* harmony import */ var _instructure_ui_alerts__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @instructure/ui-alerts */ \"../../node_modules/@instructure/ui-alerts/es/index.js\");\n/* harmony import */ var _instructure_ui_buttons__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @instructure/ui-buttons */ \"../../node_modules/@instructure/ui-buttons/es/index.js\");\n/* harmony import */ var _instructure_ui_utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @instructure/ui-utils */ \"../../node_modules/@instructure/ui-utils/es/index.js\");\n/* harmony import */ var _instructure_ui_a11y_content__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @instructure/ui-a11y-content */ \"../../node_modules/@instructure/ui-a11y-content/es/index.js\");\n/* harmony import */ var _instructure_ui_icons__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @instructure/ui-icons */ \"../../node_modules/@instructure/ui-icons/es/index.js\");\n/* harmony import */ var _instructure_ui_img__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @instructure/ui-img */ \"../../node_modules/@instructure/ui-img/es/index.js\");\n/* harmony import */ var _instructure_ui_text__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @instructure/ui-text */ \"../../node_modules/@instructure/ui-text/es/index.js\");\n/* harmony import */ var _instructure_ui_truncate_text__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! @instructure/ui-truncate-text */ \"../../node_modules/@instructure/ui-truncate-text/es/index.js\");\n/* harmony import */ var _instructure_ui_flex__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! @instructure/ui-flex */ \"../../node_modules/@instructure/ui-flex/es/index.js\");\n/* harmony import */ var _instructure_ui_view__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! @instructure/ui-view */ \"../../node_modules/@instructure/ui-view/es/index.js\");\n/* harmony import */ var _instructure_ui_media_player__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! @instructure/ui-media-player */ \"./node_modules/@instructure/ui-media-player/es/index.js\");\n/* harmony import */ var _instructure_canvas_media__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! @instructure/canvas-media */ \"../canvas-media/es/index.js\");\n/* harmony import */ var _format_message__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../../../format-message */ \"./src/format-message.js\");\n/* harmony import */ var _fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../fileTypeUtils */ \"./src/rce/plugins/shared/fileTypeUtils.js\");\n/*\n * Copyright (C) 2019 - present Instructure, Inc.\n *\n * This file is part of Canvas.\n *\n * Canvas is free software: you can redistribute it and/or modify it under\n * the terms of the GNU Affero General Public License as published by the Free\n * Software Foundation, version 3 of the License.\n *\n * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY\n * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR\n * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more\n * details.\n *\n * You should have received a copy of the GNU Affero General Public License along\n * with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n// NOTE: if you're looking in here for the ComputerPanel that's used for\n// the RCE's Media > Upload/Record Media function, it's not this one\n// (though this panel can handle video with the right \"accept\" prop).\n// See @instructure/canvas-media/src/ComputerPanel.js\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nfunction isPreviewableAudioOrVideo(type) {\n  return Object(_instructure_canvas_media__WEBPACK_IMPORTED_MODULE_16__[\"isPreviewable\"])(type) && Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"isAudioOrVideo\"])(type);\n}\n\nfunction readFile(theFile) {\n  const p = new Promise((resolve, reject) => {\n    const reader = new FileReader();\n\n    reader.onload = () => {\n      let result = reader.result;\n\n      if (Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"isText\"])(theFile.type) && result.length > 1000) {\n        result = `${result.substr(0, 1000)}...`;\n      }\n\n      resolve(result);\n    };\n\n    reader.onerror = () => {\n      reject(new Error(Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('An error occured reading the file')));\n    };\n\n    if (theFile.size === 0) {\n      // canvas will reject uploading an empty file\n      reject(new Error(Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('You may not upload an empty file.')));\n    }\n\n    if (Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"isImage\"])(theFile.type)) {\n      reader.readAsDataURL(theFile);\n    } else if (Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"isText\"])(theFile.type)) {\n      reader.readAsText(theFile);\n    } else if (isPreviewableAudioOrVideo(theFile.type)) {\n      const sources = [{\n        label: theFile.name,\n        src: URL.createObjectURL(theFile),\n        type: theFile.type\n      }];\n      resolve(sources);\n    } else {\n      const icon = Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"getIconFromType\"])(theFile.type);\n      resolve(icon);\n    }\n  });\n  return p;\n}\n\nfunction ComputerPanel(_ref) {\n  let {\n    theFile,\n    setFile,\n    setError,\n    accept,\n    label,\n    bounds\n  } = _ref;\n  const [messages, setMessages] = Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useState\"])([]);\n  const [preview, setPreview] = Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useState\"])({\n    preview: null,\n    isLoading: false\n  }); // the trashcan is 38px tall and the 1.5rem margin-bottom\n  // the 350 is to guarantee the video doesn't oveflow into the copyright UI,\n  // which should probably be rendered here and not up in the modal because\n  // dealing with Tabs and size is nearly impossible\n\n  const height = Math.min(350, 0.8 * (bounds.height - 38 - Object(_instructure_ui_utils__WEBPACK_IMPORTED_MODULE_7__[\"px\"])('1.5rem')));\n  const width = 0.8 * bounds.width;\n  Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useEffect\"])(() => {\n    return () => {\n      if (Array.isArray(preview === null || preview === void 0 ? void 0 : preview.preview)) {\n        var _URL, _URL$revokeObjectURL;\n\n        (_URL = URL) === null || _URL === void 0 ? void 0 : (_URL$revokeObjectURL = _URL.revokeObjectURL) === null || _URL$revokeObjectURL === void 0 ? void 0 : _URL$revokeObjectURL.call(_URL, preview.preview[0].src);\n      }\n    };\n  }, [preview]);\n  Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useEffect\"])(() => {\n    if (!theFile || preview.isLoading || preview.preview || preview.error) return;\n\n    async function getPreview() {\n      setPreview({\n        preview: null,\n        isLoading: true\n      });\n\n      try {\n        const previewer = await readFile(theFile);\n        setPreview({\n          preview: previewer,\n          isLoading: false\n        });\n        setError(null);\n\n        if (Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"isImage\"])(theFile.type)) {\n          // we need the preview to know the image size to show the placeholder\n          theFile.preview = previewer;\n          setFile(theFile);\n        }\n      } catch (ex) {\n        setError(ex);\n        setPreview({\n          preview: null,\n          error: ex.message,\n          isLoading: false\n        });\n      }\n    }\n\n    getPreview();\n  });\n  const handleLoadedMetadata = Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useCallback\"])(event => {\n    const player = event.target;\n    const sz = Object(_instructure_canvas_media__WEBPACK_IMPORTED_MODULE_16__[\"sizeMediaPlayer\"])(player, theFile.type, {\n      width,\n      height\n    });\n    player.style.width = sz.width;\n    player.style.height = sz.height;\n    player.style.margin = '0 auto'; // from this sub-package, I don't have a URL to use as the\n    // audio player's poster image. We can give it a background image though\n\n    player.classList.add(Object(_instructure_canvas_media__WEBPACK_IMPORTED_MODULE_16__[\"isAudio\"])(theFile.type) ? 'audio-player' : 'video-player');\n  }, [theFile, width, height]);\n  const previewPanelRef = Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useRef\"])(null);\n  const clearButtonRef = Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useRef\"])(null);\n  const panelRef = Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useRef\"])(null);\n  Object(_instructure_canvas_media__WEBPACK_IMPORTED_MODULE_16__[\"useComputerPanelFocus\"])(theFile, panelRef, clearButtonRef);\n\n  function renderPreview() {\n    if (preview.isLoading) {\n      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"div\", {\n        \"aria-live\": \"polite\"\n      }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_text__WEBPACK_IMPORTED_MODULE_11__[\"Text\"], {\n        color: \"secondary\"\n      }, Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('Generating preview...')));\n    } else if (preview.error) {\n      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"div\", {\n        className: Object(aphrodite__WEBPACK_IMPORTED_MODULE_2__[\"css\"])(styles.previewContainer),\n        \"aria-live\": \"polite\"\n      }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_alerts__WEBPACK_IMPORTED_MODULE_5__[\"Alert\"], {\n        variant: \"error\"\n      }, preview.error));\n    } else if (preview.preview) {\n      if (Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"isImage\"])(theFile.type)) {\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_img__WEBPACK_IMPORTED_MODULE_10__[\"Img\"], {\n          \"aria-label\": Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('{filename} image preview', {\n            filename: theFile.name\n          }),\n          src: preview.preview,\n          constrain: \"contain\",\n          inline: false\n        });\n      } else if (Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"isText\"])(theFile.type)) {\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_view__WEBPACK_IMPORTED_MODULE_14__[\"View\"], {\n          as: \"pre\",\n          display: \"block\",\n          padding: \"x-small\",\n          textAlign: \"start\",\n          \"aria-label\": Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('{filename} text preview', {\n            filename: theFile.name\n          })\n        }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_truncate_text__WEBPACK_IMPORTED_MODULE_12__[\"TruncateText\"], {\n          maxLines: 21\n        }, preview.preview));\n      } else if (isPreviewableAudioOrVideo(theFile.type)) {\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_media_player__WEBPACK_IMPORTED_MODULE_15__[\"MediaPlayer\"], {\n          sources: preview.preview,\n          onLoadedMetadata: handleLoadedMetadata\n        });\n      } else {\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"div\", {\n          \"aria-label\": Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('{filename} file icon', {\n            filename: theFile.name\n          }),\n          className: Object(aphrodite__WEBPACK_IMPORTED_MODULE_2__[\"css\"])(styles.previewContainer),\n          style: {\n            textAlign: 'center'\n          }\n        }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(preview.preview, {\n          size: \"medium\"\n        }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_text__WEBPACK_IMPORTED_MODULE_11__[\"Text\"], {\n          as: \"p\",\n          weight: \"normal\"\n        }, Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('No preview is available for this file.')));\n      }\n    }\n  }\n\n  if (theFile) {\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"div\", {\n      style: {\n        position: 'relative'\n      },\n      ref: previewPanelRef\n    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_flex__WEBPACK_IMPORTED_MODULE_13__[\"Flex\"], {\n      direction: \"row-reverse\",\n      margin: \"none none medium\"\n    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_flex__WEBPACK_IMPORTED_MODULE_13__[\"Flex\"].Item, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_buttons__WEBPACK_IMPORTED_MODULE_6__[\"Button\"], {\n      buttonRef: el => {\n        clearButtonRef.current = el;\n      },\n      onClick: () => {\n        setFile(null);\n        setPreview({\n          preview: null,\n          isLoading: false,\n          error: null\n        });\n      },\n      icon: _instructure_ui_icons__WEBPACK_IMPORTED_MODULE_9__[\"IconTrashLine\"]\n    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_a11y_content__WEBPACK_IMPORTED_MODULE_8__[\"ScreenReaderContent\"], null, Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('Clear selected file: {filename}', {\n      filename: theFile.name\n    })))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_flex__WEBPACK_IMPORTED_MODULE_13__[\"Flex\"].Item, {\n      grow: true,\n      shrink: true\n    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_a11y_content__WEBPACK_IMPORTED_MODULE_8__[\"PresentationContent\"], null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_text__WEBPACK_IMPORTED_MODULE_11__[\"Text\"], null, theFile.name)))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_view__WEBPACK_IMPORTED_MODULE_14__[\"View\"], {\n      as: \"div\",\n      width: `${width}px`,\n      height: `${height}px`,\n      textAlign: \"center\",\n      margin: \"0 auto\"\n    }, renderPreview()));\n  }\n\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"div\", {\n    ref: panelRef\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_file_drop__WEBPACK_IMPORTED_MODULE_3__[\"FileDrop\"], {\n    accept: accept,\n    onDropAccepted: _ref2 => {\n      let [file] = _ref2;\n\n      if (messages.length) {\n        setMessages([]);\n      }\n\n      setFile(file);\n    },\n    onDropRejected: () => {\n      setMessages(messages.concat({\n        text: Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('Invalid file type'),\n        type: 'error'\n      }));\n    },\n    messages: messages,\n    renderLabel: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_billboard__WEBPACK_IMPORTED_MODULE_4__[\"Billboard\"], {\n      heading: label,\n      hero: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_canvas_media__WEBPACK_IMPORTED_MODULE_16__[\"RocketSVG\"], {\n        width: \"3em\",\n        height: \"3em\"\n      }),\n      message: Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('Drag and drop, or click to browse your computer')\n    })\n  }));\n}\nComputerPanel.propTypes = {\n  theFile: Object(prop_types__WEBPACK_IMPORTED_MODULE_1__[\"instanceOf\"])(File),\n  setFile: prop_types__WEBPACK_IMPORTED_MODULE_1__[\"func\"].isRequired,\n  setError: prop_types__WEBPACK_IMPORTED_MODULE_1__[\"func\"].isRequired,\n  accept: Object(prop_types__WEBPACK_IMPORTED_MODULE_1__[\"oneOfType\"])([prop_types__WEBPACK_IMPORTED_MODULE_1__[\"string\"], Object(prop_types__WEBPACK_IMPORTED_MODULE_1__[\"arrayOf\"])(prop_types__WEBPACK_IMPORTED_MODULE_1__[\"string\"])]),\n  label: prop_types__WEBPACK_IMPORTED_MODULE_1__[\"string\"].isRequired,\n  bounds: Object(prop_types__WEBPACK_IMPORTED_MODULE_1__[\"shape\"])({\n    width: prop_types__WEBPACK_IMPORTED_MODULE_1__[\"number\"],\n    height: prop_types__WEBPACK_IMPORTED_MODULE_1__[\"number\"]\n  })\n};\nComputerPanel.defaultProps = {\n  bounds: {}\n};\nconst styles = aphrodite__WEBPACK_IMPORTED_MODULE_2__[\"StyleSheet\"].create({\n  previewContainer: {\n    maxHeight: '250px',\n    overflow: 'hidden',\n    boxSizing: 'border-box',\n    margin: '5rem .375rem 0',\n    position: 'relative'\n  },\n  previewArea: {\n    width: '100%',\n    height: '100%',\n    maxHeight: '250px',\n    boxSizing: 'border-box',\n    objectFit: 'contain',\n    overflow: 'hidden'\n  }\n});\n\n//# sourceURL=webpack:///./src/rce/plugins/shared/Upload/ComputerPanel.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"default\", function() { return ComputerPanel; });\n/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, \"styles\", function() { return styles; });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"../../node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! prop-types */ \"../../node_modules/prop-types/index.js\");\n/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);\n/* harmony import */ var aphrodite__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! aphrodite */ \"../../node_modules/aphrodite/es/index.js\");\n/* harmony import */ var _instructure_ui_file_drop__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @instructure/ui-file-drop */ \"../../node_modules/@instructure/ui-file-drop/es/index.js\");\n/* harmony import */ var _instructure_ui_billboard__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @instructure/ui-billboard */ \"../../node_modules/@instructure/ui-billboard/es/index.js\");\n/* harmony import */ var _instructure_ui_alerts__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @instructure/ui-alerts */ \"../../node_modules/@instructure/ui-alerts/es/index.js\");\n/* harmony import */ var _instructure_ui_buttons__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @instructure/ui-buttons */ \"../../node_modules/@instructure/ui-buttons/es/index.js\");\n/* harmony import */ var _instructure_ui_utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @instructure/ui-utils */ \"../../node_modules/@instructure/ui-utils/es/index.js\");\n/* harmony import */ var _instructure_ui_a11y_content__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @instructure/ui-a11y-content */ \"../../node_modules/@instructure/ui-a11y-content/es/index.js\");\n/* harmony import */ var _instructure_ui_icons__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! @instructure/ui-icons */ \"../../node_modules/@instructure/ui-icons/es/index.js\");\n/* harmony import */ var _instructure_ui_img__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! @instructure/ui-img */ \"../../node_modules/@instructure/ui-img/es/index.js\");\n/* harmony import */ var _instructure_ui_text__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @instructure/ui-text */ \"../../node_modules/@instructure/ui-text/es/index.js\");\n/* harmony import */ var _instructure_ui_truncate_text__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! @instructure/ui-truncate-text */ \"../../node_modules/@instructure/ui-truncate-text/es/index.js\");\n/* harmony import */ var _instructure_ui_flex__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! @instructure/ui-flex */ \"../../node_modules/@instructure/ui-flex/es/index.js\");\n/* harmony import */ var _instructure_ui_view__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! @instructure/ui-view */ \"../../node_modules/@instructure/ui-view/es/index.js\");\n/* harmony import */ var _instructure_ui_media_player__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! @instructure/ui-media-player */ \"./node_modules/@instructure/ui-media-player/es/index.js\");\n/* harmony import */ var _instructure_canvas_media__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! @instructure/canvas-media */ \"../canvas-media/es/index.js\");\n/* harmony import */ var _format_message__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! ../../../../format-message */ \"./src/format-message.js\");\n/* harmony import */ var _fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! ../fileTypeUtils */ \"./src/rce/plugins/shared/fileTypeUtils.js\");\n/*\n * Copyright (C) 2019 - present Instructure, Inc.\n *\n * This file is part of Canvas.\n *\n * Canvas is free software: you can redistribute it and/or modify it under\n * the terms of the GNU Affero General Public License as published by the Free\n * Software Foundation, version 3 of the License.\n *\n * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY\n * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR\n * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more\n * details.\n *\n * You should have received a copy of the GNU Affero General Public License along\n * with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n// NOTE: if you're looking in here for the ComputerPanel that's used for\n// the RCE's Media > Upload/Record Media function, it's not this one\n// (though this panel can handle video with the right \"accept\" prop).\n// See @instructure/canvas-media/src/ComputerPanel.js\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nfunction isPreviewableAudioOrVideo(type) {\n  return Object(_instructure_canvas_media__WEBPACK_IMPORTED_MODULE_16__[\"isPreviewable\"])(type) && Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"isAudioOrVideo\"])(type);\n}\n\nfunction readFile(theFile) {\n  const p = new Promise((resolve, reject) => {\n    const reader = new FileReader();\n\n    reader.onload = () => {\n      let result = reader.result;\n\n      if (Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"isText\"])(theFile.type) && result.length > 1000) {\n        result = `${result.substr(0, 1000)}...`;\n      }\n\n      resolve(result);\n    };\n\n    reader.onerror = () => {\n      reject(new Error(Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('An error occured reading the file')));\n    };\n\n    if (theFile.size === 0) {\n      // canvas will reject uploading an empty file\n      reject(new Error(Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('You may not upload an empty file.')));\n    }\n\n    if (Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"isImage\"])(theFile.type)) {\n      reader.readAsDataURL(theFile);\n    } else if (Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"isText\"])(theFile.type)) {\n      reader.readAsText(theFile);\n    } else if (isPreviewableAudioOrVideo(theFile.type)) {\n      const sources = [{\n        label: theFile.name,\n        src: URL.createObjectURL(theFile),\n        type: theFile.type\n      }];\n      resolve(sources);\n    } else {\n      const icon = Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"getIconFromType\"])(theFile.type);\n      resolve(icon);\n    }\n  });\n  return p;\n}\n\nfunction ComputerPanel(_ref) {\n  let {\n    theFile,\n    setFile,\n    setError,\n    accept,\n    label,\n    bounds\n  } = _ref;\n  const [messages, setMessages] = Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useState\"])([]);\n  const [preview, setPreview] = Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useState\"])({\n    preview: null,\n    isLoading: false\n  }); // the trashcan is 38px tall and the 1.5rem margin-bottom\n  // the 350 is to guarantee the video doesn't oveflow into the copyright UI,\n  // which should probably be rendered here and not up in the modal because\n  // dealing with Tabs and size is nearly impossible\n\n  const height = Math.min(350, 0.8 * (bounds.height - 38 - Object(_instructure_ui_utils__WEBPACK_IMPORTED_MODULE_7__[\"px\"])('1.5rem')));\n  const width = 0.8 * bounds.width;\n  Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useEffect\"])(() => {\n    return () => {\n      if (Array.isArray(preview === null || preview === void 0 ? void 0 : preview.preview)) {\n        var _URL, _URL$revokeObjectURL;\n\n        (_URL = URL) === null || _URL === void 0 ? void 0 : (_URL$revokeObjectURL = _URL.revokeObjectURL) === null || _URL$revokeObjectURL === void 0 ? void 0 : _URL$revokeObjectURL.call(_URL, preview.preview[0].src);\n      }\n    };\n  }, [preview]);\n  Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useEffect\"])(() => {\n    if (!theFile || preview.isLoading || preview.preview || preview.error) return;\n\n    async function getPreview() {\n      setPreview({\n        preview: null,\n        isLoading: true\n      });\n\n      try {\n        const previewer = await readFile(theFile);\n        setPreview({\n          preview: previewer,\n          isLoading: false\n        });\n        setError(null);\n\n        if (Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"isImage\"])(theFile.type)) {\n          // we need the preview to know the image size to show the placeholder\n          theFile.preview = previewer;\n          setFile(theFile);\n        }\n      } catch (ex) {\n        setError(ex);\n        setPreview({\n          preview: null,\n          error: ex.message,\n          isLoading: false\n        });\n      }\n    }\n\n    getPreview();\n  });\n  const handleLoadedMetadata = Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useCallback\"])(event => {\n    const player = event.target;\n    const sz = Object(_instructure_canvas_media__WEBPACK_IMPORTED_MODULE_16__[\"sizeMediaPlayer\"])(player, theFile.type, {\n      width,\n      height\n    });\n    player.style.width = sz.width;\n    player.style.height = sz.height;\n    player.style.margin = '0 auto'; // from this sub-package, I don't have a URL to use as the\n    // audio player's poster image. We can give it a background image though\n\n    player.classList.add(Object(_instructure_canvas_media__WEBPACK_IMPORTED_MODULE_16__[\"isAudio\"])(theFile.type) ? 'audio-player' : 'video-player');\n  }, [theFile, width, height]);\n  const previewPanelRef = Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useRef\"])(null);\n  const clearButtonRef = Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useRef\"])(null);\n  const panelRef = Object(react__WEBPACK_IMPORTED_MODULE_0__[\"useRef\"])(null);\n  Object(_instructure_canvas_media__WEBPACK_IMPORTED_MODULE_16__[\"useComputerPanelFocus\"])(theFile, panelRef, clearButtonRef);\n\n  function renderPreview() {\n    if (preview.isLoading) {\n      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"div\", {\n        \"aria-live\": \"polite\"\n      }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_text__WEBPACK_IMPORTED_MODULE_11__[\"Text\"], {\n        color: \"secondary\"\n      }, Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('Generating preview...')));\n    } else if (preview.error) {\n      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"div\", {\n        className: Object(aphrodite__WEBPACK_IMPORTED_MODULE_2__[\"css\"])(styles.previewContainer),\n        \"aria-live\": \"polite\"\n      }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_alerts__WEBPACK_IMPORTED_MODULE_5__[\"Alert\"], {\n        variant: \"error\"\n      }, preview.error));\n    } else if (preview.preview) {\n      if (Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"isImage\"])(theFile.type)) {\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_img__WEBPACK_IMPORTED_MODULE_10__[\"Img\"], {\n          \"aria-label\": Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('{filename} image preview', {\n            filename: theFile.name\n          }),\n          src: preview.preview,\n          constrain: \"contain\",\n          display: \"block\"\n        });\n      } else if (Object(_fileTypeUtils__WEBPACK_IMPORTED_MODULE_18__[\"isText\"])(theFile.type)) {\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_view__WEBPACK_IMPORTED_MODULE_14__[\"View\"], {\n          as: \"pre\",\n          display: \"block\",\n          padding: \"x-small\",\n          textAlign: \"start\",\n          \"aria-label\": Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('{filename} text preview', {\n            filename: theFile.name\n          })\n        }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_truncate_text__WEBPACK_IMPORTED_MODULE_12__[\"TruncateText\"], {\n          maxLines: 21\n        }, preview.preview));\n      } else if (isPreviewableAudioOrVideo(theFile.type)) {\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_media_player__WEBPACK_IMPORTED_MODULE_15__[\"MediaPlayer\"], {\n          sources: preview.preview,\n          onLoadedMetadata: handleLoadedMetadata\n        });\n      } else {\n        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"div\", {\n          \"aria-label\": Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('{filename} file icon', {\n            filename: theFile.name\n          }),\n          className: Object(aphrodite__WEBPACK_IMPORTED_MODULE_2__[\"css\"])(styles.previewContainer),\n          style: {\n            textAlign: 'center'\n          }\n        }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(preview.preview, {\n          size: \"medium\"\n        }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_text__WEBPACK_IMPORTED_MODULE_11__[\"Text\"], {\n          as: \"p\",\n          weight: \"normal\"\n        }, Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('No preview is available for this file.')));\n      }\n    }\n  }\n\n  if (theFile) {\n    const filename = theFile.name;\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"div\", {\n      style: {\n        position: 'relative'\n      },\n      ref: previewPanelRef\n    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_flex__WEBPACK_IMPORTED_MODULE_13__[\"Flex\"], {\n      direction: \"row-reverse\",\n      margin: \"none none medium\"\n    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_flex__WEBPACK_IMPORTED_MODULE_13__[\"Flex\"].Item, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_buttons__WEBPACK_IMPORTED_MODULE_6__[\"IconButton\"], {\n      elementRef: el => {\n        clearButtonRef.current = el;\n      },\n      onClick: () => {\n        setFile(null);\n        setPreview({\n          preview: null,\n          isLoading: false,\n          error: null\n        });\n      },\n      renderIcon: _instructure_ui_icons__WEBPACK_IMPORTED_MODULE_9__[\"IconTrashLine\"],\n      screenReaderLabel: Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('Clear selected file: {filename}', {\n        filename\n      })\n    })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_flex__WEBPACK_IMPORTED_MODULE_13__[\"Flex\"].Item, {\n      shouldGrow: true,\n      shouldShrink: true\n    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_a11y_content__WEBPACK_IMPORTED_MODULE_8__[\"PresentationContent\"], null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_text__WEBPACK_IMPORTED_MODULE_11__[\"Text\"], null, filename)))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_view__WEBPACK_IMPORTED_MODULE_14__[\"View\"], {\n      as: \"div\",\n      width: `${width}px`,\n      height: `${height}px`,\n      textAlign: \"center\",\n      margin: \"0 auto\"\n    }, renderPreview()));\n  }\n\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(\"div\", {\n    ref: panelRef\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_file_drop__WEBPACK_IMPORTED_MODULE_3__[\"FileDrop\"], {\n    accept: accept,\n    onDropAccepted: _ref2 => {\n      let [file] = _ref2;\n\n      if (messages.length) {\n        setMessages([]);\n      }\n\n      setFile(file);\n    },\n    onDropRejected: () => {\n      setMessages(messages.concat({\n        text: Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('Invalid file type'),\n        type: 'error'\n      }));\n    },\n    messages: messages,\n    renderLabel: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_ui_billboard__WEBPACK_IMPORTED_MODULE_4__[\"Billboard\"], {\n      heading: label,\n      hero: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_instructure_canvas_media__WEBPACK_IMPORTED_MODULE_16__[\"RocketSVG\"], {\n        width: \"3em\",\n        height: \"3em\"\n      }),\n      message: Object(_format_message__WEBPACK_IMPORTED_MODULE_17__[\"default\"])('Drag and drop, or click to browse your computer')\n    })\n  }));\n}\nComputerPanel.propTypes = {\n  theFile: Object(prop_types__WEBPACK_IMPORTED_MODULE_1__[\"instanceOf\"])(File),\n  setFile: prop_types__WEBPACK_IMPORTED_MODULE_1__[\"func\"].isRequired,\n  setError: prop_types__WEBPACK_IMPORTED_MODULE_1__[\"func\"].isRequired,\n  accept: Object(prop_types__WEBPACK_IMPORTED_MODULE_1__[\"oneOfType\"])([prop_types__WEBPACK_IMPORTED_MODULE_1__[\"string\"], Object(prop_types__WEBPACK_IMPORTED_MODULE_1__[\"arrayOf\"])(prop_types__WEBPACK_IMPORTED_MODULE_1__[\"string\"])]),\n  label: prop_types__WEBPACK_IMPORTED_MODULE_1__[\"string\"].isRequired,\n  bounds: Object(prop_types__WEBPACK_IMPORTED_MODULE_1__[\"shape\"])({\n    width: prop_types__WEBPACK_IMPORTED_MODULE_1__[\"number\"],\n    height: prop_types__WEBPACK_IMPORTED_MODULE_1__[\"number\"]\n  })\n};\nComputerPanel.defaultProps = {\n  bounds: {}\n};\nconst styles = aphrodite__WEBPACK_IMPORTED_MODULE_2__[\"StyleSheet\"].create({\n  previewContainer: {\n    maxHeight: '250px',\n    overflow: 'hidden',\n    boxSizing: 'border-box',\n    margin: '5rem .375rem 0',\n    position: 'relative'\n  },\n  previewArea: {\n    width: '100%',\n    height: '100%',\n    maxHeight: '250px',\n    boxSizing: 'border-box',\n    objectFit: 'contain',\n    overflow: 'hidden'\n  }\n});\n\n//# sourceURL=webpack:///./src/rce/plugins/shared/Upload/ComputerPanel.js?");
 
 /***/ })