@instructure/canvas-rce 5.10.0 → 5.11.1

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 (55) hide show
  1. package/CHANGELOG.md +42 -0
  2. package/Dockerfile +1 -1
  3. package/es/common/mimeClass.js +70 -67
  4. package/es/enhance-user-content/doc_previews.js +1 -1
  5. package/es/enhance-user-content/enhance_user_content.js +9 -1
  6. package/es/getThemeVars.js +3 -4
  7. package/es/rce/RCE.js +1 -3
  8. package/es/rce/RCEWrapper.js +3 -67
  9. package/es/rce/RceHtmlEditor.js +28 -8
  10. package/es/rce/plugins/instructure_links/components/Link.js +3 -9
  11. package/es/rce/plugins/instructure_links/components/LinkSet.js +4 -8
  12. package/es/rce/plugins/instructure_links/components/NoResults.js +5 -10
  13. package/es/rce/plugins/instructure_links/plugin.js +1 -7
  14. package/es/rce/plugins/instructure_rce_external_tools/components/ExternalToolDialog/ExternalToolDialog.js +1 -2
  15. package/es/rce/plugins/instructure_rce_external_tools/components/ExternalToolDialog/ExternalToolDialogTray.js +6 -12
  16. package/es/rce/plugins/instructure_rce_external_tools/components/ExternalToolSelectionDialog/ExternalToolSelectionDialog.js +2 -2
  17. package/es/rce/plugins/instructure_rce_external_tools/lti13-content-items/models/ResourceLinkContentItem.js +1 -1
  18. package/es/rce/plugins/instructure_record/VideoOptionsTray/TrayController.js +7 -2
  19. package/es/rce/plugins/instructure_record/VideoOptionsTray/index.js +3 -9
  20. package/es/rce/plugins/instructure_wordcount/components/WordCountModal.js +8 -16
  21. package/es/rce/plugins/shared/CanvasContentTray.js +7 -1
  22. package/es/rce/plugins/shared/fileTypeUtils.js +14 -6
  23. package/es/rce/plugins/tinymce-a11y-checker/components/{color-field.js → ColorField.js} +9 -7
  24. package/es/rce/plugins/tinymce-a11y-checker/components/checker.js +27 -24
  25. package/es/rce/root.js +1 -3
  26. package/es/rce/transformContent.js +8 -0
  27. package/es/sidebar/actions/upload.js +3 -1
  28. package/jest/jest-setup.js +2 -0
  29. package/lib/common/mimeClass.js +70 -67
  30. package/lib/enhance-user-content/doc_previews.js +1 -1
  31. package/lib/enhance-user-content/enhance_user_content.js +9 -1
  32. package/lib/getThemeVars.js +3 -4
  33. package/lib/rce/RCE.js +1 -3
  34. package/lib/rce/RCEWrapper.js +3 -67
  35. package/lib/rce/RceHtmlEditor.js +28 -8
  36. package/lib/rce/plugins/instructure_links/components/Link.js +3 -9
  37. package/lib/rce/plugins/instructure_links/components/LinkSet.js +4 -8
  38. package/lib/rce/plugins/instructure_links/components/NoResults.js +5 -10
  39. package/lib/rce/plugins/instructure_links/plugin.js +1 -7
  40. package/lib/rce/plugins/instructure_rce_external_tools/components/ExternalToolDialog/ExternalToolDialog.js +1 -2
  41. package/lib/rce/plugins/instructure_rce_external_tools/components/ExternalToolDialog/ExternalToolDialogTray.js +6 -12
  42. package/lib/rce/plugins/instructure_rce_external_tools/components/ExternalToolSelectionDialog/ExternalToolSelectionDialog.js +2 -2
  43. package/lib/rce/plugins/instructure_rce_external_tools/lti13-content-items/models/ResourceLinkContentItem.js +1 -1
  44. package/lib/rce/plugins/instructure_record/VideoOptionsTray/TrayController.js +7 -2
  45. package/lib/rce/plugins/instructure_record/VideoOptionsTray/index.js +3 -9
  46. package/lib/rce/plugins/instructure_wordcount/components/WordCountModal.js +8 -16
  47. package/lib/rce/plugins/shared/CanvasContentTray.js +7 -1
  48. package/lib/rce/plugins/shared/fileTypeUtils.js +14 -6
  49. package/lib/rce/plugins/tinymce-a11y-checker/components/{color-field.js → ColorField.js} +9 -7
  50. package/lib/rce/plugins/tinymce-a11y-checker/components/checker.js +27 -24
  51. package/lib/rce/root.js +1 -3
  52. package/lib/rce/transformContent.js +8 -0
  53. package/lib/sidebar/actions/upload.js +3 -1
  54. package/locales/en.json +1438 -89
  55. package/package.json +52 -51
