@instructure/canvas-rce 5.9.0 → 5.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (79) hide show
  1. package/.mocharc.js +7 -0
  2. package/CHANGELOG.md +47 -0
  3. package/Dockerfile +1 -1
  4. package/es/common/mimeClass.js +70 -67
  5. package/es/enhance-user-content/doc_previews.js +1 -1
  6. package/es/enhance-user-content/enhance_user_content.js +9 -1
  7. package/es/enhance-user-content/mathml.js +8 -5
  8. package/es/getThemeVars.js +3 -4
  9. package/es/rce/RCE.js +1 -3
  10. package/es/rce/RCEWrapper.js +3 -48
  11. package/es/rce/RceHtmlEditor.js +20 -38
  12. package/es/rce/plugins/instructure_equation/EquationEditorModal/parseLatex.js +0 -2
  13. package/es/rce/plugins/instructure_links/components/Link.js +3 -9
  14. package/es/rce/plugins/instructure_links/components/LinkSet.js +4 -8
  15. package/es/rce/plugins/instructure_links/components/NoResults.js +5 -10
  16. package/es/rce/plugins/instructure_links/plugin.js +1 -7
  17. package/es/rce/plugins/instructure_rce_external_tools/components/ExternalToolDialog/ExternalToolDialog.js +1 -2
  18. package/es/rce/plugins/instructure_rce_external_tools/components/ExternalToolDialog/ExternalToolDialogModal.js +4 -5
  19. package/es/rce/plugins/instructure_rce_external_tools/components/ExternalToolDialog/ExternalToolDialogTray.js +6 -12
  20. package/es/rce/plugins/instructure_rce_external_tools/components/ExternalToolSelectionDialog/ExternalToolSelectionDialog.js +2 -2
  21. package/es/rce/plugins/instructure_rce_external_tools/lti13-content-items/models/ResourceLinkContentItem.js +1 -1
  22. package/es/rce/plugins/instructure_record/VideoOptionsTray/TrayController.js +7 -2
  23. package/es/rce/plugins/instructure_record/VideoOptionsTray/index.js +3 -9
  24. package/es/rce/plugins/instructure_wordcount/components/WordCountModal.js +8 -16
  25. package/es/rce/plugins/shared/CanvasContentTray.js +15 -9
  26. package/es/rce/plugins/shared/ContentSelection.js +7 -3
  27. package/es/rce/plugins/shared/ImageCropper/Preview.js +8 -7
  28. package/es/rce/plugins/shared/LinkDisplay.js +2 -2
  29. package/es/rce/plugins/shared/fileTypeUtils.js +14 -6
  30. package/{lib/rce/plugins/tinymce-a11y-checker/components/color-field.js → es/rce/plugins/tinymce-a11y-checker/components/ColorField.js} +9 -7
  31. package/es/rce/plugins/tinymce-a11y-checker/components/checker.js +27 -24
  32. package/es/rce/plugins/tinymce-a11y-checker/rules/large-text-contrast.js +9 -0
  33. package/es/rce/plugins/tinymce-a11y-checker/rules/small-text-contrast.js +9 -0
  34. package/es/rce/root.js +1 -3
  35. package/es/rce/transformContent.js +8 -0
  36. package/es/sidebar/actions/upload.js +3 -1
  37. package/es/translations/locales/de.js +4 -4
  38. package/jest/jest-setup.js +2 -1
  39. package/lib/common/mimeClass.js +70 -67
  40. package/lib/enhance-user-content/doc_previews.js +1 -1
  41. package/lib/enhance-user-content/enhance_user_content.js +9 -1
  42. package/lib/enhance-user-content/mathml.js +8 -5
  43. package/lib/getThemeVars.js +3 -4
  44. package/lib/rce/RCE.js +1 -3
  45. package/lib/rce/RCEWrapper.js +3 -48
  46. package/lib/rce/RceHtmlEditor.js +20 -38
  47. package/lib/rce/plugins/instructure_equation/EquationEditorModal/parseLatex.js +0 -2
  48. package/lib/rce/plugins/instructure_links/components/Link.js +3 -9
  49. package/lib/rce/plugins/instructure_links/components/LinkSet.js +4 -8
  50. package/lib/rce/plugins/instructure_links/components/NoResults.js +5 -10
  51. package/lib/rce/plugins/instructure_links/plugin.js +1 -7
  52. package/lib/rce/plugins/instructure_rce_external_tools/components/ExternalToolDialog/ExternalToolDialog.js +1 -2
  53. package/lib/rce/plugins/instructure_rce_external_tools/components/ExternalToolDialog/ExternalToolDialogModal.js +4 -5
  54. package/lib/rce/plugins/instructure_rce_external_tools/components/ExternalToolDialog/ExternalToolDialogTray.js +6 -12
  55. package/lib/rce/plugins/instructure_rce_external_tools/components/ExternalToolSelectionDialog/ExternalToolSelectionDialog.js +2 -2
  56. package/lib/rce/plugins/instructure_rce_external_tools/lti13-content-items/models/ResourceLinkContentItem.js +1 -1
  57. package/lib/rce/plugins/instructure_record/VideoOptionsTray/TrayController.js +7 -2
  58. package/lib/rce/plugins/instructure_record/VideoOptionsTray/index.js +3 -9
  59. package/lib/rce/plugins/instructure_wordcount/components/WordCountModal.js +8 -16
  60. package/lib/rce/plugins/shared/CanvasContentTray.js +15 -9
  61. package/lib/rce/plugins/shared/ContentSelection.js +7 -3
  62. package/lib/rce/plugins/shared/ImageCropper/Preview.js +8 -7
  63. package/lib/rce/plugins/shared/LinkDisplay.js +2 -2
  64. package/lib/rce/plugins/shared/fileTypeUtils.js +14 -6
  65. package/{es/rce/plugins/tinymce-a11y-checker/components/color-field.js → lib/rce/plugins/tinymce-a11y-checker/components/ColorField.js} +9 -7
  66. package/lib/rce/plugins/tinymce-a11y-checker/components/checker.js +27 -24
  67. package/lib/rce/plugins/tinymce-a11y-checker/rules/large-text-contrast.js +9 -0
  68. package/lib/rce/plugins/tinymce-a11y-checker/rules/small-text-contrast.js +9 -0
  69. package/lib/rce/root.js +1 -3
  70. package/lib/rce/transformContent.js +8 -0
  71. package/lib/sidebar/actions/upload.js +3 -1
  72. package/lib/translations/locales/de.js +4 -4
  73. package/locales/en.json +1438 -89
  74. package/package.json +58 -55
  75. package/canvas/README.md +0 -84
  76. package/canvas/locales/en.json +0 -934
  77. package/canvas/package.json +0 -189
  78. package/es/rce/getBrowser.js +0 -53
  79. package/lib/rce/getBrowser.js +0 -53
