@instructure/canvas-rce 5.11.1 → 5.12.2

package/lib/rce/plugins/instructure_links/plugin.js

@@ -1,294 +0,0 @@
-// @ts-nocheck
-
-/*
- * Copyright (C) 2019 - present Instructure, Inc.
- *
- * This file is part of Canvas.
- *
- * Canvas is free software: you can redistribute it and/or modify it under
- * the terms of the GNU Affero General Public License as published by the Free
- * Software Foundation, version 3 of the License.
- *
- * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
- * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
- * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
- * details.
- *
- * You should have received a copy of the GNU Affero General Public License along
- * with this program. If not, see <http://www.gnu.org/licenses/>.
- */
-
-/*
- * here's how linking works
- * Creation:
- * 1. No text is selected, user clicks create link button:
- *    - display the create link dialog with text and URL input
- *    - insert an <a> at the caret, linked to the URL with the text content
- * 2. Text is selected, user clicks create link button:
- *    - display the create link dialog with text and URL input
- *    - the text input displays the plain-text content of the selection
- *    - on saving, if the plain-text has not changed, leave it unchanged in the RCE,
- *      if it has changed, replace the selection with the new plain-text.
- *      Wrap the text in an <a>, linked to the URL
- * 3. An image + optional text is selected, user clicks create link button
- *    - display the create link dialog with URL input only
- *    - on saving, the selection is wrapped in an <a>, linked to the URL
- * 4. An iframe is w/in the selection
- *    - disable the create link function
- *
- * Editing:
- * 1. the caret is w/in a text link, but nothing is selected or
- *    some subset of the link's text is selected
- *    - display the link Options popup button. when clicked...
- *    - expand the selection to be the whole link text
- *    - display the tray with the link's plain-text in the text input and the href
- *      in the URL input
- *    - on saving, if the plain-text is unchanged, leave the text unchanged in the RCE,
- *      if it has changed, replace the link text with the new plain-text.
- *      Update the <a>'s href to the new URL
- * 2. An image w/in a link is selected, or the caret is on the image, or the image
- *    plus some surrounding text that's all part of the existing link is selected, or
- *    the caret is w/in a link that contains an image
- *    a. for now: show the link and image Options buttons in a popup toolbar
- *       - on clicking the link Options...
- *       - expand the selection to be the whole link contents
- *       - show the link options tray, with no text input
- *       - on saving, update the link's href
- *    b. new-improved: show a single Options button, when clicked...
- *       - expand the selection to be the whole link contents
- *       - show the options tray with Image Options and Link Options sections
- *         the link text input is empty.
- *       - on saving, if the link text input is still empty, replace the link's
- *         href with the new URL.  if the link text is updated, replace the link's
- *         content with the new plain text (deleting the image)
- */
-import formatMessage from '../../../format-message';
-import clickCallback from './clickCallback';
-import bridge from '../../../bridge';
-import { getAnchorElement, isOKToLink } from '../../contentInsertionUtils';
-import LinkOptionsTrayController from './components/LinkOptionsTray/LinkOptionsTrayController';
-import { CREATE_LINK, EDIT_LINK } from './components/LinkOptionsDialog/LinkOptionsDialogController';
-import tinymce from 'tinymce';
-const trayController = new LinkOptionsTrayController();
-const COURSE_PLUGIN_KEY = 'course_links';
-const GROUP_PLUGIN_KEY = 'group_links';
-
-function getCommandName(selectedNode) {
-  const isCourseLink = selectedNode.getAttribute('data-course-type');
-  return isCourseLink ? 'instructureTrayForCourseLinks' : 'instructureTrayToEditLink';
-}
-
-function selectedAnchorCount(ed) {
-  return ed.selection.getRng().cloneContents().querySelectorAll('a').length;
-}
-
-function getMenuItems(ed) {
-  var _ed$settings$canvas_r;
-
-  const contextType = (_ed$settings$canvas_r = ed.settings.canvas_rce_containing_context) === null || _ed$settings$canvas_r === void 0 ? void 0 : _ed$settings$canvas_r.type;
-  const sel_anchors = ed.selection.isCollapsed() ? 0 : selectedAnchorCount(ed);
-  let items;
-
-  if (getAnchorElement(ed, ed.selection.getNode())) {
-    // cursor is on an anchor, edit or remove it
-    items = [{
-      text: formatMessage('Edit Link'),
-      value: getCommandName(ed.selection.getNode())
-    }, {
-      text: formatMessage('Remove Link'),
-      value: 'instructureUnlink'
-    }];
-  } else {
-    items = [{
-      text: formatMessage('External Link'),
-      value: 'instructureLinkCreate'
-    }];
-
-    if (contextType === 'course') {
-      items.push({
-        text: formatMessage('Course Link'),
-        value: 'instructure_course_links'
-      });
-    } else if (contextType === 'group') {
-      items.push({
-        text: formatMessage('Group Link'),
-        value: 'instructure_group_links'
-      });
-    }
-
-    if (sel_anchors > 0) {
-      // selection contains anchor(s), so the user can remove them
-      items.push({
-        text: formatMessage.plural(sel_anchors, {
-          one: 'Remove Link',
-          other: 'Remove Links'
-        }),
-        value: 'instructureUnlinkAll'
-      });
-    }
-  }
-
-  return items;
-}
-
-function removeAnchorFromSelectedElement(ed) {
-  const selectedElem = ed.selection.getNode();
-  const anchorElem = getAnchorElement(ed, selectedElem);
-  ed.selection.select(anchorElem);
-  ed.undoManager.add();
-  ed.execCommand('Unlink');
-}
-
-function doMenuItem(ed, actionName) {
-  switch (actionName) {
-    case 'instructureTrayToEditLink':
-    case 'instructureTrayForCourseLinks':
-    case 'instructureLinkCreate':
-      ed.execCommand(actionName);
-      break;
-
-    case 'instructureUnlink':
-      removeAnchorFromSelectedElement(ed);
-      break;
-
-    case 'instructureUnlinkAll':
-      ed.undoManager.add();
-      ed.execCommand('unlink');
-      break;
-
-    case 'instructure_course_links':
-      ed.focus(true); // activate the editor without changing focus
-
-      ed.execCommand('instructureTrayForLinks', false, COURSE_PLUGIN_KEY);
-      break;
-
-    case 'instructure_group_links':
-      ed.focus(true); // activate the editor without changing focus
-
-      ed.execCommand('instructureTrayForLinks', false, GROUP_PLUGIN_KEY);
-      break;
-  }
-}
-
-tinymce.PluginManager.add('instructure_links', function (ed) {
-  // Register commands
-  ed.addCommand('instructureLinkCreate', () => clickCallback(ed, CREATE_LINK));
-  ed.addCommand('instructureLinkEdit', () => clickCallback(ed, EDIT_LINK));
-  ed.addCommand('instructureTrayForLinks', (ui, plugin_key) => {
-    bridge.showTrayForPlugin(plugin_key, ed.id);
-  });
-  ed.addCommand('instructureTrayToEditLink', _ui => {
-    trayController.showTrayForEditor(ed);
-  });
-  ed.addCommand('instructureTrayForCourseLinks', () => {
-    ed.selection.select(ed.selection.getNode());
-    return bridge.showTrayForPlugin('course_link_edit', ed.id);
-  }); // Register shortcuts
-
-  ed.addShortcut('Meta+K', '', 'instructureLinkCreate'); // Register menu item
-
-  ed.ui.registry.addNestedMenuItem('instructure_links', {
-    text: formatMessage('Link'),
-    icon: 'link',
-    getSubmenuItems: () => getMenuItems(ed).map(item => {
-      return {
-        type: 'menuitem',
-        text: item.text,
-        onAction: () => doMenuItem(ed, item.value),
-        onSetup: api => {
-          api.setDisabled(!isOKToLink(ed.selection.getContent()));
-          return () => {};
-        }
-      };
-    })
-  }); // Register toolbar button
-
-  ed.ui.registry.addMenuButton('instructure_links', {
-    tooltip: formatMessage('Links'),
-    icon: 'link',
-    fetch: callback => callback(getMenuItems(ed).map(item => ({
-      type: 'menuitem',
-      text: item.text,
-      value: item.value,
-      onAction: () => doMenuItem(ed, item.value)
-    }))),
-
-    onSetup(api) {
-      function handleNodeChange(e) {
-        if (e !== null && e !== void 0 && e.element) {
-          api.setActive(!!getAnchorElement(ed, e.element));
-        }
-
-        api.setDisabled(!isOKToLink(ed.selection.getContent()));
-      } // if the user selects all the content w/in a link and deletes it via the keyboard
-      // make sure the surrounding <a> gets deleted too.
-
-
-      function deleteEmptyLink() {
-        let node = null;
-
-        if (ed.selection.getNode().tagName === 'A') {
-          node = ed.selection.getNode();
-        } else {
-          var _rng$endContainer$nex, _rng$nextSibling;
-
-          // Type checking is disabled here because the code below isn't type safe. The code below
-          // should be updated, specifically rng.endContainer.nextSibling?.tagName
-          const rng = ed.selection.getRng();
-
-          if (rng.commonAncestorContainer === rng.endContainer && ((_rng$endContainer$nex = rng.endContainer.nextSibling) === null || _rng$endContainer$nex === void 0 ? void 0 : _rng$endContainer$nex.tagName) === 'A') {
-            node = rng.endContainer.nextSibling;
-          } else if (((_rng$nextSibling = rng.nextSibling) === null || _rng$nextSibling === void 0 ? void 0 : _rng$nextSibling.tagName) === 'A') {
-            node = rng.nextSibling;
-          }
-        }
-
-        if (node) {
-          var _node$textContent;
-
-          if (node.firstElementChild) {
-            return;
-          }
-
-          const txt = (_node$textContent = node.textContent) === null || _node$textContent === void 0 ? void 0 : _node$textContent.trim();
-
-          if ((txt === null || txt === void 0 ? void 0 : txt.length) === 0) {
-            ed.execCommand('Unlink');
-          }
-        }
-      }
-
-      setTimeout(handleNodeChange, 0, null);
-      ed.on('NodeChange', handleNodeChange);
-      ed.on('Change', deleteEmptyLink);
-      return () => {
-        ed.off('NodeChange', handleNodeChange);
-        ed.off('Change', deleteEmptyLink);
-      };
-    }
-
-  }); // the context toolbar buttons
-
-  ed.ui.registry.addButton('instructure-link-options', {
-    onAction() {
-      ed.execCommand(getCommandName(ed.selection.getNode()), false, ed);
-    },
-
-    text: formatMessage('Link Options'),
-    tooltip: formatMessage('Show link options')
-  });
-  const remButtonLabel = formatMessage('Remove Link');
-  ed.ui.registry.addButton('instructureUnlink', {
-    onAction() {
-      removeAnchorFromSelectedElement(ed);
-    },
-
-    text: remButtonLabel
-  });
-  ed.ui.registry.addContextToolbar('instructure-link-toolbar', {
-    items: 'instructure-link-options instructureUnlink',
-    position: 'node',
-    predicate: elem => !!getAnchorElement(ed, elem),
-    scope: 'node'
-  });
-});