package/CHANGELOG.md CHANGED
@@ -5,34 +5,67 @@ 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.1 - 2023-10-12
9
+
10
+ ### Fixed
11
+
12
+ - An issue where the RCE can't be built due to an extraneous dependency
13
+
14
+ ## 5.11.0 - 2023-10-10
15
+
16
+ ### Fixed
17
+
18
+ - Fix styling on a11y checker why IconButton
19
+ - fix instui8 regression in course link tray (RCE)
20
+ - focus close button on ECL tray launch
21
+ - fix video media comment in speedgrader
22
+
23
+ ### Changed
24
+
25
+ - Bump instui to 8.45.0
26
+ - update dockerfiles for node 18
27
+ - InstUI 8 upgrade post-work: theme -> themeOverride
28
+ - Allow other users to view media in discussions
29
+ - Revert "Stop rendering title and CC panels on media tray for locked attachments"
30
+
31
+ ### Added
32
+
33
+ - respond to all postMessages in active RCE
34
+
8
35
  ## 5.10.0 - 2023-09-26
9
36
 
10
37
  ### Fixed
38
+
11
39
  - An issue where media controls don't respond in Safari
12
40
  - An issue where embedded Studio videos cause unresponsiveness
13
41
  - A potential race condition in postMessage forwarding
14
42
 
15
43
  ### Changed
44
+
16
45
  - Ignore a11y check on elements with a background image or gradient
17
46
  - Remove math processing percentage indicator
18
47
 
19
48
  ## 5.9.0 - 2023-08-30
20
49
 
21
50
  ### Fixed
51
+
22
52
  - An issue where LTI postMessages were not working inside active RCE
23
53
 
24
54
  ### Changed
55
+
25
56
  - Encrypt auto-saved RCE content
26
57
  - Remove dependency on `@instructure/filter-console-messages`
27
58
 
28
59
  ## 5.8.0 - 2023-08-15
29
60
 
30
61
  ### Fixed
62
+
31
63
  - An issue where filenames are incorrectly recognized in the accessibility checker
32
64
  - An issue where the accessibility checker's color picker would not work with invalid RGBA values
33
65
  - An issue where the RCS is required to use the new external tools plugin
34
66
 
35
67
  ### Changed
68
+
36
69
  - Removed CJS build from package
37
70
  - Renamed .js files to .jsx
38
71
  - Upgraded react-aria-live dependency to v2.0.5
@@ -41,6 +74,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
41
74
  - Reduced amount of console errors when running jest tests by providing missing props, fixing async issues, etc in tests
42
75
 
43
76
  ### Added
77
+
44
78
  - New translations
45
79
  - Improved messaging in the Add Course Link tray when there's no results
46
80
  - Explanations for inherited media captions
@@ -48,27 +82,32 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
48
82
  ## 5.7.0 - 2023-07-18
49
83
 
50
84
  ### Fixed
85
+
51
86
  - Some broken translations in the 'Edit Course Link' tray and the word count modal
52
87
  - Some Typescript errors
53
88
  - An issue where the a11y checker incorrectly shows the issues icon
54
89
 
55
90
  ### Changed
91
+
56
92
  - Removed the `rce_new_external_tool_dialog_in_canvas` feature flag
57
93
  - Removed the deprecated `instructure_external_tools` package code which was not in use
58
94
  - Replaced themeable with emotion
59
95
 
60
96
  ### Added
97
+
61
98
  - Selected link indicator alert for screenreaders in the 'Edit Course Link' tray
62
99
 
63
100
  ## 5.6.17 - 2023-06-27