package/.mocharc.js CHANGED
@@ -15,6 +15,13 @@
15
15
  * You should have received a copy of the GNU Affero General Public License along
16
16
  * with this program. If not, see <http://www.gnu.org/licenses/>.
17
17
  */
18
+
19
+ global.MutationObserver = class {
20
+ disconnect() {}
21
+
22
+ observe() {}
23
+ }
24
+
18
25
  module.exports = {
19
26
  require: [
20
27
  '@instructure/canvas-theme',
package/CHANGELOG.md CHANGED
@@ -5,23 +5,61 @@ All notable changes to this project will be documented in this file.
5
5
  The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
6
6
  and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
7
7
 
8
+ ## 5.11.0 - 2023-10-10
9
+
10
+ ### Fixed
11
+
12
+ - Fix styling on a11y checker why IconButton
13
+ - fix instui8 regression in course link tray (RCE)
14
+ - focus close button on ECL tray launch
15
+ - fix video media comment in speedgrader
16
+
17
+ ### Changed
18
+
19
+ - Bump instui to 8.45.0
20
+ - update dockerfiles for node 18
21
+ - InstUI 8 upgrade post-work: theme -> themeOverride
22
+ - Allow other users to view media in discussions
23
+ - Revert "Stop rendering title and CC panels on media tray for locked attachments"
24
+
25
+ ### Added
26
+
27
+ - respond to all postMessages in active RCE
28
+
29
+ ## 5.10.0 - 2023-09-26
30
+
31
+ ### Fixed
32
+
33
+ - An issue where media controls don't respond in Safari
34
+ - An issue where embedded Studio videos cause unresponsiveness
35
+ - A potential race condition in postMessage forwarding
36
+
37
+ ### Changed
38
+
39
+ - Ignore a11y check on elements with a background image or gradient
40
+ - Remove math processing percentage indicator
41
+
8
42
  ## 5.9.0 - 2023-08-30
9
43
 
10
44
  ### Fixed
45
+
11
46
  - An issue where LTI postMessages were not working inside active RCE
12
47
 
13
48
  ### Changed
49
+
14
50
  - Encrypt auto-saved RCE content
15
51
  - Remove dependency on `@instructure/filter-console-messages`
16
52
 
17
53
  ## 5.8.0 - 2023-08-15
18
54
 
19
55
  ### Fixed
56
+
20
57
  - An issue where filenames are incorrectly recognized in the accessibility checker
21
58
  - An issue where the accessibility checker's color picker would not work with invalid RGBA values
22
59
  - An issue where the RCS is required to use the new external tools plugin
23
60
 
24
61
  ### Changed
62
+
25
63
  - Removed CJS build from package
26
64
  - Renamed .js files to .jsx
27
65
  - Upgraded react-aria-live dependency to v2.0.5
@@ -30,6 +68,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
30
68
  - Reduced amount of console errors when running jest tests by providing missing props, fixing async issues, etc in tests
31
69
 
32
70
  ### Added
71
+
33
72
  - New translations
34
73
  - Improved messaging in the Add Course Link tray when there's no results
35
74
  - Explanations for inherited media captions
@@ -37,27 +76,32 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
37
76
  ## 5.7.0 - 2023-07-18
38
77
 
39
78
  ### Fixed
79
+
40
80
  - Some broken translations in the 'Edit Course Link' tray and the word count modal
41
81
  - Some Typescript errors
42
82
  - An issue where the a11y checker incorrectly shows the issues icon
43
83
 
44
84
  ### Changed
85
+
45
86
  - Removed the `rce_new_external_tool_dialog_in_canvas` feature flag
46
87
  - Removed the deprecated `instructure_external_tools` package code which was not in use
47
88
  - Replaced themeable with emotion
48
89
 
49
90
  ### Added
91
+
50
92
  - Selected link indicator alert for screenreaders in the 'Edit Course Link' tray
51
93
 
52
94
  ## 5.6.17 - 2023-06-27
53
95
 
54
96
  ### Fixed
97
+
55
98
  - Added some missing media translations
56
99
  - Fixed some a11y/usability issues in the 'Edit Course Link' tray
57
100
  - Fixed an icon maker bug related to image compression
58
101
  - Fixed some issues related to pasting images in Firefox and embedding media
59
102
 
60
103
  ### Changed
104
+
61
105
  - Removed the `rce_improved_placeholders`, `rce_better_paste`, `rce_show_studio_media_options`, and
62
106
  `buttons_and_icons_cropper` feature flags
63
107
  - Improved the accessibility checker's performance
@@ -65,10 +109,12 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
65
109
  ## 5.6.16 - 2023-05-17
66
110
 
67
111
  ### Fixed
112
+
68
113
  - Fullscreen issues with several select components
69
114
  - A significant number of missing translations across various locales
70
115
 
71
116
  ### Changed
117
+
72
118
  - Restored previous mathjax delimiter config
73
119
  - Absorbed the `tinymce-a11y-checker` plugin
74
120
  - Updated the placeholders when inserting media, images, files, etc.
@@ -76,6 +122,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
76
122
  - Moved MathML to one shared location
77
123
 
78
124
  ### Added
125
+
79
126
  - Studio Media Options plugin
80
127
  - Equilibrium button to the Equation Editor
81
128
  - Icon support for iWork files
package/Dockerfile CHANGED
@@ -1,4 +1,4 @@
1
- FROM instructure/node:16
1
+ FROM instructure/node:18
2
2
 
3
3
  ARG NPM_PRIVATE_SCOPE
4
4
  ARG NPM_PRIVATE_REGISTRY
@@ -42,75 +42,78 @@ export function mimeClass(file) {
42
42
  } else {
43
43
  const contentType = getContentType(file); // NOTE: Keep this list in sync with what's in canvas-lms/app/models/attachment.rb
44
44
 
45
- return {
46
- 'text/html': 'html',
47
- 'text/x-csharp': 'code',
48
- 'text/xml': 'code',
49
- 'text/css': 'code',
50
- text: 'text',
51
- 'text/plain': 'text',
52
- 'application/rtf': 'doc',
53
- 'text/rtf': 'doc',
54
- 'application/vnd.oasis.opendocument.text': 'doc',
55
- 'application/pdf': 'pdf',
56
- 'application/vnd.openxmlformats-officedocument.wordprocessingml.document': 'doc',
57
- 'application/vnd.apple.pages': 'doc',
58
- 'application/x-docx': 'doc',
59
- 'application/msword': 'doc',
60
- 'application/vnd.ms-powerpoint': 'ppt',
61
- 'application/vnd.openxmlformats-officedocument.presentationml.presentation': 'ppt',
62
- 'applicatoin/vnd.apple.key': 'ppt',
63
- 'application/vnd.ms-excel': 'xls',
64
- 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': 'xls',
65
- 'application/vnd.apple.numbers': 'xls',
66
- 'application/vnd.oasis.opendocument.spreadsheet': 'xls',
67
- 'image/jpeg': 'image',
68
- 'image/pjpeg': 'image',
69
- 'image/png': 'image',
70
- 'image/gif': 'image',
71
- 'image/bmp': 'image',
72
- 'image/svg+xml': 'image',
73
- 'image/webp': 'image',
74
- 'application/x-rar': 'zip',
75
- 'application/x-rar-compressed': 'zip',
76
- 'application/x-zip': 'zip',
77
- 'application/x-zip-compressed': 'zip',
78
- 'application/xml': 'code',
79
- 'application/zip': 'zip',
80
- 'audio/mp3': 'audio',
81
- 'audio/mpeg': 'audio',
82
- 'audio/basic': 'audio',
83
- 'audio/mid': 'audio',
84
- 'audio/3gpp': 'audio',
85
- 'audio/x-aiff': 'audio',
86
- 'audio/x-m4a': 'audio',
87
- 'audio/x-mpegurl': 'audio',
88
- 'audio/x-ms-wma': 'audio',
89
- 'audio/x-pn-realaudio': 'audio',
90
- 'audio/x-wav': 'audio',
91
- 'audio/mp4': 'audio',
92
- 'audio/wav': 'audio',
93
- 'audio/webm': 'audio',
94
- 'audio/*': 'audio',
95
- audio: 'audio',
96
- 'video/mpeg': 'video',
97
- 'video/quicktime': 'video',
98
- 'video/x-la-asf': 'video',
99
- 'video/x-ms-asf': 'video',
100
- 'video/x-ms-wma': 'audio',
101
- 'video/x-ms-wmv': 'video',
102
- 'video/x-msvideo': 'video',
103
- 'video/x-sgi-movie': 'video',
104
- 'video/3gpp': 'video',
105
- 'video/mp4': 'video',
106
- 'video/webm': 'video',
107
- 'video/avi': 'video',
108
- 'video/*': 'video',
109
- video: 'video',
110
- 'application/x-shockwave-flash': 'flash'
111
- }[contentType] || file.mime_class || 'file';
45
+ return contentMapping(contentType) || file.mime_class || 'file';
112
46
  }
113
47
  }
48
+ export function contentMapping(contentType) {
49
+ return {
50
+ 'text/html': 'html',
51
+ 'text/x-csharp': 'code',
52
+ 'text/xml': 'code',
53
+ 'text/css': 'code',
54
+ text: 'text',
55
+ 'text/plain': 'text',
56
+ 'application/rtf': 'doc',
57
+ 'text/rtf': 'doc',
58
+ 'application/vnd.oasis.opendocument.text': 'doc',
59
+ 'application/pdf': 'pdf',
60
+ 'application/vnd.openxmlformats-officedocument.wordprocessingml.document': 'doc',
61
+ 'application/vnd.apple.pages': 'doc',
62
+ 'application/x-docx': 'doc',
63
+ 'application/msword': 'doc',
64
+ 'application/vnd.ms-powerpoint': 'ppt',
65
+ 'application/vnd.openxmlformats-officedocument.presentationml.presentation': 'ppt',
66
+ 'applicatoin/vnd.apple.key': 'ppt',
67
+ 'application/vnd.ms-excel': 'xls',
68
+ 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': 'xls',
69
+ 'application/vnd.apple.numbers': 'xls',
70
+ 'application/vnd.oasis.opendocument.spreadsheet': 'xls',
71
+ 'image/jpeg': 'image',
72
+ 'image/pjpeg': 'image',
73
+ 'image/png': 'image',
74
+ 'image/gif': 'image',
75
+ 'image/bmp': 'image',
76
+ 'image/svg+xml': 'image',
77
+ 'image/webp': 'image',
78
+ 'application/x-rar': 'zip',
79
+ 'application/x-rar-compressed': 'zip',
80
+ 'application/x-zip': 'zip',
81
+ 'application/x-zip-compressed': 'zip',
82
+ 'application/xml': 'code',
83
+ 'application/zip': 'zip',
84
+ 'audio/mp3': 'audio',
85
+ 'audio/mpeg': 'audio',
86
+ 'audio/basic': 'audio',
87
+ 'audio/mid': 'audio',
88
+ 'audio/3gpp': 'audio',
89
+ 'audio/x-aiff': 'audio',
90
+ 'audio/x-m4a': 'audio',
91
+ 'audio/x-mpegurl': 'audio',
92
+ 'audio/x-ms-wma': 'audio',
93
+ 'audio/x-pn-realaudio': 'audio',
94
+ 'audio/x-wav': 'audio',
95
+ 'audio/mp4': 'audio',
96
+ 'audio/wav': 'audio',
97
+ 'audio/webm': 'audio',
98
+ 'audio/*': 'audio',
99
+ audio: 'audio',
100
+ 'video/mpeg': 'video',
101
+ 'video/quicktime': 'video',
102
+ 'video/x-la-asf': 'video',
103
+ 'video/x-ms-asf': 'video',
104
+ 'video/x-ms-wma': 'audio',
105
+ 'video/x-ms-wmv': 'video',
106
+ 'video/x-msvideo': 'video',
107
+ 'video/x-sgi-movie': 'video',
108
+ 'video/3gpp': 'video',
109
+ 'video/mp4': 'video',
110
+ 'video/webm': 'video',
111
+ 'video/avi': 'video',
112
+ 'video/*': 'video',
113
+ video: 'video',
114
+ 'application/x-shockwave-flash': 'flash'
115
+ }[contentType];
116
+ }
114
117
 
115
118
  function getContentType(file) {
116
119
  return file['content-type'] || file.content_type || file.type;
@@ -65,7 +65,7 @@ export function showLoadingImage($link) {
65
65
 
66
66
  ReactDOM.render( /*#__PURE__*/React.createElement(Spinner, {
67
67
  size: "x-small",
68
- title: formatMessage('Loading')
68
+ renderTitle: formatMessage('Loading')
69
69
  }), $imageHolder);
70
70
  return $link;
71
71
  }
@@ -216,8 +216,16 @@ export function enhanceUserContent() {
216
216
  iframeElem.setAttribute('src', addParentFrameContextToUrl(src, containingCanvasLtiToolId));
217
217
  }
218
218
  });