package/lib/rce/plugins/instructure_links/validateURL.js

@@ -1,70 +0,0 @@
-/*
- * Copyright (C) 2020 - present Instructure, Inc.
- *
- * This file is part of Canvas.
- *
- * Canvas is free software: you can redistribute it and/or modify it under
- * the terms of the GNU Affero General Public License as published by the Free
- * Software Foundation, version 3 of the License.
- *
- * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
- * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
- * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
- * details.
- *
- * You should have received a copy of the GNU Affero General Public License along
- * with this program. If not, see <http://www.gnu.org/licenses/>.
- */
-import { parse } from 'url';
-import formatMessage from '../../../format-message'; // keep in sync with the protocols permitted for <a href>
-// as listed in gems/canvas_sanitize/lib/canvas_sanitize/canvas_sanitize.rb
-
-const allowed_protocols = ['ftp:', 'http:', 'https:', 'mailto:', 'tel:', 'skype:']; // weakly validate a url
-// return true if valid
-// return false if not valid yet, but incomplete
-// throw an Error if invalid
-
-export default function validateURL(url) {
-  const href = url.trim();
-  const parsed = parse(href, false, true);
-  const protocol = parsed.protocol;
-
-  if (!protocol) {
-    if (parsed.href[0] === ':') {
-      // ":anything" is invalid
-      // need this check as an artifact of parse(href)
-      throw new Error(formatMessage('Protocol must be ftp, http, https, mailto, skype, tel or may be omitted'));
-    }
-
-    if (/^\/\/$/.test(href)) {
-      // "//" by itself is not a URL yet
-      return false;
-    }
-  } else if (protocol) {
-    if (!allowed_protocols.includes(protocol)) {
-      throw new Error(formatMessage('{p} is not a valid protocol which must be ftp, http, https, mailto, skype, tel or may be omitted', {
-        p: protocol.replace(/:$/, '')
-      }));
-    } // ftp, http, https require ://anything
-
-
-    if (/(?:ftp|http|https):\/\/.+/.test(href)) {
-      return true;
-    } // allow mailto:address, skype:participant, tel:911 or
-    // mailto://address, skype://participant, tel://911,
-
-
-    if (/(?:mailto|skype|tel):(\/\/)?[^/].*/.test(href)) {
-      return true;
-    } // http:/xyzzy is invalid
-
-
-    if (/^(?:ftp|http|https):\/{0,1}[^/]/.test(href)) {
-      throw new Error(formatMessage('Invalid URL'));
-    }
-
-    return false;
-  }
-
-  return true;
-}

