@instructure/canvas-rce 5.14.0 → 5.14.2

package/es/rce/plugins/instructure_search_and_replace/components/FindReplaceTray.js

@@ -1,5 +1,4 @@
 import _pt from "prop-types";
-
 /*
  * Copyright (C) 2019 - present Instructure, Inc.
  *
@@ -17,10 +16,12 @@ import _pt from "prop-types";
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
+
 import React, { useEffect, useRef, useState } from 'react';
 import { Button, CloseButton } from '@instructure/ui-buttons';
 import { Flex } from '@instructure/ui-flex';
 import { Heading } from '@instructure/ui-heading';
+import { IconWarningSolid } from '@instructure/ui-icons';
 import { getTrayHeight } from '../../shared/trayUtils';
 import { View } from '@instructure/ui-view';
 import { instuiPopupMountNode } from '../../../../util/fullscreenHelpers';
@@ -50,23 +51,20 @@ export default function FindReplaceTray(_ref) {
   const [alertReplaceText, setAlertReplaceText] = useState('');
   const trayRef = useRef(null);
   const liveRegionKey = useRef(0);
-  const srDupKey = useRef(0); // moves RCE when tray opens/closes, copied from CanvasContentTray
-
+  const srDupKey = useRef(0);
+  // moves RCE when tray opens/closes, copied from CanvasContentTray
   useEffect(() => {
     var _trayRef$current;
-
     if (!hasOpened) return;
     let c = document.querySelector('[role="main"]');
     let target_w = 0;
     if (!c) return;
     const margin = window.getComputedStyle(c).direction === 'ltr' ? document.body.getBoundingClientRect().right - c.getBoundingClientRect().right : c.getBoundingClientRect().left;
     target_w = c.offsetWidth - ((_trayRef$current = trayRef.current) === null || _trayRef$current === void 0 ? void 0 : _trayRef$current.offsetWidth) + margin;
-
     if (target_w >= 320 && target_w < c.offsetWidth) {
       c.style.boxSizing = 'border-box';
       c.style.width = `${target_w}px`;
     }
-
     return () => {
       c = document.querySelector('[role="main"]');
       if (!c) return;
@@ -76,10 +74,9 @@ export default function FindReplaceTray(_ref) {
   useEffect(() => {
     if (initialText) {
       onFind(initialText);
-    } // eslint-disable-next-line react-hooks/exhaustive-deps
-
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
-
   function usePrevious(value) {
     const ref = useRef();
     useEffect(() => {
@@ -87,7 +84,6 @@ export default function FindReplaceTray(_ref) {
     }, [value]);
     return ref.current;
   }
-
   const prepend = selectionContext[0];
   const append = selectionContext[1];
   const srContextMsg = formatMessage('{prepend}{findText}{append}', {
@@ -97,15 +93,12 @@ export default function FindReplaceTray(_ref) {
   });
   const previousSrMsg = usePrevious(srContextMsg);
   const previousFindText = usePrevious(findText);
-
   const handleTextChange = e => {
     setFindText(e.target.value);
     onFind(e.target.value);
   };
-
   const handleFindKeyDown = e => {
     if (e.key !== 'Enter') return;
-
     if (e.shiftKey) {
       if (isButtonDisabled('previous')) return;
       onPrevious();
@@ -115,33 +108,27 @@ export default function FindReplaceTray(_ref) {
         onFind(findText);
         return;
       }
-
       if (isButtonDisabled('next')) return;
       onNext();
     }
   };
-
   const handleReplaceKeyDown = e => {
     if (e.key !== 'Enter') return;
     if (isButtonDisabled('replace')) return;
     const forward = !e.shiftKey;
     replace(replaceText, forward, false);
   };
-
   const replace = (newText, forward, all) => {
     onReplace(newText, forward, all);
-
     if (all) {
       setShowReplaceAlert('replaceAll');
     } else {
       setShowReplaceAlert('replace');
     }
-
     setAlertFindText(findText);
     setAlertReplaceText(newText);
     liveRegionKey.current++;
   };
-
   const alertText = showReplaceAlert === '' ? '' : showReplaceAlert === 'replace' ? formatMessage('Replaced {alertFindText} with {alertReplaceText}', {
     alertFindText,
     alertReplaceText
@@ -149,13 +136,11 @@ export default function FindReplaceTray(_ref) {
     alertFindText,
     alertReplaceText
   });
-
   const renderReplaceAlert = () => {
     if (!showReplaceAlert) {
       liveRegionKey.current = 0;
       return /*#__PURE__*/React.createElement(React.Fragment, null);
     }