64
101
 
65
102
  ### Fixed
103
+
66
104
  - Added some missing media translations
67
105
  - Fixed some a11y/usability issues in the 'Edit Course Link' tray
68
106
  - Fixed an icon maker bug related to image compression
69
107
  - Fixed some issues related to pasting images in Firefox and embedding media
70
108
 
71
109
  ### Changed
110
+
72
111
  - Removed the `rce_improved_placeholders`, `rce_better_paste`, `rce_show_studio_media_options`, and
73
112
  `buttons_and_icons_cropper` feature flags
74
113
  - Improved the accessibility checker's performance
@@ -76,10 +115,12 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
76
115
  ## 5.6.16 - 2023-05-17
77
116
 
78
117
  ### Fixed
118
+
79
119
  - Fullscreen issues with several select components
80
120
  - A significant number of missing translations across various locales
81
121
 
82
122
  ### Changed
123
+
83
124
  - Restored previous mathjax delimiter config
84
125
  - Absorbed the `tinymce-a11y-checker` plugin
85
126
  - Updated the placeholders when inserting media, images, files, etc.
@@ -87,6 +128,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
87
128
  - Moved MathML to one shared location
88
129
 
89
130
  ### Added
131
+
90
132
  - Studio Media Options plugin
91
133
  - Equilibrium button to the Equation Editor
92
134
  - 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;