package/lib/rce/plugins/instructure_media_embed/clickCallback.js

@@ -1,48 +0,0 @@
-/*
- * Copyright (C) 2020 - present Instructure, Inc.
- *
- * This file is part of Canvas.
- *
- * Canvas is free software: you can redistribute it and/or modify it under
- * the terms of the GNU Affero General Public License as published by the Free
- * Software Foundation, version 3 of the License.
- *
- * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
- * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
- * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
- * details.
- *
- * You should have received a copy of the GNU Affero General Public License along
- * with this program. If not, see <http://www.gnu.org/licenses/>.
- */
-import React from 'react';
-import ReactDOM from 'react-dom';
-import Bridge from '../../../bridge';
-export default function (ed, document) {
-  return import('./components/Embed').then(_ref => {
-    let {
-      Embed
-    } = _ref;
-    let container = document.querySelector('.canvas-rce-embed-container');
-
-    if (!container) {
-      container = document.createElement('div');
-      container.className = 'canvas-rce-embed-container';
-      document.body.appendChild(container);
-    }
-
-    const handleDismiss = () => {
-      ReactDOM.unmountComponentAtNode(container);
-      ed.focus(false);
-    };
-
-    const handleEmbedCode = embedCode => {
-      Bridge.insertEmbedCode(embedCode);
-    };
-
-    ReactDOM.render( /*#__PURE__*/React.createElement(Embed, {
-      onSubmit: handleEmbedCode,
-      onDismiss: handleDismiss
-    }), container);
-  });
-}

