@atlaskit/editor-core 161.0.0 → 162.0.2

package/dist/cjs/plugins/list/actions/wrap-and-join-lists.js

@@ -0,0 +1,180 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.autoJoin = autoJoin;
+exports.wrapInList = wrapInList;
+exports.wrapInListAndJoin = wrapInListAndJoin;
+
+var _prosemirrorModel = require("prosemirror-model");
+
+var _prosemirrorTransform = require("prosemirror-transform");
+
+/**
+ * Wraps the selection in a list with the given type. If this results in
+ * two adjacent lists of the same type, those will be joined together.
+ */
+function wrapInListAndJoin(nodeType, tr) {
+  wrapInList(nodeType)(tr);
+  autoJoin(tr, function (before, after) {
+    return before.type === after.type && before.type === nodeType;
+  });
+}
+/**
+ * Wraps the selection in a list with the given type and attributes.
+ *
+ * Adapted from https://github.com/ProseMirror/prosemirror-schema-list/blob/master/src/schema-list.js#L64-L89
+ */
+
+
+function wrapInList(listType, attrs) {
+  return function (tr) {
+    var _tr$selection = tr.selection,
+        $from = _tr$selection.$from,
+        $to = _tr$selection.$to;
+    var range = $from.blockRange($to);
+    var doJoin = false;
+    var outerRange = range;
+
+    if (!range) {
+      return false;
+    } // This is at the top of an existing list item
+
+
+    if (range.depth >= 2 && // @ts-ignore - missing type for compatibleContent
+    $from.node(range.depth - 1).type.compatibleContent(listType) && range.startIndex === 0) {
+      // Don't do anything if this is the top of the list
+      if ($from.index(range.depth - 1) === 0) {
+        return false;
+      }
+
+      var $insert = tr.doc.resolve(range.start - 2);
+      outerRange = new _prosemirrorModel.NodeRange($insert, $insert, range.depth);
+
+      if (range.endIndex < range.parent.childCount) {
+        range = new _prosemirrorModel.NodeRange($from, tr.doc.resolve($to.end(range.depth)), range.depth);
+      }
+
+      doJoin = true;
+    }
+
+    var wrap = (0, _prosemirrorTransform.findWrapping)(outerRange, listType, attrs, range);
+
+    if (!wrap) {
+      return false;
+    }
+
+    tr = doWrapInList(tr, range, wrap, doJoin, listType);
+    return true;
+  };
+}
+/**
+ * Internal function used by wrapInList
+ *
+ * Adapted from https://github.com/ProseMirror/prosemirror-schema-list/blob/master/src/schema-list.js#L91-L112
+ */
+
+
+function doWrapInList(tr, range, wrappers, joinBefore, listType) {
+  var content = _prosemirrorModel.Fragment.empty;
+
+  for (var i = wrappers.length - 1; i >= 0; i--) {
+    content = _prosemirrorModel.Fragment.from(wrappers[i].type.create(wrappers[i].attrs, content));
+  }
+
+  tr.step(new _prosemirrorTransform.ReplaceAroundStep(range.start - (joinBefore ? 2 : 0), range.end, range.start, range.end, new _prosemirrorModel.Slice(content, 0, 0), wrappers.length, true));
+  var found = 0;
+
+  for (var _i = 0; _i < wrappers.length; _i++) {
+    if (wrappers[_i].type === listType) {
+      found = _i + 1;
+    }
+  }
+
+  var splitDepth = wrappers.length - found;
+  var splitPos = range.start + wrappers.length - (joinBefore ? 2 : 0);
+  var parent = range.parent;
+
+  for (var _i2 = range.startIndex, e = range.endIndex, first = true; _i2 < e; _i2++, first = false) {
+    if (!first && (0, _prosemirrorTransform.canSplit)(tr.doc, splitPos, splitDepth)) {
+      tr.split(splitPos, splitDepth);
+      splitPos += 2 * splitDepth;
+    }
+
+    splitPos += parent.child(_i2).nodeSize;
+  }
+
+  return tr;
+}
+/**
+ * Checks whether two adjacent nodes can be joined. If so, the document
+ * will be updated to join those nodes. If not, the original transaction
+ * remains untouched.
+ *
+ * Nodes are considered joinable if the `isJoinable` predicate returns true.
+ *
+ * Adapted from https://github.com/ProseMirror/prosemirror-commands/blob/master/src/commands.js#L597-L610
+ */
+
+
+function autoJoin(tr, isJoinable) {
+  if (!tr.isGeneric) {
+    return;
+  }
+
+  var ranges = [];
+
+  for (var i = 0; i < tr.mapping.maps.length; i++) {
+    var map = tr.mapping.maps[i];
+
+    for (var j = 0; j < ranges.length; j++) {
+      ranges[j] = map.map(ranges[j]);
+    }
+
+    map.forEach(function (_s, _e, from, to) {
+      return ranges.push(from, to);
+    });
+  } // Figure out which joinable points exist inside those ranges,
+  // by checking all node boundaries in their parent nodes.
+
+
+  var joinable = [];
+
+  for (var _i3 = 0; _i3 < ranges.length; _i3 += 2) {
+    var from = ranges[_i3];
+    var to = ranges[_i3 + 1];
+    var $from = tr.doc.resolve(from);
+    var depth = $from.sharedDepth(to);
+    var parent = $from.node(depth);
+
+    for (var index = $from.indexAfter(depth), pos = $from.after(depth + 1); pos <= to; ++index) {
+      var _after = parent.maybeChild(index);
+
+      if (!_after) {
+        break;
+      }
+
+      if (index && joinable.indexOf(pos) === -1) {
+        var _before = parent.child(index - 1);
+
+        if (_before.type === _after.type && isJoinable(_before, _after)) {
+          joinable.push(pos);
+        }
+      }
+
+      pos += _after.nodeSize;
+    }
+  } // Join the joinable points
+
+
+  joinable.sort(function (a, b) {
+    return a - b;
+  });
+
+  for (var _i4 = joinable.length - 1; _i4 >= 0; _i4--) {
+    if ((0, _prosemirrorTransform.canJoin)(tr.doc, joinable[_i4])) {
+      tr.join(joinable[_i4]);
+    }
+  }
+}