@@ -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,67 +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
- } // NOTE: the code to encode/decode `sourceToolInfo` is duplicated in
2738
- // the ui/features/post_message_forwarding/index.ts, and
2739
- // cannot be DRY'd because RCE is in a package
2740
-
2741
-
2742
- if (e.origin === rceWindow.origin) {
2743
- const {
2744
- sourceToolInfo,
2745
- ...messageWithoutSourceToolInfo
2746
- } = message;
2747
- const targetOrigin = sourceToolInfo === null || sourceToolInfo === void 0 ? void 0 : sourceToolInfo.origin;
2748
- const targetWindow = windowReferences[sourceToolInfo === null || sourceToolInfo === void 0 ? void 0 : sourceToolInfo.windowId];
2749
-
2750
- if (!targetOrigin || !targetWindow) {
2751
- return false;
2752
- }
2753
-
2754
- targetWindow === null || targetWindow === void 0 ? void 0 : targetWindow.postMessage(messageWithoutSourceToolInfo, targetOrigin);
2755
- } else {
2756
- // message is from tool, forward to Canvas window
2757
- // We can't forward the whole `e.source` window in the postMessage,
2758
- // so we keep a list (`windowReferences`) of all windows we've received
2759
- // messages from, and include the index into that list as `windowId`
2760
- let windowId = windowReferences.indexOf(e.source);
2761
-
2762
- if (windowId === -1) {
2763
- windowReferences.push(e.source);
2764
- windowId = windowReferences.length - 1;
2765
- }
2766
-
2767
- const newMessage = { ...message,
2768
- sourceToolInfo: {
2769
- origin: e.origin,
2770
- windowId
2771
- },
2772
- frameName: rceWindow.name
2773
- };
2774
- rceWindow.parent.postMessage(newMessage, rceWindow.origin);
2775
- }
2776
- };
2777
-
2778
2720
  this.fixToolbarKeyboardNavigation = () => {
2779
2721
  var _this$_elementRef$cur2;
2780
2722
 
@@ -3200,19 +3142,15 @@ class RCEWrapper extends React.Component {
3200
3142
  getRequiredFeatureStatuses() {
3201
3143
  const {
3202
3144
  new_math_equation_handling = false,
3203
- rce_ux_improvements = false,
3204
3145
  explicit_latex_typesetting = false,
3205
3146
  rce_transform_loaded_content = false,
3206
- media_links_use_attachment_id = false,
3207
- improved_no_results_messaging = false
3147
+ media_links_use_attachment_id = false
3208
3148
  } = this.props.features;
3209
3149
  return {
3210
3150
  new_math_equation_handling,
3211
- rce_ux_improvements,
3212
3151
  explicit_latex_typesetting,
3213
3152
  rce_transform_loaded_content,
3214
- media_links_use_attachment_id,
3215
- improved_no_results_messaging
3153
+ media_links_use_attachment_id
3216
3154
  };
3217
3155
  }
3218
3156
 
@@ -3220,8 +3158,7 @@ class RCEWrapper extends React.Component {
3220
3158
  return {
3221
3159
  locale: normalizeLocale(this.props.language),
3222
3160
  flashAlertTimeout: this.props.flashAlertTimeout,
3223
- timezone: this.props.timezone,
3224
- lockedAttachments: this.props.lockedAttachments
3161
+ timezone: this.props.timezone
3225
3162
  };
3226
3163
  }
3227
3164
 
@@ -4257,7 +4194,6 @@ RCEWrapper.defaultProps = {
4257
4194
  canvasOrigin: ''
4258
4195
  };
4259
4196
  RCEWrapper.skinCssInjected = false;
4260
- RCEWrapper.editorFrameName = 'active_rce_frame';
4261
4197
 
4262
4198
  function mergeMenuItems(standard, custom) {
4263
4199
  var _custom$trim;
@@ -28,6 +28,28 @@ const RceHtmlEditor = /*#__PURE__*/React.forwardRef((_ref, editorRef) => {
28
28
  const [code, setCode] = useState(props.code);
29
29
  const label = formatMessage('html code editor');
30
30
  const [dir, setDir] = useState(getComputedStyle(document.body, null).direction);
31
+ const [codeMirrorEditorDiv, setCodeMirrorEditorDiv] = useState(null);
32
+ useEffect(() => {
33
+ ;
34
+
35
+ (async () => {
36
+ const p = new Promise(resolve => {
37
+ const timerid = setInterval(() => {
38
+ // scoping querySelector to the container div makes sure we're targeting this CodeEditor
39
+ // The CodeMirror docs (https://codemirror.net/doc/manual.html#styling)
40
+ // say this is the element we use to set the editor's height
41
+ const editor = editorRef.current.querySelector('.CodeMirror');
42
+
43
+ if (editor) {
44
+ clearInterval(timerid);
45
+ setCodeMirrorEditorDiv(editor);
46
+ resolve();
47
+ }
48
+ }, 60);
49
+ });
50
+ await p;
51
+ })();
52
+ }, [editorRef]);
31
53
  useEffect(() => {
32
54
  setCode(beautify.html(props.code)); // eslint-disable-next-line react-hooks/exhaustive-deps
33
55
  }, []);
@@ -57,14 +79,12 @@ const RceHtmlEditor = /*#__PURE__*/React.forwardRef((_ref, editorRef) => {
57
79
  setDir(getComputedStyle(editorRef.current || document.body, null).direction);
58
80
  }, [dir, editorRef]);
59
81
  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]);
82
+ if (codeMirrorEditorDiv) {
83
+ codeMirrorEditorDiv.CodeMirror.setSize(null, props.height);
84
+ codeMirrorEditorDiv.style.margin = '0';
85
+ codeMirrorEditorDiv.style.border = '0';
86
+ }
87
+ }, [codeMirrorEditorDiv, props.height]);
68
88
  const isFocused = useRef(false); // move cursor to the top of the html code when the editor is focused for the first time
69
89
 
70
90
  const handleFocus = useCallback((editor, event) => {
@@ -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() {
@@ -23,11 +23,7 @@ import { Flex } from '@instructure/ui-flex';
23
23
  import { Text } from '@instructure/ui-text';
24
24
  import { Link } from '@instructure/ui-link';
25
25
  import formatMessage from '../../../../format-message';
26
- import { getIcon } from '../../shared/linkUtils'; // Doing this to avoid TS2339 errors-- remove once we're on InstUI 8
27
-
28
- const {
29
- Item: FlexItem
30
- } = Flex;
26
+ import { getIcon } from '../../shared/linkUtils';
31
27
  export function buildUrl(contextType, contextId, collectionType) {
32
28
  var _typeMap$collectionTy;
33
29
 
@@ -72,15 +68,14 @@ export const NoResults = _ref => {
72
68
  justifyItems: "center",
73
69
  alignItems: "center",
74
70
  direction: "column"
75
- }, /*#__PURE__*/React.createElement(FlexItem, null, /*#__PURE__*/React.createElement(Icon, {
71
+ }, /*#__PURE__*/React.createElement(Flex.Item, null, /*#__PURE__*/React.createElement(Icon, {
76
72
  size: "large",
77
73
  color: "secondary",
78
74
  padding: "large"
79
- })), /*#__PURE__*/React.createElement(FlexItem, {
75
+ })), /*#__PURE__*/React.createElement(Flex.Item, {
80
76
  margin: "small 0 0"
81
- }, /*#__PURE__*/React.createElement(Text, null, getMessage(collectionType, isSearchResult))), !isSearchResult && /*#__PURE__*/React.createElement(FlexItem, null, /*#__PURE__*/React.createElement(Link, {
82
- href: buildUrl(contextType, contextId, collectionType) // @ts-expect-error
83
- ,
77
+ }, /*#__PURE__*/React.createElement(Text, null, getMessage(collectionType, isSearchResult))), !isSearchResult && /*#__PURE__*/React.createElement(Flex.Item, null, /*#__PURE__*/React.createElement(Link, {
78
+ href: buildUrl(contextType, contextId, collectionType),
84
79
  target: "_blank"
85
80
  }, formatMessage('Add one!')))));
86
81
  };
@@ -68,20 +68,14 @@ import bridge from '../../../bridge';
68
68
  import { getAnchorElement, isOKToLink } from '../../contentInsertionUtils';
69
69
  import LinkOptionsTrayController from './components/LinkOptionsTray/LinkOptionsTrayController';
70
70
  import { CREATE_LINK, EDIT_LINK } from './components/LinkOptionsDialog/LinkOptionsDialogController';
71
- import RCEGlobals from '../../RCEGlobals';
72
71
  import tinymce from 'tinymce';
73
72
  const trayController = new LinkOptionsTrayController();
74
73
  const COURSE_PLUGIN_KEY = 'course_links';
75
74
  const GROUP_PLUGIN_KEY = 'group_links';
76
75
 
77
76
  function getCommandName(selectedNode) {
78
- var _RCEGlobals$getFeatur;
79
-
80
- // show the Course Tray if it's a course link and the ux improvement flag is on,
81
- // otherwise show the default Link Tray
82
- const showCourseLinkTray = !!((_RCEGlobals$getFeatur = RCEGlobals.getFeatures()) !== null && _RCEGlobals$getFeatur !== void 0 && _RCEGlobals$getFeatur.rce_ux_improvements);
83
77
  const isCourseLink = selectedNode.getAttribute('data-course-type');
84
- return showCourseLinkTray && isCourseLink ? 'instructureTrayForCourseLinks' : 'instructureTrayToEditLink';
78
+ return isCourseLink ? 'instructureTrayForCourseLinks' : 'instructureTrayToEditLink';
85
79
  }
86
80
 
87
81
  function selectedAnchorCount(ed) {
@@ -31,7 +31,6 @@ import { ExternalToolDialogTray } from './ExternalToolDialogTray';
31
31
  import { ExternalToolDialogModal } from './ExternalToolDialogModal';
32
32
  import { showFlashAlert } from '../../../../../common/FlashAlert';
33
33
  import { parseUrlOrNull } from '../../../../../util/url-util';
34
- const FlexItem = Flex.Item;
35
34
  export default class ExternalToolDialog extends React.Component {
36
35
  constructor() {
37
36
  super(...arguments);
@@ -246,7 +245,7 @@ export default class ExternalToolDialog extends React.Component {
246
245
  }, formatMessage('The following content is partner provided'))), !state.iframeLoaded && /*#__PURE__*/React.createElement(Flex, {
247
246
  alignItems: "center",
248
247
  justifyItems: "center"
249
- }, /*#__PURE__*/React.createElement(FlexItem, null, /*#__PURE__*/React.createElement(Spinner, {
248
+ }, /*#__PURE__*/React.createElement(Flex.Item, null, /*#__PURE__*/React.createElement(Spinner, {
250
249
  renderTitle: formatMessage('Loading External Tool'),
251
250
  size: "large",
252
251
  margin: "0 0 0 medium"