package/lib/rce/plugins/instructure_media_embed/components/Embed.js

@@ -1,68 +0,0 @@
-/*
- * Copyright (C) 2020 - present Instructure, Inc.
- *
- * This file is part of Canvas.
- *
- * Canvas is free software: you can redistribute it and/or modify it under
- * the terms of the GNU Affero General Public License as published by the Free
- * Software Foundation, version 3 of the License.
- *
- * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
- * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
- * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
- * details.
- *
- * You should have received a copy of the GNU Affero General Public License along
- * with this program. If not, see <http://www.gnu.org/licenses/>.
- */
-import React, { useState } from 'react';
-import { Modal } from '@instructure/ui-modal';
-import formatMessage from '../../../../format-message';
-import { Button, CloseButton } from '@instructure/ui-buttons';
-import { Heading } from '@instructure/ui-heading';
-import { func } from 'prop-types';
-import { TextArea } from '@instructure/ui-text-area';
-import { instuiPopupMountNode } from '../../../../util/fullscreenHelpers';
-export function Embed(_ref) {
-  let {
-    onSubmit,
-    onDismiss
-  } = _ref;
-  const [embedCode, setEmbedCode] = useState('');
-  return /*#__PURE__*/React.createElement(Modal, {
-    "data-mce-component": true,
-    label: formatMessage('Embed'),
-    mountNode: instuiPopupMountNode,
-    size: "medium",
-    onDismiss: onDismiss,
-    open: true,
-    shouldCloseOnDocumentClick: false
-  }, /*#__PURE__*/React.createElement(Modal.Header, null, /*#__PURE__*/React.createElement(CloseButton, {
-    onClick: onDismiss,
-    offset: "medium",
-    placement: "end",
-    screenReaderLabel: formatMessage('Close')
-  }), /*#__PURE__*/React.createElement(Heading, null, formatMessage('Embed'))), /*#__PURE__*/React.createElement(Modal.Body, null, /*#__PURE__*/React.createElement(TextArea, {
-    maxHeight: "10rem",
-    label: formatMessage('Embed Code'),
-    value: embedCode,
-    onChange: e => {
-      setEmbedCode(e.target.value);
-    }
-  })), /*#__PURE__*/React.createElement(Modal.Footer, null, /*#__PURE__*/React.createElement(Button, {
-    onClick: onDismiss
-  }, formatMessage('Close')), "\xA0", /*#__PURE__*/React.createElement(Button, {
-    onClick: e => {
-      e.preventDefault();
-      onSubmit(embedCode);
-      onDismiss();
-    },
-    color: "primary",
-    type: "submit",
-    disabled: !embedCode
-  }, formatMessage('Submit'))));
-}
-Embed.propTypes = {
-  onSubmit: func.isRequired,
-  onDismiss: func.isRequired
-};