219
- }
219
+ } // tell LTI tools that they are launching from within the active RCE
220
+
221
+
222
+ unenhanced_elem.querySelectorAll('iframe[src]').forEach(iframeElem => {
223
+ const src = iframeElem.getAttribute('src');
220
224
 
225
+ if (src.startsWith(canvasOrigin)) {
226
+ iframeElem.setAttribute('src', src.replace('display=in_rce', 'display=borderless'));
227
+ }
228
+ });
221
229
  unenhanced_elem.querySelectorAll('a:not(.not_external, .external)').forEach(childLink => {
222
230
  if (!isExternalLink(childLink, canvasOrigin)) return;
223
231
  if (childLink.tagName === 'IMG' || childLink.querySelectorAll('img').length > 0) return;
@@ -45,7 +45,8 @@ const localConfig = {
45
45
  }
46
46
  }
47
47
  },
48
- showMathMenu: true
48
+ showMathMenu: true,
49
+ messageStyle: 'none'
49
50
  };
50
51
 
51
52
  class Mathml {
@@ -106,7 +107,7 @@ class Mathml {
106
107
  window.MathJax.Hub.Register.MessageHook('Math Processing Error', function (message) {
107
108
  var _elem$parentElement;
108
109
 
109
- const elem = message[1]; // ".math_equation_latex" is the elem we added for MathJax to typeset the image equation
110
+ const elem = Array.isArray(message[1]) ? message[1][0] : message[1]; // ".math_equation_latex" is the elem we added for MathJax to typeset the image equation
110
111
 
111
112
  if ((_elem$parentElement = elem.parentElement) !== null && _elem$parentElement !== void 0 && _elem$parentElement.classList.contains('math_equation_latex')) {
112
113
  var _elem$parentElement$p;
@@ -123,7 +124,7 @@ class Mathml {
123
124
  }
124
125
  });
125
126
  window.MathJax.Hub.Register.MessageHook('End Math', function (message) {
126
- const elem = message[1];
127
+ const elem = Array.isArray(message[1]) ? message[1][0] : message[1];
127
128
  mathImageHelper.removeStrayEquationImages(elem);
128
129
  mathImageHelper.nearlyInfiniteStyleFix(elem);
129
130
  elem.querySelectorAll('.math_equation_latex').forEach(m => m.classList.add('fade-in-equation'));
@@ -138,7 +139,8 @@ class Mathml {
138
139
  // Since we want to ignore <math> in .hidden-readable spans, let's remove the MathJunk™
139
140
  // right after MathJax adds it.
140
141
  window.MathJax.Hub.Register.MessageHook('End Math', function (message) {
141
- $(message[1]).find('.hidden-readable [class^="MathJax"], .hidden-readable [id^="MathJax"]').remove();
142
+ const elm = Array.isArray(message[1]) ? message[1][0] : message[1];
143
+ $(elm).find('.hidden-readable [class^="MathJax"], .hidden-readable [id^="MathJax"]').remove();
142
144
  });
143
145
  } // leaving this here so I don't have to keep looking up how to see all messages
144
146
  // window.MathJax.Hub.Startup.signal.Interest(function (message) {
@@ -315,7 +317,8 @@ const mathImageHelper = {
315
317
  },
316
318
 
317
319
  catchEquationImages(refnode) {
318
- // find equation images and replace with inline LaTeX
320
+ refnode = Array.isArray(refnode) ? refnode[0] : refnode; // find equation images and replace with inline LaTeX
321
+
319
322
  const eqimgs = refnode.querySelectorAll('img.equation_image');
320
323
 
321
324
  if (eqimgs.length > 0) {
@@ -15,8 +15,7 @@
15
15
  * You should have received a copy of the GNU Affero General Public License along
16
16
  * with this program. If not, see <http://www.gnu.org/licenses/>.
17
17
  */
18
- import { ThemeRegistry } from '@instructure/ui-themeable'; // ^^ at InstUI 8, just directly import getRegistry directly from @instructure/theme-registry
19
-
18
+ import { getRegistry } from '@instructure/theme-registry';
20
19
  import { merge, cloneDeep } from 'lodash'; // The running theme is the running theme for this page load, and it never
21
20
  // changes, so there's no point in doing the work more than once.
22
21
 
@@ -28,13 +27,13 @@ function getThemeVars() {
28
27
  defaultThemeKey,
29
28
  overrides,
30
29
  themes
31
- } = ThemeRegistry.getRegistry(); // Just assume the "canvas" theme if the default key is null. This will
30
+ } = getRegistry(); // Just assume the "canvas" theme if the default key is null. This will
32
31
  // never happen in the live app because one way or another a theme gets
33
32
  // used, but unit tests don't always do that.
34
33
  // Also we have to cloneDeep this because the merge below is about to
35
34
  // mutate the whole thing.
36
35
 
37
- const variables = cloneDeep(themes[defaultThemeKey !== null && defaultThemeKey !== void 0 ? defaultThemeKey : 'canvas'].variables);
36
+ const variables = cloneDeep(themes[defaultThemeKey !== null && defaultThemeKey !== void 0 ? defaultThemeKey : 'canvas']);
38
37
  merge(variables, overrides);
39
38
  memoizedVariables = {
40
39
  variables,
package/es/rce/RCE.js CHANGED
@@ -1,5 +1,3 @@
1
- var _process, _process$env;
2
-
3
1
  // @ts-nocheck
4
2
 
5
3
  /*
@@ -29,7 +27,7 @@ import tinyRCE from './tinyRCE';
29
27
  import getTranslations from '../getTranslations';
30
28
  import '@instructure/canvas-theme';
31
29
 
32
- if (!((_process = process) !== null && _process !== void 0 && (_process$env = _process.env) !== null && _process$env !== void 0 && _process$env.BUILD_LOCALE)) {
30
+ if (!process || !process.env || !undefined) {
33
31
  formatMessage.setup({
34
32
  locale: 'en',
35
33
  generateId: require('format-message-generate-id/underscored_crc32'),
@@ -2714,48 +2714,9 @@ class RCEWrapper extends React.Component {
2714
2714
 
2715
2715
  this.checkAccessibility();
2716
2716
  this.fixToolbarKeyboardNavigation();
2717
- this.forwardPostMessages();
2718
2717
  (_this$props$onInitted = (_this$props = this.props).onInitted) === null || _this$props$onInitted === void 0 ? void 0 : _this$props$onInitted.call(_this$props, editor);
2719
2718
  };
2720
2719
 
2721
- this.forwardPostMessages = () => {
2722
- const windowReferences = {};
2723
- const rceWindow = this.editor.getWin(); // explicitly assign name for reference by parent window
2724
-
2725
- rceWindow.name = `${RCEWrapper.editorFrameName}_${this.id}`;
2726
- rceWindow.addEventListener('message', this.forwardPostMessagesHandler(rceWindow, windowReferences));
2727
- };
2728
-
2729
- this.forwardPostMessagesHandler = (rceWindow, windowReferences) => e => {
2730
- let message;
2731
-
2732
- try {
2733
- message = typeof e.data === 'string' ? JSON.parse(e.data) : e.data;
2734
- } catch (err) {
2735
- // unparseable message may not be meant for our handlers
2736
- return false;
2737
- }
2738
-
2739
- if (e.origin === rceWindow.origin) {
2740
- // message is from Canvas window, forward to tool
2741
- const targetOrigin = message.toolOrigin;
2742
-
2743
- if (!targetOrigin) {
2744
- return false;
2745
- }
2746
-
2747
- const targetWindow = windowReferences[targetOrigin];
2748
- delete message.toolOrigin;
2749
- targetWindow === null || targetWindow === void 0 ? void 0 : targetWindow.postMessage(message, targetOrigin);
2750
- } else {
2751
- // message is from tool, forward to Canvas window
2752
- windowReferences[e.origin] = e.source;
2753
- message.toolOrigin = e.origin;
2754
- message.frameName = rceWindow.name;
2755
- rceWindow.parent.postMessage(message, rceWindow.origin);
2756
- }
2757
- };
2758
-
2759
2720
  this.fixToolbarKeyboardNavigation = () => {
2760
2721
  var _this$_elementRef$cur2;
2761
2722
 
@@ -3181,19 +3142,15 @@ class RCEWrapper extends React.Component {
3181
3142
  getRequiredFeatureStatuses() {
3182
3143
  const {
3183
3144
  new_math_equation_handling = false,
3184
- rce_ux_improvements = false,
3185
3145
  explicit_latex_typesetting = false,
3186
3146
  rce_transform_loaded_content = false,
3187
- media_links_use_attachment_id = false,
3188
- improved_no_results_messaging = false
3147
+ media_links_use_attachment_id = false
3189
3148
  } = this.props.features;
3190
3149
  return {
3191
3150
  new_math_equation_handling,
3192
- rce_ux_improvements,
3193
3151
  explicit_latex_typesetting,
3194
3152
  rce_transform_loaded_content,
3195
- media_links_use_attachment_id,
3196
- improved_no_results_messaging
3153
+ media_links_use_attachment_id
3197
3154
  };
3198
3155
  }
3199
3156
 
@@ -3201,8 +3158,7 @@ class RCEWrapper extends React.Component {
3201
3158
  return {
3202
3159
  locale: normalizeLocale(this.props.language),
3203
3160
  flashAlertTimeout: this.props.flashAlertTimeout,
3204
- timezone: this.props.timezone,
3205
- lockedAttachments: this.props.lockedAttachments
3161
+ timezone: this.props.timezone
3206
3162
  };
3207
3163
  }
3208
3164
 
@@ -4238,7 +4194,6 @@ RCEWrapper.defaultProps = {
4238
4194
  canvasOrigin: ''
4239
4195
  };
4240
4196
  RCEWrapper.skinCssInjected = false;
4241
- RCEWrapper.editorFrameName = 'active_rce_frame';
4242
4197
 
4243
4198
  function mergeMenuItems(standard, custom) {
4244
4199
  var _custom$trim;
@@ -15,10 +15,10 @@
15
15
  * You should have received a copy of the GNU Affero General Public License along
16
16
  * with this program. If not, see <http://www.gnu.org/licenses/>.
17
17
  */
18
- import React, { useCallback, useEffect, useRef, useState } from 'react';
18
+ import React, { useEffect, useState } from 'react';
19
19
  import { func, string } from 'prop-types';
20
20
  import formatMessage from '../format-message';
21
- import { CodeEditor } from '@instructure/ui-code-editor';
21
+ import { SourceCodeEditor } from '@instructure/ui-source-code-editor';
22
22
  import beautify from 'js-beautify';
23
23
  const RceHtmlEditor = /*#__PURE__*/React.forwardRef((_ref, editorRef) => {
24
24
  let {
@@ -56,25 +56,7 @@ const RceHtmlEditor = /*#__PURE__*/React.forwardRef((_ref, editorRef) => {
56
56
 
57
57
  setDir(getComputedStyle(editorRef.current || document.body, null).direction);
58
58
  }, [dir, editorRef]);
59
- useEffect(() => {
60
- // scoping querySelector to the container div makes sure we're targeting this CodeEditor
61
- // The CodeMirror docs (https://codemirror.net/doc/manual.html#styling)
62
- // say this is the element we use to set the editor's height
63
- const editor = editorRef.current.querySelector('.CodeMirror');
64
- editor.CodeMirror.setSize(null, props.height);
65
- editor.style.margin = '0';
66
- editor.style.border = '0';
67
- }, [props.height, editorRef]);
68
- const isFocused = useRef(false); // move cursor to the top of the html code when the editor is focused for the first time
69
-
70
- const handleFocus = useCallback((editor, event) => {
71
- if (!isFocused.current) {
72
- editor.setCursor(0, 0);
73
- isFocused.current = true;
74
- }
75
-
76
- onFocus(event);
77
- }, [onFocus]); // setting height on the container keeps the RCE toolbar from jumping
59
+ const direction = ['ltr', 'rtl'].includes(dir) ? dir : 'ltr'; // setting height on the container keeps the RCE toolbar from jumping
78
60
 
79
61
  return /*#__PURE__*/React.createElement("div", {
80
62
  ref: editorRef,
@@ -84,28 +66,28 @@ const RceHtmlEditor = /*#__PURE__*/React.forwardRef((_ref, editorRef) => {
84
66
  overflow: 'hidden',
85
67
  textAlign: 'start'
86
68
  }
87
- }, /*#__PURE__*/React.createElement(CodeEditor, {
69
+ }, /*#__PURE__*/React.createElement(SourceCodeEditor, {
88
70
  label: label,
89
- language: "html",
90
- options: {
91
- lineNumbers: true,
92
- lineWrapping: true,
93
- autofocus: false,
94
- spellcheck: true,
95
- extraKeys: {
96
- Tab: false,
97
- 'Shift-Tab': false
98
- },
99
- screenReaderLabel: label,
100
- direction: dir,
101
- rtlMoveVisually: true
102
- },
71
+ language: "html" // see LF-745 for tracking of the following:
72
+ // TODO: needs prop for
73
+ // options={{
74
+ // extraKeys: {Tab: false, 'Shift-Tab': false},
75
+ // }}
76
+ // TODO: may need
77
+ // attachment={none | bottom | top}
78
+ ,
79
+ lineNumbers: true,
80
+ lineWrapping: true,
81
+ autoFocus: false,
82
+ spellcheck: true,
83
+ direction: direction,
84
+ rtlMoveVisually: true,
85
+ height: props.height,
103
86
  value: code,
104
87
  onChange: value => {
105
88
  setCode(value);
106
89
  props.onChange(value);
107
- },
108
- onFocus: handleFocus
90
+ }
109
91
  }));
110
92
  });
111
93
  RceHtmlEditor.propTypes = {
@@ -68,8 +68,6 @@ export const parseLatex = editor => {
68
68
  };
69
69
  } catch (ex) {
70
70
  // probably failed to create the new URL
71
- // eslint-disable-next-line no-console
72
- console.error(ex);
73
71
  return {};
74
72
  }
75
73
  } else if (wholeText) {
@@ -31,8 +31,6 @@ import { IconDragHandleLine, IconPublishSolid, IconUnpublishedSolid } from '@ins
31
31
  import RCEGlobals from '../../../RCEGlobals';
32
32
  import { getIcon } from '../../shared/linkUtils';
33
33
  export default function Link(props) {
34
- var _RCEGlobals$getFeatur;
35
-
36
34
  const internalLink = { ...props.link
37
35
  };
38
36
  const [isHovering, setIsHovering] = useState(false);
@@ -43,14 +41,10 @@ export default function Link(props) {
43
41
  date_type
44
42
  } = props.link;
45
43
  const type = props.type === 'quizzes' && props.link.quiz_type === 'quizzes.next' ? 'quizzes.next' : props.type;
44
+ internalLink['data-course-type'] = type; // Only included published attr if it makes sense for the link type
46
45
 
47
- if ((_RCEGlobals$getFeatur = RCEGlobals.getFeatures()) !== null && _RCEGlobals$getFeatur !== void 0 && _RCEGlobals$getFeatur.rce_ux_improvements) {
48
- internalLink['data-course-type'] = type; // Only included published attr if it makes sense for the link type
49
-
50
- const publishable = !['navigation', 'announcements'].includes(type);
51
- internalLink['data-published'] = publishable ? published : null;
52
- }
53
-
46
+ const publishable = !['navigation', 'announcements'].includes(type);
47
+ internalLink['data-published'] = publishable ? published : null;
54
48
  const Icon = getIcon(type);
55
49
  const color = published ? 'success' : 'primary';
56
50
  let dateString = null;
@@ -113,7 +113,7 @@ class LinkSet extends Component {
113
113
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ScreenReaderContent, {
114
114
  id: this.describedByID
115
115
  }, formatMessage('Click to insert a link into the editor.')), /*#__PURE__*/React.createElement(List, {
116
- variant: "unstyled",
116
+ isUnstyled: true,
117
117
  as: "ul",
118
118
  margin: "0"
119
119
  }, this.props.collection.links.map((link, index, array) => {
@@ -137,18 +137,14 @@ class LinkSet extends Component {
137
137
  }
138
138
 
139
139
  renderEmptyIndicator() {
140
- var _RCEGlobals$getFeatur, _this$props$searchStr;
140
+ var _this$props$searchStr;
141
141
 
142
- return (_RCEGlobals$getFeatur = RCEGlobals.getFeatures()) !== null && _RCEGlobals$getFeatur !== void 0 && _RCEGlobals$getFeatur.improved_no_results_messaging ? /*#__PURE__*/React.createElement(NoResults, {
142
+ return /*#__PURE__*/React.createElement(NoResults, {
143
143
  contextType: this.props.contextType,
144
144
  contextId: this.props.contextId,
145
145
  collectionType: this.props.type,
146
146
  isSearchResult: ((_this$props$searchStr = this.props.searchString) === null || _this$props$searchStr === void 0 ? void 0 : _this$props$searchStr.length) >= 3
147
- }) : /*#__PURE__*/React.createElement(View, {
148
- as: "div",
149
- role: "alert",
150
- padding: "medium"
151
- }, formatMessage('No results.'));
147
+ });
152
148
  }
153
149
 
154
150
  renderLoadingError() {