-
     return /*#__PURE__*/React.createElement(Alert, {
       variant: "success",
       renderCloseButtonLabel: "Close Alert",
@@ -165,26 +150,31 @@ export default function FindReplaceTray(_ref) {
       timeout: 3000
     }, alertText);
   };
-
   const renderScreenReaderAlert = () => {
     return /*#__PURE__*/React.createElement(ScreenReaderContent, null, alertText);
   };
-
-  const errMsg = formatMessage('No results found');
+  const errMsg = /*#__PURE__*/React.createElement(Flex, {
+    gap: "xx-small",
+    alignItems: "center"
+  }, /*#__PURE__*/React.createElement(IconWarningSolid, {
+    color: "error",
+    "data-testid": "error-icon"
+  }), /*#__PURE__*/React.createElement(Text, {
+    color: "danger",
+    size: "small"
+  }, formatMessage('No results found')));
   const messages = findText && max === 0 ? [{
     text: errMsg,
     type: 'error'
   }] : [];
-
   const resultText = () => {
-    const srErrMsg = messages.length === 0 ? '' : errMsg; // resolves issue where focus is lost when this (dis)appears
-
+    const srErrMsg = messages.length === 0 ? '' : errMsg;
+    // resolves issue where focus is lost when this (dis)appears
     if (max === 0) {
       return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ScreenReaderContent, {
         "aria-live": "polite"
       }, srErrMsg), /*#__PURE__*/React.createElement(Text, null));
     }
-
     const msg = formatMessage('{index} of {max}', {
       index,
       max
@@ -192,12 +182,12 @@ export default function FindReplaceTray(_ref) {
     const srResultMsg = formatMessage('Result {index} of {max}.', {
       index,
       max
-    }); // necessary to force screen reader to read the same message while typing
+    });
 
+    // necessary to force screen reader to read the same message while typing
     if (srContextMsg === previousSrMsg && previousFindText != findText) {
       srDupKey.current++;
     } else srDupKey.current = 0;
-
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(View, {
       as: "span",
       key: srDupKey.current,
@@ -208,24 +198,19 @@ export default function FindReplaceTray(_ref) {
       "aria-hidden": "true"
     }, msg));
   };
-
   const isButtonDisabled = button => {
     switch (button) {
       case 'next':
       case 'previous':
         return max < 2;
-
       case 'replace':
         return !replaceText || index === 0;
-
       case 'replaceAll':
         return !replaceText || max < 2 || index === 0;
-
       default:
         return false;
     }
   };