package/dist/cjs/plugins/list/commands/index.js

@@ -24,18 +24,13 @@ exports.rootListDepth = void 0;
 exports.toggleBulletList = toggleBulletList;
 exports.toggleList = toggleList;
 exports.toggleOrderedList = toggleOrderedList;
-exports.wrapInList = wrapInList;
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
 var _prosemirrorModel = require("prosemirror-model");
 
-var _prosemirrorTransform = require("prosemirror-transform");
-
 var baseCommand = _interopRequireWildcard(require("prosemirror-commands"));
 
-var baseListCommand = _interopRequireWildcard(require("prosemirror-schema-list"));
-
 var _prosemirrorUtils = require("prosemirror-utils");
 
 var _document = require("../../../utils/document");
@@ -60,10 +55,14 @@ var _joinListItemForward = require("./join-list-item-forward");
 
 var _conversions = require("../actions/conversions");
 
+var _wrapAndJoinLists = require("../actions/wrap-and-join-lists");
+
 var _outdentList = require("./outdent-list");
 
 var _indentList = require("./indent-list");
 
+var _replaceContent = require("../utils/replace-content");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -147,8 +146,8 @@ function untoggleSelectedList(tr) {
 
 function toggleList(inputMethod, listType) {
   return function (state, dispatch) {
-    var customTr = state.tr;
-    var listInsideSelection = (0, _selection.selectionContainsList)(customTr);
+    var tr = state.tr;
+    var listInsideSelection = (0, _selection.selectionContainsList)(tr);
     var listNodeType = state.schema.nodes[listType];
     var actionSubjectId = listType === 'bulletList' ? _analytics.ACTION_SUBJECT_ID.FORMAT_LIST_BULLET : _analytics.ACTION_SUBJECT_ID.FORMAT_LIST_NUMBER;
 
@@ -159,9 +158,9 @@ function toggleList(inputMethod, listType) {
       var transformedFrom = listInsideSelection.type.name === 'bulletList' ? _analytics.ACTION_SUBJECT_ID.FORMAT_LIST_BULLET : _analytics.ACTION_SUBJECT_ID.FORMAT_LIST_NUMBER;
 
       if ((fromNode === null || fromNode === void 0 ? void 0 : fromNode.type.name) === listType && (toNode === null || toNode === void 0 ? void 0 : toNode.type.name) === listType) {
-        var tr = state.tr;
-        untoggleSelectedList(tr);
-        (0, _analytics.addAnalytics)(state, tr, {
+        var _tr2 = state.tr;
+        untoggleSelectedList(_tr2);
+        (0, _analytics.addAnalytics)(state, _tr2, {
           action: _analytics.ACTION.CONVERTED,
           actionSubject: _analytics.ACTION_SUBJECT.LIST,
           actionSubjectId: _analytics.ACTION_SUBJECT_ID.TEXT,
@@ -173,17 +172,17 @@ function toggleList(inputMethod, listType) {
         });
 
         if (dispatch) {
-          dispatch(tr);
+          dispatch(_tr2);
         }
 
         return true;
       }
 
       (0, _conversions.convertListType)({
-        tr: customTr,
+        tr: tr,
         nextListNodeType: listNodeType
       });
-      (0, _analytics.addAnalytics)(state, customTr, {
+      (0, _analytics.addAnalytics)(state, tr, {
         action: _analytics.ACTION.CONVERTED,
         actionSubject: _analytics.ACTION_SUBJECT.LIST,
         actionSubjectId: actionSubjectId,
@@ -194,17 +193,11 @@ function toggleList(inputMethod, listType) {
         })
       });
     } else {
-      var replaceCurrentTr = function replaceCurrentTr(tr) {
-        customTr = tr;
-      }; // NOTE: replaceCurrentTr is supplied here instead of the usual dispatch function
-      // to 'mutate' the transaction without actually dispatching (as it is more performant
-      // if we only dispatch once at the end). This means customTr should not be modified
-      // until after wrapInList, since any changes made to it will be discarded when it
-      // gets replaced with the transaction generated by wrapInList.
-
-
-      wrapInList(listNodeType)(state, replaceCurrentTr);
-      (0, _analytics.addAnalytics)(state, customTr, {
+      // Need to have this before wrapInList so the wrapping is done with valid content
+      // For example, if trying to convert centre or right aligned paragraphs to lists
+      (0, _utils.sanitiseMarksInSelection)(tr, listNodeType);
+      (0, _wrapAndJoinLists.wrapInListAndJoin)(listNodeType, tr);
+      (0, _analytics.addAnalytics)(state, tr, {
         action: _analytics.ACTION.INSERTED,
         actionSubject: _analytics.ACTION_SUBJECT.LIST,
         actionSubjectId: actionSubjectId,
@@ -213,18 +206,16 @@ function toggleList(inputMethod, listType) {
           inputMethod: inputMethod
         }
       });
-    } // if document wasn't changed, that means setNodeMarkup step didn't work, so
-    // return false from the command to indicate that the editing action failed
+    } // If document wasn't changed, return false from the command to indicate that the
+    // editing action failed
 
 
-    if (!customTr.docChanged) {
+    if (!tr.docChanged) {
       return false;
     }
 
-    (0, _utils.sanitiseMarksInSelection)(customTr, listNodeType);
-
     if (dispatch) {
-      dispatch(customTr);
+      dispatch(tr);
     }
 
     return true;
@@ -240,12 +231,6 @@ function toggleOrderedList(view) {
   var inputMethod = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : _analytics.INPUT_METHOD.TOOLBAR;
   return toggleList(inputMethod, 'orderedList')(view.state, view.dispatch);
 }
-
-function wrapInList(nodeType) {
-  return baseCommand.autoJoin(baseListCommand.wrapInList(nodeType), function (before, after) {
-    return before.type === after.type && before.type === nodeType;
-  });
-}
 /**
  * Implementation taken and modified for our needs from PM
  * @param itemType Node
@@ -377,8 +362,20 @@ var joinToPreviousListItem = function joinToPreviousListItem(state, dispatch) {
         var list = $cut.nodeBefore.copy($cut.nodeBefore.content.append(_prosemirrorModel.Fragment.from(listItem.createChecked({}, $cut.nodeAfter))));
         tr.replaceWith(nodeBeforePos, $from.pos + $cut.nodeAfter.nodeSize, list);
       } else {
-        // take the text content of the paragraph and insert after the paragraph up until before the the cut
-        tr = state.tr.step(new _prosemirrorTransform.ReplaceAroundStep($lastNode.pos, $cut.pos + $cut.nodeAfter.nodeSize, $cut.pos + 1, $cut.pos + $cut.nodeAfter.nodeSize - 1, state.tr.doc.slice($lastNode.pos, $cut.pos), 0, true));
+        var step = (0, _replaceContent.moveTargetIntoList)({
+          insertPosition: $lastNode.pos,
+          $target: $cut
+        }); // ED-13966: check if the step will cause an ProseMirror error
+        // if there's an error don't apply the step as it will might lead into a data loss.
+        // It doesn't play well with media being a leaf node.
+
+        var stepResult = state.tr.maybeStep(step);
+
+        if (stepResult.failed) {
+          return false;
+        } else {
+          tr = state.tr.step(step);
+        }
       } // find out if there's now another list following and join them
       // as in, [list, p, list] => [list with p, list], and we want [joined list]
 

package/dist/cjs/plugins/list/utils/replace-content.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.moveTargetIntoList = void 0;
+
+var _prosemirrorTransform = require("prosemirror-transform");
+
+var moveTargetIntoList = function moveTargetIntoList(_ref) {
+  var _$target$nodeAfter;
+
+  var insertPosition = _ref.insertPosition,
+      $target = _ref.$target;
+  // take the text content of the paragraph and insert after the paragraph up until before the the cut
+  var from = insertPosition;
+  var to = $target.pos + (((_$target$nodeAfter = $target.nodeAfter) === null || _$target$nodeAfter === void 0 ? void 0 : _$target$nodeAfter.nodeSize) || 0); //$cut.pos + $cut.nodeAfter.nodeSize;
+
+  var gapFrom = $target.posAtIndex(0, $target.depth + 1); // start pos of the child
+
+  var gapTo = $target.doc.resolve(gapFrom).end(); // end pos of the paragraph
+
+  if (gapTo - gapFrom === 0) {
+    return new _prosemirrorTransform.ReplaceStep(from, to, $target.doc.slice(insertPosition, $target.pos));
+  }
+
+  var step = new _prosemirrorTransform.ReplaceAroundStep(from, to, gapFrom, gapTo, $target.doc.slice(insertPosition, $target.pos), 0, true);
+  return step;
+};
+
+exports.moveTargetIntoList = moveTargetIntoList;

package/dist/cjs/plugins/media/nodeviews/mediaNodeUpdater.js

@@ -192,7 +192,7 @@ var MediaNodeUpdater = /*#__PURE__*/function () {
 
             case 2:
               contextIdentifierProvider = _context3.sent;
-              return _context3.abrupt("return", contextIdentifierProvider && contextIdentifierProvider.objectId);
+              return _context3.abrupt("return", (contextIdentifierProvider === null || contextIdentifierProvider === void 0 ? void 0 : contextIdentifierProvider.objectId) || null);
 
             case 4:
             case "end":
@@ -278,10 +278,10 @@ var MediaNodeUpdater = /*#__PURE__*/function () {
       var attrs = _this.getAttrs();
 
       if (!attrs || attrs.type !== 'file') {
-        return undefined;
+        return null;
       }
 
-      return attrs.__contextId;
+      return attrs.__contextId || null;
     });
     (0, _defineProperty2.default)(this, "updateDimensions", function (dimensions) {
       (0, _helpers.updateAllMediaNodesAttrs)(dimensions.id, {

package/dist/cjs/plugins/media/styles.js

@@ -9,7 +9,7 @@ exports.mediaStyles = void 0;
 
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
-var _styledComponents = require("styled-components");
+var _react = require("@emotion/react");
 
 var _styles = require("@atlaskit/editor-common/styles");
 
@@ -21,7 +21,7 @@ var _mediaCard = require("@atlaskit/media-card");
 
 var _templateObject;
 
-var mediaStyles = (0, _styledComponents.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .ProseMirror {\n    ", " & [layout='full-width'] .", ",\n    & [layout='wide'] .", " {\n      margin-left: 50%;\n      transform: translateX(-50%);\n    }\n\n    & [layout^='wrap-'] + [layout^='wrap-'] {\n      clear: none;\n      & + p,\n      & + div[class^='fabric-editor-align'],\n      & + ul,\n      & + ol,\n      & + h1,\n      & + h2,\n      & + h3,\n      & + h4,\n      & + h5,\n      & + h6 {\n        clear: both !important;\n      }\n      & .", " {\n        margin-left: 0;\n        margin-right: 0;\n      }\n    }\n\n    .mediaSingleView-content-wrap[layout^='wrap-'] {\n      max-width: 100%;\n      // overwrite default Prosemirror setting making it clear: both\n      clear: inherit;\n    }\n\n    .mediaSingleView-content-wrap[layout='wrap-left'] {\n      float: left;\n    }\n\n    .mediaSingleView-content-wrap[layout='wrap-right'] {\n      float: right;\n    }\n\n    .mediaSingleView-content-wrap[layout='wrap-right']\n      + .mediaSingleView-content-wrap[layout='wrap-left'] {\n      clear: both;\n    }\n\n    /* Larger margins for resize handlers when at depth 0 of the document */\n    & > .mediaSingleView-content-wrap {\n      .richMedia-resize-handle-right {\n        margin-right: -", "px;\n      }\n      .richMedia-resize-handle-left {\n        margin-left: -", "px;\n      }\n    }\n  }\n\n  .richMedia-resize-handle-right,\n  .richMedia-resize-handle-left {\n    display: flex;\n    flex-direction: column;\n\n    /* vertical align */\n    justify-content: center;\n  }\n\n  .richMedia-resize-handle-right {\n    align-items: flex-end;\n    padding-right: 12px;\n    margin-right: -", "px;\n  }\n\n  .richMedia-resize-handle-left {\n    align-items: flex-start;\n    padding-left: 12px;\n    margin-left: -", "px;\n  }\n\n  .richMedia-resize-handle-right::after,\n  .richMedia-resize-handle-left::after {\n    content: ' ';\n    display: flex;\n    width: 3px;\n    height: 64px;\n\n    border-radius: 6px;\n  }\n\n  .", ":hover .richMedia-resize-handle-left::after,\n  .", ":hover .richMedia-resize-handle-right::after {\n    background: ", ";\n  }\n\n  .", " .richMedia-resize-handle-right::after,\n  .", " .richMedia-resize-handle-left::after,\n  .", " .richMedia-resize-handle-right:hover::after,\n  .", " .richMedia-resize-handle-left:hover::after,\n  .", ".is-resizing .richMedia-resize-handle-right::after,\n  .", ".is-resizing .richMedia-resize-handle-left::after {\n    background: ", ";\n  }\n\n  .__resizable_base__ {\n    left: unset !important;\n    width: auto !important;\n    height: auto !important;\n  }\n\n  /* Danger when top level node for smart cards / inline links */\n  .danger > div > div > .media-card-frame,\n  .danger > span > a {\n    background-color: ", ";\n    box-shadow: 0px 0px 0px ", "px\n      ", ";\n    transition: background-color 0s;\n    transition: box-shadow 0s;\n  }\n  .mediaGroupView-content-wrap.danger {\n    /* Media inline */\n    .", "::after {\n      border: 1px solid ", ";\n    }\n  }\n  /* Danger when nested node or common */\n  .danger {\n    /* Media single */\n    .", " .", "::after {\n      border: 1px solid ", ";\n    }\n    /* Media single video player */\n    .", " .", "::after {\n      border: 1px solid ", ";\n    }\n    /* New file experience */\n    .", " .", " {\n      box-shadow: 0 0 0 1px ", " !important;\n    }\n    /* Media resize handlers */\n    .richMedia-resize-handle-right::after,\n    .richMedia-resize-handle-left::after {\n      background: ", ";\n    }\n\n    /* Smart cards */\n    div div .media-card-frame,\n    .inlineCardView-content-wrap > span > a {\n      background-color: rgb(255, 189, 173, 0.5); /* R75 with 50% opactiy */\n      transition: background-color 0s;\n    }\n\n    div div .media-card-frame::after {\n      box-shadow: none;\n    }\n  }\n"])), _styles.mediaSingleSharedStyle, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _editorSharedStyles.akEditorMediaResizeHandlerPaddingWide, _editorSharedStyles.akEditorMediaResizeHandlerPaddingWide, _editorSharedStyles.akEditorMediaResizeHandlerPadding, _editorSharedStyles.akEditorMediaResizeHandlerPadding, _styles.richMediaClassName, _styles.richMediaClassName, _colors.N60, _editorSharedStyles.akEditorSelectedNodeClassName, _editorSharedStyles.akEditorSelectedNodeClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _colors.B200, _editorSharedStyles.akEditorDeleteBackground, _editorSharedStyles.akEditorSelectedBorderBoldSize, _editorSharedStyles.akEditorDeleteBorder, _mediaCard.fileCardImageViewSelectedSelector, _editorSharedStyles.akEditorDeleteIconColor, _styles.richMediaClassName, _mediaCard.fileCardImageViewSelector, _editorSharedStyles.akEditorDeleteIconColor, _styles.richMediaClassName, _mediaCard.inlinePlayerClassName, _editorSharedStyles.akEditorDeleteIconColor, _styles.richMediaClassName, _mediaCard.newFileExperienceClassName, _editorSharedStyles.akEditorDeleteIconColor, _editorSharedStyles.akEditorDeleteIconColor);
+var mediaStyles = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  .ProseMirror {\n    ", " & [layout='full-width'] .", ",\n    & [layout='wide'] .", " {\n      margin-left: 50%;\n      transform: translateX(-50%);\n    }\n\n    & [layout^='wrap-'] + [layout^='wrap-'] {\n      clear: none;\n      & + p,\n      & + div[class^='fabric-editor-align'],\n      & + ul,\n      & + ol,\n      & + h1,\n      & + h2,\n      & + h3,\n      & + h4,\n      & + h5,\n      & + h6 {\n        clear: both !important;\n      }\n      & .", " {\n        margin-left: 0;\n        margin-right: 0;\n      }\n    }\n\n    .mediaSingleView-content-wrap[layout^='wrap-'] {\n      max-width: 100%;\n      // overwrite default Prosemirror setting making it clear: both\n      clear: inherit;\n    }\n\n    .mediaSingleView-content-wrap[layout='wrap-left'] {\n      float: left;\n    }\n\n    .mediaSingleView-content-wrap[layout='wrap-right'] {\n      float: right;\n    }\n\n    .mediaSingleView-content-wrap[layout='wrap-right']\n      + .mediaSingleView-content-wrap[layout='wrap-left'] {\n      clear: both;\n    }\n\n    /* Larger margins for resize handlers when at depth 0 of the document */\n    & > .mediaSingleView-content-wrap {\n      .richMedia-resize-handle-right {\n        margin-right: -", "px;\n      }\n      .richMedia-resize-handle-left {\n        margin-left: -", "px;\n      }\n    }\n  }\n\n  .richMedia-resize-handle-right,\n  .richMedia-resize-handle-left {\n    display: flex;\n    flex-direction: column;\n\n    /* vertical align */\n    justify-content: center;\n  }\n\n  .richMedia-resize-handle-right {\n    align-items: flex-end;\n    padding-right: 12px;\n    margin-right: -", "px;\n  }\n\n  .richMedia-resize-handle-left {\n    align-items: flex-start;\n    padding-left: 12px;\n    margin-left: -", "px;\n  }\n\n  .richMedia-resize-handle-right::after,\n  .richMedia-resize-handle-left::after {\n    content: ' ';\n    display: flex;\n    width: 3px;\n    height: 64px;\n\n    border-radius: 6px;\n  }\n\n  .", ":hover .richMedia-resize-handle-left::after,\n  .", ":hover .richMedia-resize-handle-right::after {\n    background: ", ";\n  }\n\n  .", " .richMedia-resize-handle-right::after,\n  .", " .richMedia-resize-handle-left::after,\n  .", " .richMedia-resize-handle-right:hover::after,\n  .", " .richMedia-resize-handle-left:hover::after,\n  .", ".is-resizing .richMedia-resize-handle-right::after,\n  .", ".is-resizing .richMedia-resize-handle-left::after {\n    background: ", ";\n  }\n\n  .__resizable_base__ {\n    left: unset !important;\n    width: auto !important;\n    height: auto !important;\n  }\n\n  /* Danger when top level node for smart cards / inline links */\n  .danger > div > div > .media-card-frame,\n  .danger > span > a {\n    background-color: ", ";\n    box-shadow: 0px 0px 0px ", "px\n      ", ";\n    transition: background-color 0s;\n    transition: box-shadow 0s;\n  }\n  .mediaGroupView-content-wrap.danger {\n    /* Media inline */\n    .", "::after {\n      border: 1px solid ", ";\n    }\n  }\n  /* Danger when nested node or common */\n  .danger {\n    /* Media single */\n    .", " .", "::after {\n      border: 1px solid ", ";\n    }\n    /* Media single video player */\n    .", " .", "::after {\n      border: 1px solid ", ";\n    }\n    /* New file experience */\n    .", " .", " {\n      box-shadow: 0 0 0 1px ", " !important;\n    }\n    /* Media resize handlers */\n    .richMedia-resize-handle-right::after,\n    .richMedia-resize-handle-left::after {\n      background: ", ";\n    }\n\n    /* Smart cards */\n    div div .media-card-frame,\n    .inlineCardView-content-wrap > span > a {\n      background-color: rgb(255, 189, 173, 0.5); /* R75 with 50% opactiy */\n      transition: background-color 0s;\n    }\n\n    div div .media-card-frame::after {\n      box-shadow: none;\n    }\n  }\n"])), _styles.mediaSingleSharedStyle, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _editorSharedStyles.akEditorMediaResizeHandlerPaddingWide, _editorSharedStyles.akEditorMediaResizeHandlerPaddingWide, _editorSharedStyles.akEditorMediaResizeHandlerPadding, _editorSharedStyles.akEditorMediaResizeHandlerPadding, _styles.richMediaClassName, _styles.richMediaClassName, _colors.N60, _editorSharedStyles.akEditorSelectedNodeClassName, _editorSharedStyles.akEditorSelectedNodeClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _styles.richMediaClassName, _colors.B200, _editorSharedStyles.akEditorDeleteBackground, _editorSharedStyles.akEditorSelectedBorderBoldSize, _editorSharedStyles.akEditorDeleteBorder, _mediaCard.fileCardImageViewSelectedSelector, _editorSharedStyles.akEditorDeleteIconColor, _styles.richMediaClassName, _mediaCard.fileCardImageViewSelector, _editorSharedStyles.akEditorDeleteIconColor, _styles.richMediaClassName, _mediaCard.inlinePlayerClassName, _editorSharedStyles.akEditorDeleteIconColor, _styles.richMediaClassName, _mediaCard.newFileExperienceClassName, _editorSharedStyles.akEditorDeleteIconColor, _editorSharedStyles.akEditorDeleteIconColor);
 /* `left: unset` above is to work around Chrome bug where rendering a div with
  * that style applied inside a container that has a scroll, causes any svgs on
  * the page, without a border, that are inside a flexbox, to no longer align to

package/dist/cjs/plugins/media/utils/media-single.js

@@ -5,7 +5,9 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.isMediaSingle = exports.insertMediaSingleNode = exports.insertMediaAsMediaSingle = exports.createMediaSingleNode = exports.calcMediaPxWidth = void 0;
+exports.insertMediaSingleNode = exports.insertMediaAsMediaSingle = exports.createMediaSingleNode = exports.calcMediaPxWidth = void 0;
+exports.isCaptionNode = isCaptionNode;
+exports.isMediaSingle = void 0;
 exports.transformSliceForMedia = transformSliceForMedia;
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
@@ -288,4 +290,15 @@ exports.calcMediaPxWidth = calcMediaPxWidth;
 
 var calcPctWidth = function calcPctWidth(containerWidth, pctWidth, origWidth, origHeight) {
   return pctWidth && origWidth && origHeight && Math.ceil((0, _ui.calcPxFromPct)(pctWidth / 100, containerWidth.lineLength || containerWidth.width));
-};
+};
+
+function isCaptionNode(editorView) {
+  var $from = editorView.state.selection.$from;
+  var immediateWrapperParentNode = editorView.state.doc.nodeAt($from.before(Math.max($from.depth, 1)));
+
+  if (immediateWrapperParentNode && immediateWrapperParentNode.type.name === 'caption') {
+    return true;
+  }
+
+  return false;
+}

package/dist/cjs/plugins/paste/handlers.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.flattenNestedListInSlice = flattenNestedListInSlice;
 exports.handleCodeBlock = handleCodeBlock;
-exports.handleExpand = handleExpand;
+exports.handleExpandPasteInTable = handleExpandPasteInTable;
 exports.handleMacroAutoConvert = handleMacroAutoConvert;
 exports.handleMarkdown = handleMarkdown;
 exports.handleMediaSingle = handleMediaSingle;
@@ -105,8 +105,10 @@ function handlePasteIntoTaskAndDecision(slice) {
         taskList = _schema$nodes.taskList,
         taskItem = _schema$nodes.taskItem,
         text = _schema$nodes.text;
+    var isDecisionOrTaskNodeSelection = state.selection instanceof _prosemirrorState.NodeSelection && ['decisionList', 'decisionItem', 'taskList', 'taskItem'].includes(state.selection.node.type.name);
+    var hasParentDecisionOrTaskItem = (0, _prosemirrorUtils.hasParentNodeOfType)([decisionItem, taskItem])(state.selection);
 
-    if (!decisionItem || !decisionList || !taskList || !taskItem || !(0, _prosemirrorUtils.hasParentNodeOfType)([decisionItem, taskItem])(state.selection)) {
+    if (!decisionItem || !decisionList || !taskList || !taskItem || !hasParentDecisionOrTaskItem && !isDecisionOrTaskNodeSelection) {
       return false;
     }
 
@@ -122,7 +124,15 @@ function handlePasteIntoTaskAndDecision(slice) {
 
     var transformedSlice = _utils.compose.apply(null, filters)(slice);
 
-    var tr = (0, _prosemirrorHistory.closeHistory)(state.tr).replaceSelection(transformedSlice).scrollIntoView();
+    var tr = (0, _prosemirrorHistory.closeHistory)(state.tr);
+    var transformedSliceIsValidNode = transformedSlice.content.firstChild.type.inlineContent || ['decisionList', 'decisionItem', 'taskList', 'taskItem'].includes(transformedSlice.content.firstChild.type.name);
+
+    if (transformedSliceIsValidNode || isDecisionOrTaskNodeSelection) {
+      tr.replaceSelection(transformedSlice).scrollIntoView();
+    } else {
+      (0, _prosemirrorUtils.safeInsert)(transformedSlice.content)(tr).scrollIntoView();
+    }
+
     (0, _doc.queueCardsFromChangedTr)(state, tr, _analytics.INPUT_METHOD.CLIPBOARD);
 
     if (dispatch) {
@@ -448,9 +458,13 @@ function handleMediaSingle(inputMethod) {
   };
 }
 
-function handleExpand(slice) {
+function handleExpandPasteInTable(slice) {
   return function (state, dispatch) {
-    if (!(0, _utils.insideTable)(state)) {
+    var _slice$content$firstC;
+
+    // Do not handle expand if it's not being pasted into a table
+    // OR if it's nested within another node when being pasted into a table
+    if (!(0, _utils.insideTable)(state) || ((_slice$content$firstC = slice.content.firstChild) === null || _slice$content$firstC === void 0 ? void 0 : _slice$content$firstC.type.name) !== 'expand') {
       return false;
     }
 

package/dist/cjs/plugins/paste/pm-plugins/analytics.js

@@ -295,7 +295,7 @@ var handleRichTextWithAnalytics = function handleRichTextWithAnalytics(view, eve
 exports.handleRichTextWithAnalytics = handleRichTextWithAnalytics;
 
 var handleExpandWithAnalytics = function handleExpandWithAnalytics(view, event, slice) {
-  return (0, _utils.pipe)(_handlers.handleExpand, pasteCommandWithAnalytics(view, event, slice, {
+  return (0, _utils.pipe)(_handlers.handleExpandPasteInTable, pasteCommandWithAnalytics(view, event, slice, {
     type: _analytics.PasteTypes.richText
   }))(slice);
 };

package/dist/cjs/plugins/placeholder-text/index.js

@@ -36,6 +36,24 @@ var _analytics = require("../analytics");
 
 var _messages = require("../insert-block/ui/ToolbarInsertBlock/messages");
 
+var _selectionUtils = require("./selection-utils");
+
+var _api = require("../type-ahead/api");
+
+var getOpenTypeAhead = function getOpenTypeAhead(view, content) {
+  var typeAheadAPI = (0, _api.createInternalTypeAheadTools)(view);
+  var typeAheadHandler = typeAheadAPI.findTypeAheadHandler(content);
+
+  if (!typeAheadHandler || !typeAheadHandler.id) {
+    return null;
+  }
+
+  return typeAheadAPI.openTypeAheadHandler({
+    triggerHandler: typeAheadHandler,
+    inputMethod: _analytics.INPUT_METHOD.KEYBOARD
+  });
+};
+
 function createPlugin(dispatch, options) {
   var allowInserting = !!options.allowInserting;
   return new _safePlugin.SafePlugin({
@@ -106,6 +124,32 @@ function createPlugin(dispatch, options) {
       return;
     },
     props: {
+      handleDOMEvents: {
+        beforeinput: function beforeinput(view, event) {
+          var state = view.state;
+
+          if (event instanceof InputEvent && !event.isComposing && event.inputType === 'insertText' && (0, _selectionUtils.isSelectionAtPlaceholder)(view.state.selection)) {
+            event.stopPropagation();
+            event.preventDefault();
+            var startNodePosition = state.selection.from;
+            var content = event.data || '';
+            var tr = view.state.tr;
+            tr.delete(startNodePosition, startNodePosition + 1);
+            var openTypeAhead = getOpenTypeAhead(view, content);
+
+            if (openTypeAhead) {
+              openTypeAhead(tr);
+            } else {
+              tr.insertText(content);
+            }
+
+            view.dispatch(tr);
+            return true;
+          }
+
+          return false;
+        }
+      },
       nodeViews: {
         placeholder: function placeholder(node, view, getPos) {
           return new _placeholderTextNodeview.PlaceholderTextNodeView(node, view, getPos);
@@ -207,7 +251,7 @@ var decorateWithPluginOptions = function decorateWithPluginOptions(plugin, optio
           });
         },
         action: function action(insert, state) {
-          var tr = insert(state.schema.nodes.placeholder.createChecked());
+          var tr = state.tr;
           tr.setMeta(_pluginKey.pluginKey, {
             showInsertPanelAt: tr.selection.anchor
           });