@instructure/canvas-rce 5.10.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 (58) hide show
  1. package/CHANGELOG.md +36 -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 +20 -38
  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/{lib/rce/plugins/tinymce-a11y-checker/components/color-field.js → es/rce/plugins/tinymce-a11y-checker/components/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 +20 -38
  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/{es/rce/plugins/tinymce-a11y-checker/components/color-field.js → lib/rce/plugins/tinymce-a11y-checker/components/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 +55 -52
  56. package/canvas/README.md +0 -84
  57. package/canvas/locales/en.json +0 -934
  58. package/canvas/package.json +0 -189
package/CHANGELOG.md CHANGED
@@ -5,34 +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
+
8
29
  ## 5.10.0 - 2023-09-26
9
30
 
10
31
  ### Fixed
32
+
11
33
  - An issue where media controls don't respond in Safari
12
34
  - An issue where embedded Studio videos cause unresponsiveness
13
35
  - A potential race condition in postMessage forwarding
14
36
 
15
37
  ### Changed
38
+
16
39
  - Ignore a11y check on elements with a background image or gradient
17
40
  - Remove math processing percentage indicator
18
41
 
19
42
  ## 5.9.0 - 2023-08-30
20
43
 
21
44
  ### Fixed
45
+
22
46
  - An issue where LTI postMessages were not working inside active RCE
23
47
 
24
48
  ### Changed
49
+
25
50
  - Encrypt auto-saved RCE content
26
51
  - Remove dependency on `@instructure/filter-console-messages`
27
52
 
28
53
  ## 5.8.0 - 2023-08-15
29
54
 
30
55
  ### Fixed
56
+
31
57
  - An issue where filenames are incorrectly recognized in the accessibility checker
32
58
  - An issue where the accessibility checker's color picker would not work with invalid RGBA values
33
59
  - An issue where the RCS is required to use the new external tools plugin
34
60
 
35
61
  ### Changed
62
+
36
63
  - Removed CJS build from package
37
64
  - Renamed .js files to .jsx
38
65
  - Upgraded react-aria-live dependency to v2.0.5
@@ -41,6 +68,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
41
68
  - Reduced amount of console errors when running jest tests by providing missing props, fixing async issues, etc in tests
42
69
 
43
70
  ### Added
71
+
44
72
  - New translations
45
73
  - Improved messaging in the Add Course Link tray when there's no results
46
74
  - Explanations for inherited media captions
@@ -48,27 +76,32 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
48
76
  ## 5.7.0 - 2023-07-18
49
77
 
50
78
  ### Fixed
79
+
51
80
  - Some broken translations in the 'Edit Course Link' tray and the word count modal
52
81
  - Some Typescript errors
53
82
  - An issue where the a11y checker incorrectly shows the issues icon
54
83
 
55
84
  ### Changed
85
+
56
86
  - Removed the `rce_new_external_tool_dialog_in_canvas` feature flag
57
87
  - Removed the deprecated `instructure_external_tools` package code which was not in use
58
88
  - Replaced themeable with emotion
59
89
 
60
90
  ### Added
91
+
61
92
  - Selected link indicator alert for screenreaders in the 'Edit Course Link' tray
62
93
 
63
94
  ## 5.6.17 - 2023-06-27
64
95
 
65
96
  ### Fixed
97
+
66
98
  - Added some missing media translations
67
99
  - Fixed some a11y/usability issues in the 'Edit Course Link' tray
68
100
  - Fixed an icon maker bug related to image compression
69
101
  - Fixed some issues related to pasting images in Firefox and embedding media
70
102
 
71
103
  ### Changed
104
+
72
105
  - Removed the `rce_improved_placeholders`, `rce_better_paste`, `rce_show_studio_media_options`, and
73
106
  `buttons_and_icons_cropper` feature flags
74
107
  - Improved the accessibility checker's performance
@@ -76,10 +109,12 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
76
109
  ## 5.6.16 - 2023-05-17
77
110
 
78
111
  ### Fixed
112
+
79
113
  - Fullscreen issues with several select components
80
114
  - A significant number of missing translations across various locales
81
115
 
82
116
  ### Changed
117
+
83
118
  - Restored previous mathjax delimiter config
84
119
  - Absorbed the `tinymce-a11y-checker` plugin
85
120
  - Updated the placeholders when inserting media, images, files, etc.
@@ -87,6 +122,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
87
122
  - Moved MathML to one shared location
88
123
 
89
124
  ### Added
125
+
90
126
  - Studio Media Options plugin
91
127
  - Equilibrium button to the Equation Editor
92
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;
@@ -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;
@@ -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 = {
@@ -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) {