-
   return /*#__PURE__*/React.createElement(Tray, {
     "data-mce-component": true,
     label: formatMessage('Find and Replace'),

package/es/rce/plugins/instructure_search_and_replace/components/FindReplaceTrayController.js

@@ -1,5 +1,4 @@
 import _pt from "prop-types";
-
 /*
  * Copyright (C) 2019 - present Instructure, Inc.
  *
@@ -17,6 +16,7 @@ import _pt from "prop-types";
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
+
 import React, { useState } from 'react';
 import FindReplaceTray from './FindReplaceTray';
 export default function FindReplaceTrayController(_ref) {
@@ -31,15 +31,12 @@ export default function FindReplaceTrayController(_ref) {
   const [findIndex, setFindIndex] = useState(0);
   const [findCount, setFindCount] = useState(0);
   const [selectionContext, setSelectionContext] = useState(['', '']);
-
   const updateSelectionContext = () => {
     const srText = getSelectionContext();
     setSelectionContext(srText);
   };
-
   const newFindIndex = direction => {
     let newIndex = 0;
-
     if (findCount === 0) {
       newIndex = 0;
     } else if (direction === 1) {
@@ -53,34 +50,28 @@ export default function FindReplaceTrayController(_ref) {
         newIndex = findCount;
       } else newIndex = findIndex - 1;
     }
-
     return newIndex;
   };
-
   const done = () => {
     plugin.done(false);
     setFindCount(0);
     setFindIndex(0);
     setSelectionContext([]);
   };
-
   const handleDismiss = () => {
     done();
     onDismiss();
   };
-
   const handleNext = () => {
     plugin.next();
     setFindIndex(newFindIndex(1));
     updateSelectionContext();
   };
-
   const handlePrevious = () => {
     plugin.prev();
     setFindIndex(newFindIndex(-1));
     updateSelectionContext();
   };
-
   const handleFind = text => {
     if (!text) {
       done();
@@ -92,34 +83,28 @@ export default function FindReplaceTrayController(_ref) {
       updateSelectionContext();
     }
   };
-
   const handleReplace = function (text) {
     let forward = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
     let all = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
     if (!text) return;
     undoManager === null || undoManager === void 0 ? void 0 : undoManager.add();
     plugin.replace(text, forward, all);
-
     if (findCount === 1 || all) {
       done();
       return;
-    } // we can't just find again, because that will reset index to 1
-
-
+    }
+    // we can't just find again, because that will reset index to 1
     let newIndex;
     const newFindCount = findCount - 1;
-
     if (forward) {
       newIndex = findIndex === findCount ? 1 : findIndex;
     } else {
       newIndex = findIndex === 1 ? newFindCount : findIndex - 1;
     }
-
     setFindCount(newFindCount);
     setFindIndex(newIndex);
     updateSelectionContext();
   };
-
   return /*#__PURE__*/React.createElement(FindReplaceTray, {
     onRequestClose: handleDismiss,
     onNext: handleNext,

package/es/rce/plugins/instructure_search_and_replace/getSelectionContext.js

@@ -15,49 +15,42 @@
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
-const NUMBER_OF_WORDS = 10;
 
+const NUMBER_OF_WORDS = 10;
 const countWords = text => {
   // ignore text before the first whitespace because it is part of the selected text
   const countText = text.split(/\s+/).slice(1).join(' ');
   const count = countText.trim().split(/\s+/).length;
   return count;
 };
-
 const getAfterText = startingElement => {
   let text = '';
   let element = startingElement.nextSibling;
-
   while (element) {
     text += element.textContent;
     element = element.nextSibling;
   }
-
   if (text.includes('.')) {
     const index = text.indexOf('.');
     text = text.substring(0, index + 1);
   }
-
   if (countWords(text) > NUMBER_OF_WORDS) {
     text = text.split(/\s+/).slice(0, NUMBER_OF_WORDS + 1).join(' ');
   }
-
   return text;
 };
-
 const getBeforeText = (startingElement, wordCount) => {
   let text = '';
   let element = startingElement.previousSibling;
-
   while (element) {
     text = element.textContent + text;
     element = element.previousSibling;
   }
-
   text = text.split(/\s+/).slice(-wordCount - 1).join(' ');
   return text;
 };
 
+// eslint-disable-next-line no-undef
 export const getSelectionContext = elements => {
   const firstSelected = elements[0];
   const lastSelected = elements[elements.length - 1];

package/es/rce/plugins/instructure_search_and_replace/plugin.js

@@ -15,19 +15,17 @@
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
+
 import tinymce from 'tinymce';
 import formatMessage from '../../../format-message';
 import clickCallback from './clickCallback';
 tinymce.PluginManager.add('instructure_search_and_replace', function (editor) {
   var _editor$plugins;
-
   // We use the searchreplace plugins API
   if (!((_editor$plugins = editor.plugins) !== null && _editor$plugins !== void 0 && _editor$plugins.searchreplace)) return;
-
   const launchFindModal = ed => () => {
     clickCallback(ed, document);
   };
-
   editor.addCommand('launch_instructure_search_and_replace', launchFindModal(editor));
   editor.ui.registry.addMenuItem('instructure_search_and_replace', {
     text: formatMessage('Find and Replace'),

package/es/rce/plugins/instructure_studio_media_options/plugin.js

@@ -15,6 +15,7 @@
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
+
 import tinymce from 'tinymce';
 import { isStudioEmbeddedMedia, handleBeforeObjectSelected } from '../shared/StudioLtiSupportUtils';
 import VideoTrayController from '../instructure_record/VideoOptionsTray/TrayController';
@@ -25,7 +26,6 @@ tinymce.PluginManager.add('instructure_studio_media_options', function (ed) {
     onAction() {
       studioTrayController.showTrayForEditor(ed);
     },
-
     text: formatMessage('Studio Media Options'),
     tooltip: formatMessage('Show Studio media options')
   });

package/es/rce/plugins/instructure_wordcount/clickCallback.js

@@ -15,6 +15,7 @@
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
+
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { generateRows, HEADERS } from './utils/tableContent';
@@ -25,22 +26,18 @@ export default function (ed, document, options) {
       WordCountModal
     } = _ref;
     let container = document.querySelector(`#${MODAL_ID}`);
-
     if (!container) {
       container = document.createElement('div');
       container.id = MODAL_ID;
       document.body.appendChild(container);
     }
-
     const handleDismiss = () => {
       if (container) {
         ReactDOM.unmountComponentAtNode(container);
       }
-
       ed.focus(options.skipEditorFocus);
     };
-
-    ReactDOM.render( /*#__PURE__*/React.createElement(WordCountModal, {
+    ReactDOM.render(/*#__PURE__*/React.createElement(WordCountModal, {
       headers: HEADERS,
       rows: generateRows(ed),
       onDismiss: handleDismiss

package/es/rce/plugins/instructure_wordcount/components/WordCountModal.js

@@ -1,6 +1,4 @@
 import _pt from "prop-types";
-// @ts-nocheck
-
 /*
  * Copyright (C) 2022 - present Instructure, Inc.
  *
@@ -18,6 +16,7 @@ import _pt from "prop-types";
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
+
 import React from 'react';
 import { Modal } from '@instructure/ui-modal';
 import { BaseButton, CloseButton } from '@instructure/ui-buttons';
@@ -25,7 +24,6 @@ import { Heading } from '@instructure/ui-heading';
 import { Table } from '@instructure/ui-table';
 import formatMessage from '../../../../format-message';
 import { instuiPopupMountNode } from '../../../../util/fullscreenHelpers';
-
 const renderBody = (headers, rows) => {
   return /*#__PURE__*/React.createElement(Table, {
     caption: formatMessage('Word Count')
@@ -55,7 +53,6 @@ const renderBody = (headers, rows) => {
     }, selectionCount));
   })));
 };
-
 export const WordCountModal = _ref3 => {
   let {
     headers,

package/es/rce/plugins/instructure_wordcount/plugin.js

@@ -15,6 +15,7 @@
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
+
 import tinymce from 'tinymce';
 import formatMessage from '../../../format-message';
 import clickCallback from './clickCallback';

package/es/rce/plugins/instructure_wordcount/utils/countContent.js

@@ -15,6 +15,7 @@
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
+
 export const IGNORE_WORDCOUNT_ATTRIBUTE = 'data-ignore-wordcount';
 export const countWords = node => {
   if (node.getAttribute(IGNORE_WORDCOUNT_ATTRIBUTE) === 'chars-only') return 0;
@@ -26,7 +27,6 @@ export const countWords = node => {
 export const countCharsNoSpaces = node => {
   const textContent = (node === null || node === void 0 ? void 0 : node.innerText) || '';
   const matches = textContent.match(/ /g); // a single space
-
   const spaces = matches ? matches.length : 0;
   return countChars(node) - spaces;
 };
@@ -34,21 +34,17 @@ export const countChars = node => {
   const textContent = (node === null || node === void 0 ? void 0 : node.innerText) || '';
   const iterator = textContent[Symbol.iterator]();
   let count = 0;
-
   while (!iterator.next().done) {
     count++;
   }
-
   return count;
 };
 export const callbackForCategory = category => {
   switch (category) {
     case 'words':
       return countWords;
-
     case 'chars-no-spaces':
       return countCharsNoSpaces;
-
     case 'chars':
       return countChars;
   }
@@ -61,14 +57,11 @@ export const countShouldIgnore = (ed, scope, category) => {
 };
 export const getTinymceCount = (ed, scope, category) => {
   const wc = ed.plugins.wordcount[scope];
-
   switch (category) {
     case 'words':
       return wc.getWordCount();
-
     case 'chars-no-spaces':
       return wc.getCharacterCountWithoutSpaces();
-
     case 'chars':
       return wc.getCharacterCount();
   }

package/es/rce/plugins/instructure_wordcount/utils/tableContent.js

@@ -15,6 +15,7 @@
  * You should have received a copy of the GNU Affero General Public License along
  * with this program. If not, see <http://www.gnu.org/licenses/>.
  */
+
 import { countContent } from './countContent';
 import formatMessage from '../../../../format-message';
 export const HEADERS = [{