package/lib/rce/plugins/instructure_media_embed/plugin.js

@@ -1,36 +0,0 @@
-/*
- * Copyright (C) 2020 - present Instructure, Inc.
- *
- * This file is part of Canvas.
- *
- * Canvas is free software: you can redistribute it and/or modify it under
- * the terms of the GNU Affero General Public License as published by the Free
- * Software Foundation, version 3 of the License.
- *
- * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
- * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
- * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
- * details.
- *
- * You should have received a copy of the GNU Affero General Public License along
- * with this program. If not, see <http://www.gnu.org/licenses/>.
- */
-import clickCallback from './clickCallback';
-import formatMessage from '../../../format-message';
-import tinymce from 'tinymce'; // Register plugin
-
-tinymce.PluginManager.add('instructure_media_embed', function (ed) {
-  ed.addCommand('instructureMediaEmbed', () => clickCallback(ed, document)); // Register menu item
-
-  ed.ui.registry.addMenuItem('instructure_media_embed', {
-    text: formatMessage('Embed'),
-    icon: 'embed',
-    onAction: () => ed.execCommand('instructureMediaEmbed')
-  }); // Register toolbar button
-
-  ed.ui.registry.addButton('instructure_media_embed', {
-    tooltip: formatMessage('Embed'),
-    icon: 'embed',
-    onAction: () => ed.execCommand('instructureMediaEmbed')
-  });
-});

package/lib/rce/plugins/instructure_paste/pasteMenuCommand.js

@@ -1,117 +0,0 @@
-/*
- * Copyright (C) 2022 - present Instructure, Inc.
- *
- * This file is part of Canvas.
- *
- * Canvas is free software: you can redistribute it and/or modify it under
- * the terms of the GNU Affero General Public License as published by the Free
- * Software Foundation, version 3 of the License.
- *
- * Canvas is distributed in the hope that it will be useful, but WITHOUT ANY
- * WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR
- * A PARTICULAR PURPOSE. See the GNU Affero General Public License for more
- * details.
- *
- * You should have received a copy of the GNU Affero General Public License along
- * with this program. If not, see <http://www.gnu.org/licenses/>.
- */
-
-/** ********************************************************
- * This file holds a mostly functional paste menu command
- * We decided not to use it since menu-past and kb-paste
- * would be subtly different. Keeping the file here
- * because figuring this stuff out wasn't trivial and
- * I didn't want to lose it.
- ********************************************************* */
-import formatMessage from '../../../format-message';
-import { showFlashAlert } from '../../../common/FlashAlert';
-export function initPasteMenuCommand(ed, handlePasteOrDrop) {
-  // the paste menu command is problematic in that it requires
-  // we get the copied data using the clipboard api, which is
-  // more limited than what the browser can do natively via
-  // meta+v.
-  // For example, if the user copies a file from the Finder,
-  // pasting via the menu command just gets you the filename.
-  ed.addCommand('instructurePaste', () => {
-    handlePasteMenuCommand();
-  });
-  ed.ui.registry.addMenuItem('instructure_paste', {
-    text: formatMessage('Paste'),
-    icon: 'paste',
-    onAction: () => ed.execCommand('instructurePaste'),
-
-    onSetup(_api) {
-      // If I add the shortcut, then it overwrites the browsers
-      // built-in keyboard shortcut for paste. we don't want that
-      ed.addShortcut('meta+v', null, () => {
-        ed.execCommand('instructurePaste');
-      });
-    }
-
-  });
-
-  async function handlePasteMenuCommand() {
-    try {
-      const cbitems = await window.navigator.clipboard.read();
-      const cbitem = cbitems[0];
-      const imageType = cbitem.types.find(t => /^image\//.test(t));
-
-      if (imageType) {
-        const blob = await cbitem.getType(imageType);
-        const file = new File([blob], imageType.replace('/', '.'), {
-          type: imageType
-        });
-        handlePasteOrDrop({
-          clipboardData: {
-            files: [file],
-            types: ['Files']
-          },
-          preventDefault: () => {}
-        });
-      } else if (cbitem.types.includes('text/html')) {
-        const blob = await cbitem.getType('text/html');
-        const text = await blob.text();
-        handlePasteOrDrop({
-          clipboardData: {
-            files: [],
-            types: ['text/html'],
-            getData: () => text
-          },
-          preventDefault: () => {}
-        });
-      } else if (cbitem.types.includes('text/plain')) {
-        const blob = await cbitem.getType('text/plain');
-        const text = await blob.text();
-        handlePasteOrDrop({
-          clipboardData: {
-            files: [],
-            types: ['text/plain'],
-            getData: () => text
-          },
-          preventDefault: () => {}
-        });
-      } else {
-        const textType = cbitem.types.find(t => /^text\//.test(t));
-
-        if (textType) {
-          const blob = await cbitem.getType(textType);
-          const text = await blob.text();
-          handlePasteOrDrop({
-            clipboardData: {
-              files: [],
-              types: [textType],
-              getData: () => text
-            },
-            preventDefault: () => {}
-          });
-        }
-      }
-    } catch (ex) {
-      showFlashAlert({
-        message: 'whoops:',
-        err: ex,
-        type: 'error'
-      });
-    }
-  }
-}