@atlaskit/editor-core 188.12.1 → 188.12.3

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/editor-core
 
+## 188.12.3
+
+### Patch Changes
+
+- [#41923](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/41923) [`0120da635b9`](https://bitbucket.org/atlassian/atlassian-frontend/commits/0120da635b9) - [ED-20519] Decoupling more paste plugin from editor-core moving common functions to editor-common
+- Updated dependencies
+
+## 188.12.2
+
+### Patch Changes
+
+- [#40916](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/40916) [`0b80e2e68ea`](https://bitbucket.org/atlassian/atlassian-frontend/commits/0b80e2e68ea) - [ux] media single node with external type media should not show migration ui. Update external image with natural dimensions accordingly, and fixed whitespace issue in external image.
+
 ## 188.12.1
 
 ### Patch Changes

package/dist/cjs/create-editor/sort-by-order.js

@@ -1,25 +1,18 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.sortByOrder = sortByOrder;
-exports.sortByOrderWithTypeName = sortByOrderWithTypeName;
-var _rank = _interopRequireDefault(require("../plugins/rank"));
-function sortByOrder(item) {
-  return function (a, b) {
-    return _rank.default[item].indexOf(a.name) - _rank.default[item].indexOf(b.name);
-  };
-}
-
-// while functionally the same, in order to avoid potentially rewriting the ~10
-// existing implementations of the above function I decided creating a separate
-// function avoided that whole mess. If someone can think of a better way to implement
-// the above and below into a single function please do so
-
-function sortByOrderWithTypeName(item) {
-  return function (a, b) {
-    return _rank.default[item].indexOf(a.type.name) - _rank.default[item].indexOf(b.type.name);
-  };
-}
+Object.defineProperty(exports, "sortByOrder", {
+  enumerable: true,
+  get: function get() {
+    return _legacyRankPlugins.sortByOrder;
+  }
+});
+Object.defineProperty(exports, "sortByOrderWithTypeName", {
+  enumerable: true,
+  get: function get() {
+    return _legacyRankPlugins.sortByOrderWithTypeName;
+  }
+});
+var _legacyRankPlugins = require("@atlaskit/editor-common/legacy-rank-plugins");

package/dist/cjs/plugins/annotation/utils.js

@@ -5,10 +5,20 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.addDraftDecoration = void 0;
 exports.annotationExists = annotationExists;
-exports.containsAnyAnnotations = containsAnyAnnotations;
+Object.defineProperty(exports, "containsAnyAnnotations", {
+  enumerable: true,
+  get: function get() {
+    return _utils.containsAnyAnnotations;
+  }
+});
 exports.getPluginState = exports.getDraftCommandAnalyticsPayload = exports.getAnnotationViewKey = exports.getAllAnnotations = exports.findAnnotationsInSelection = void 0;
 exports.getSelectionPositions = getSelectionPositions;
-exports.hasAnnotationMark = hasAnnotationMark;
+Object.defineProperty(exports, "hasAnnotationMark", {
+  enumerable: true,
+  get: function get() {
+    return _utils.hasAnnotationMark;
+  }
+});
 exports.hasInvalidNodes = void 0;
 exports.hasInvalidWhitespaceNode = hasInvalidWhitespaceNode;
 exports.isSelectionValid = exports.inlineCommentPluginKey = void 0;
@@ -20,8 +30,12 @@ var _styles = require("@atlaskit/editor-common/styles");
 var _utils = require("@atlaskit/editor-common/utils");
 var _adfSchema = require("@atlaskit/adf-schema");
 var _types = require("./types");
-var _utils2 = require("../../utils");
-var _analytics = require("../analytics");
+var _analytics = require("@atlaskit/editor-common/analytics");
+function sum(arr, f) {
+  return arr.reduce(function (val, x) {
+    return val + f(x);
+  }, 0);
+}
 /**
  * Finds the marks in the nodes to the left and right.
  * @param $pos Position to center search around
@@ -63,9 +77,9 @@ var filterAnnotationIds = function filterAnnotationIds(marks) {
 var reorderAnnotations = function reorderAnnotations(annotations, $from) {
   var idSet = surroundingMarks($from).map(filterAnnotationIds);
   annotations.sort(function (a, b) {
-    return (0, _utils2.sum)(idSet, function (ids) {
+    return sum(idSet, function (ids) {
       return ids.indexOf(a.id);
-    }) - (0, _utils2.sum)(idSet, function (ids) {
+    }) - sum(idSet, function (ids) {
       return ids.indexOf(b.id);
     });
   });
@@ -278,7 +292,7 @@ function hasInvalidWhitespaceNode(selection, schema) {
   var foundInvalidWhitespace = false;
   var content = selection.content().content;
   content.descendants(function (node) {
-    if ((0, _utils2.isText)(node, schema)) {
+    if ((0, _utils.isText)(node, schema)) {
       return false;
     }
     if (node.textContent.trim() === '') {
@@ -291,7 +305,7 @@ function hasInvalidWhitespaceNode(selection, schema) {
       // and there are multiple nodes
       !node.eq(content.firstChild) &&
       // and it is a paragraph node
-      (0, _utils2.isParagraph)(node, schema);
+      (0, _utils.isParagraph)(node, schema);
       if (!nodeIsTrailingNewLine) {
         foundInvalidWhitespace = true;
       }
@@ -301,14 +315,6 @@ function hasInvalidWhitespaceNode(selection, schema) {
   return foundInvalidWhitespace;
 }
 
-/*
- * verifies if node contains annotation mark
- */
-function hasAnnotationMark(node, state) {
-  var annotationMark = state.schema.marks.annotation;
-  return !!(annotationMark && node && node.marks.length && annotationMark.isInSet(node.marks));
-}
-
 /*
  * verifies that the annotation exists by the given id
  */
@@ -317,32 +323,6 @@ function annotationExists(annotationId, state) {
   return !!(commentsPluginState !== null && commentsPluginState !== void 0 && commentsPluginState.annotations) && Object.keys(commentsPluginState.annotations).includes(annotationId);
 }
 
-/*
- * verifies that slice contains any annotations
- */
-function containsAnyAnnotations(slice, state) {
-  if (!slice.content.size) {
-    return false;
-  }
-  var hasAnnotation = false;
-  slice.content.forEach(function (node) {
-    hasAnnotation = hasAnnotation || hasAnnotationMark(node, state);
-    // return early if annotation found already
-    if (hasAnnotation) {
-      return true;
-    }
-    // check annotations in descendants
-    node.descendants(function (node) {
-      if (hasAnnotationMark(node, state)) {
-        hasAnnotation = true;
-        return false;
-      }
-      return true;
-    });
-  });
-  return hasAnnotation;
-}
-
 /*
  * remove annotations that dont exsist in plugin state from slice
  */
@@ -364,7 +344,7 @@ function stripNonExistingAnnotations(slice, state) {
  * from node
  */
 function stripNonExistingAnnotationsFromNode(node, state) {
-  if (hasAnnotationMark(node, state)) {
+  if ((0, _utils.hasAnnotationMark)(node, state)) {
     node.marks = node.marks.filter(function (mark) {
       if (mark.type.name === 'annotation') {
         return annotationExists(mark.attrs.id, state);

package/dist/cjs/plugins/code-block/utils.js

@@ -3,47 +3,22 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.transformSingleLineCodeBlockToCodeMark = exports.findCodeBlock = void 0;
-exports.transformSliceToJoinAdjacentCodeBlocks = transformSliceToJoinAdjacentCodeBlocks;
-var _model = require("@atlaskit/editor-prosemirror/model");
-var _slice = require("../../utils/slice");
-var _utils = require("@atlaskit/editor-prosemirror/utils");
-function joinCodeBlocks(left, right) {
-  var textContext = "".concat(left.textContent, "\n").concat(right.textContent);
-  return left.type.create(left.attrs, left.type.schema.text(textContext));
-}
-function mergeAdjacentCodeBlocks(fragment) {
-  var children = [];
-  fragment.forEach(function (maybeCodeBlock) {
-    if (maybeCodeBlock.type === maybeCodeBlock.type.schema.nodes.codeBlock) {
-      var peekAtPrevious = children[children.length - 1];
-      if (peekAtPrevious && peekAtPrevious.type === maybeCodeBlock.type) {
-        return children.push(joinCodeBlocks(children.pop(), maybeCodeBlock));
-      }
-    }
-    return children.push(maybeCodeBlock);
-  });
-  return _model.Fragment.from(children);
-}
-function transformSliceToJoinAdjacentCodeBlocks(slice) {
-  slice = (0, _slice.mapSlice)(slice, function (node) {
-    return node.isBlock && !node.isTextblock ? node.copy(mergeAdjacentCodeBlocks(node.content)) : node;
-  });
-  // mapSlice won't be able to merge adjacent top-level code-blocks
-  return new _model.Slice(mergeAdjacentCodeBlocks(slice.content), slice.openStart, slice.openEnd);
-}
-var transformSingleLineCodeBlockToCodeMark = exports.transformSingleLineCodeBlockToCodeMark = function transformSingleLineCodeBlockToCodeMark(slice, schema) {
-  if (slice.content.childCount === 1 && (slice.openStart || slice.openEnd)) {
-    var maybeCodeBlock = slice.content.firstChild;
-    if (maybeCodeBlock && maybeCodeBlock.type === schema.nodes.codeBlock) {
-      if (maybeCodeBlock.textContent && maybeCodeBlock.textContent.indexOf('\n') === -1) {
-        return new _model.Slice(_model.Fragment.from(schema.text(maybeCodeBlock.textContent, [schema.marks.code.create()])), 0, 0);
-      }
-    }
+Object.defineProperty(exports, "findCodeBlock", {
+  enumerable: true,
+  get: function get() {
+    return _transforms.findCodeBlock;
   }
-  return slice;
-};
-var findCodeBlock = exports.findCodeBlock = function findCodeBlock(state, selection) {
-  var codeBlock = state.schema.nodes.codeBlock;
-  return (0, _utils.findSelectedNodeOfType)(codeBlock)(selection || state.selection) || (0, _utils.findParentNodeOfType)(codeBlock)(selection || state.selection);
-};
+});
+Object.defineProperty(exports, "transformSingleLineCodeBlockToCodeMark", {
+  enumerable: true,
+  get: function get() {
+    return _transforms.transformSingleLineCodeBlockToCodeMark;
+  }
+});
+Object.defineProperty(exports, "transformSliceToJoinAdjacentCodeBlocks", {
+  enumerable: true,
+  get: function get() {
+    return _transforms.transformSliceToJoinAdjacentCodeBlocks;
+  }
+});
+var _transforms = require("@atlaskit/editor-common/transforms");

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

@@ -31,13 +31,12 @@ var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils = require("@atlaskit/editor-prosemirror/utils");
 var _v = _interopRequireDefault(require("uuid/v4"));
 var _utils2 = require("@atlaskit/editor-tables/utils");
-var _utils3 = require("../../utils");
-var _slice = require("../../utils/slice");
+var _utils3 = require("@atlaskit/editor-common/utils");
+var _coreUtils = require("@atlaskit/editor-common/core-utils");
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _selection = require("@atlaskit/editor-common/selection");
 var _macro = require("../macro");
 var _util = require("./util");
-var _utils4 = require("@atlaskit/editor-common/utils");
 var _edgeCases = require("./edge-cases");
 var _commands = require("./commands");
 var _pluginFactory = require("./pm-plugins/plugin-factory");
@@ -46,10 +45,29 @@ function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } // TODO: ED-20519 Needs Macro extraction
+/** Helper type for single arg function */
+
+/**
+ * Compose 1 to n functions.
+ * @param func first function
+ * @param funcs additional functions
+ */
+function compose(func) {
+  for (var _len = arguments.length, funcs = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+    funcs[_key - 1] = arguments[_key];
+  }
+  var allFuncs = [func].concat(funcs);
+  return function composed(raw) {
+    return allFuncs.reduceRight(function (memo, func) {
+      return func(memo);
+    }, raw);
+  };
+}
+
 // remove text attribute from mention for copy/paste (GDPR)
 function handleMention(slice, schema) {
-  return (0, _slice.mapSlice)(slice, function (node) {
+  return (0, _utils3.mapSlice)(slice, function (node) {
     if (node.type.name === schema.nodes.mention.name) {
       var mention = node.attrs;
       var newMention = _objectSpread(_objectSpread({}, mention), {}, {
@@ -105,13 +123,13 @@ function handlePasteIntoTaskOrDecisionOrPanel(slice, queueCardsFromChangedTr) {
     if (sliceIsInvalid || sliceIsAPanelReceivingLowDepthText || !selectionIsValidNode && !selectionHasValidParentNode) {
       return false;
     }
-    var filters = [(0, _utils4.linkifyContent)(schema)];
+    var filters = [(0, _utils3.linkifyContent)(schema)];
     var selectionMarks = selection.$head.marks();
     if (selection instanceof _state.TextSelection && Array.isArray(selectionMarks) && selectionMarks.length > 0 && (0, _util.hasOnlyNodesOfType)(paragraph, text, emoji, mention, hardBreak)(slice) && (!codeMark.isInSet(selectionMarks) || (0, _mark.anyMarkActive)(state, codeMark)) // check if there is a code mark anywhere in the selection
     ) {
       filters.push((0, _util.applyTextMarksToSlice)(schema, selection.$head.marks()));
     }
-    var transformedSlice = _utils3.compose.apply(null, filters)(slice);
+    var transformedSlice = compose.apply(null, filters)(slice);
     var tr = (0, _history.closeHistory)(state.tr);
     var transformedSliceIsValidNode = transformedSlice.content.firstChild.type.inlineContent || ['decisionList', 'decisionItem', 'taskList', 'taskItem', 'panel'].includes(transformedSlice.content.firstChild.type.name) && !(0, _utils3.isInListItem)(state);
     // If the slice or the selection are valid nodes to handle,
@@ -154,7 +172,7 @@ function handlePasteNonNestableBlockNodesIntoList(slice) {
 
     // Slice info
     var sliceContent = slice.content;
-    var sliceIsListItems = (0, _utils4.isListNode)(sliceContent.firstChild) && (0, _utils4.isListNode)(sliceContent.lastChild);
+    var sliceIsListItems = (0, _utils3.isListNode)(sliceContent.firstChild) && (0, _utils3.isListNode)(sliceContent.lastChild);
 
     // Find case of slices that can be inserted into a list item
     // (eg. paragraphs, list items, code blocks, media single)
@@ -181,7 +199,7 @@ function handlePasteNonNestableBlockNodesIntoList(slice) {
     var selectionIsInNestedList = !!grandParentListNode;
     var selectedListItemHasNestedList = false;
     selectionParentListItemNode.node.content.forEach(function (child) {
-      if ((0, _utils4.isListNode)(child)) {
+      if ((0, _utils3.isListNode)(child)) {
         selectedListItemHasNestedList = true;
       }
     });
@@ -325,7 +343,7 @@ function handlePasteLinkOnSelectedText(slice) {
     }
 
     // if we have a link, apply it to the selected text if we have any and it's allowed
-    if (linkMark && selection instanceof _state.TextSelection && !selection.empty && (0, _utils4.canLinkBeCreatedInRange)(from, to)(state)) {
+    if (linkMark && selection instanceof _state.TextSelection && !selection.empty && (0, _utils3.canLinkBeCreatedInRange)(from, to)(state)) {
       tr.addMark(from, to, linkMark);
       if (dispatch) {
         dispatch(tr);
@@ -574,7 +592,7 @@ function handleMediaSingle(inputMethod, insertMediaAsMediaSingle) {
           var _insertMediaAsMediaSi;
           return (_insertMediaAsMediaSi = insertMediaAsMediaSingle === null || insertMediaAsMediaSingle === void 0 ? void 0 : insertMediaAsMediaSingle(view, slice.content.firstChild, inputMethod)) !== null && _insertMediaAsMediaSi !== void 0 ? _insertMediaAsMediaSi : false;
         }
-        if ((0, _utils3.insideTable)(state) && isOnlyMediaSingle(state, slice)) {
+        if ((0, _coreUtils.insideTable)(state) && isOnlyMediaSingle(state, slice)) {
           var tr = state.tr.replaceSelection(slice);
           var nextPos = tr.doc.resolve(tr.mapping.map(state.selection.$from.pos));
           if (dispatch) {
@@ -600,7 +618,7 @@ function handleExpandPasteInTable(slice) {
   return function (state, dispatch) {
     // 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, _utils3.insideTable)(state) || !checkExpand(slice)) {
+    if (!(0, _coreUtils.insideTable)(state) || !checkExpand(slice)) {
       return false;
     }
     var _state$schema$nodes2 = state.schema.nodes,
@@ -608,7 +626,7 @@ function handleExpandPasteInTable(slice) {
       nestedExpand = _state$schema$nodes2.nestedExpand;
     var tr = state.tr;
     var hasExpand = false;
-    var newSlice = (0, _slice.mapSlice)(slice, function (maybeNode) {
+    var newSlice = (0, _utils3.mapSlice)(slice, function (maybeNode) {
       if (maybeNode.type === expand) {
         hasExpand = true;
         try {
@@ -668,7 +686,7 @@ function hasInlineCode(state, slice) {
 }
 function rollupLeafListItems(list, leafListItems) {
   list.content.forEach(function (child) {
-    if ((0, _utils4.isListNode)(child) || (0, _utils4.isListItemNode)(child) && (0, _utils4.isListNode)(child.firstChild)) {
+    if ((0, _utils3.isListNode)(child) || (0, _utils3.isListItemNode)(child) && (0, _utils3.isListNode)(child.firstChild)) {
       rollupLeafListItems(child, leafListItems);
     } else {
       leafListItems.push(child);
@@ -677,7 +695,7 @@ function rollupLeafListItems(list, leafListItems) {
 }
 function shouldFlattenList(state, slice) {
   var node = slice.content.firstChild;
-  return node && (0, _utils3.insideTable)(state) && (0, _utils4.isListNode)(node) && slice.openStart > slice.openEnd;
+  return node && (0, _coreUtils.insideTable)(state) && (0, _utils3.isListNode)(node) && slice.openStart > slice.openEnd;
 }
 function sliceHasTopLevelMarks(slice) {
   var hasTopLevelMarks = false;
@@ -751,7 +769,7 @@ function handleParagraphBlockMarks(state, slice) {
 
   // If the paragraph contains marks forbidden by the parent node (e.g. alignment/indentation),
   // drop those marks from the slice
-  return (0, _slice.mapSlice)(slice, function (node) {
+  return (0, _utils3.mapSlice)(slice, function (node) {
     if (node.type === schema.nodes.paragraph) {
       return schema.nodes.paragraph.createChecked(undefined, node.content, node.marks.filter(function (mark) {
         return !forbiddenMarkTypes.includes(mark.type);
@@ -821,8 +839,8 @@ function handleRichText(slice, queueCardsFromChangedTr) {
       slice = flattenNestedListInSlice(slice);
     }
     (0, _history.closeHistory)(tr);
-    var isFirstChildListNode = (0, _utils4.isListNode)(firstChildOfSlice);
-    var isLastChildListNode = (0, _utils4.isListNode)(lastChildOfSlice);
+    var isFirstChildListNode = (0, _utils3.isListNode)(firstChildOfSlice);
+    var isLastChildListNode = (0, _utils3.isListNode)(lastChildOfSlice);
     var isSliceContentListNodes = isFirstChildListNode || isLastChildListNode;
     var isFirstChildTaskListNode = (firstChildOfSlice === null || firstChildOfSlice === void 0 || (_firstChildOfSlice$ty = firstChildOfSlice.type) === null || _firstChildOfSlice$ty === void 0 ? void 0 : _firstChildOfSlice$ty.name) === 'taskList';
     var isLastChildTaskListNode = (lastChildOfSlice === null || lastChildOfSlice === void 0 || (_lastChildOfSlice$typ = lastChildOfSlice.type) === null || _lastChildOfSlice$typ === void 0 ? void 0 : _lastChildOfSlice$typ.name) === 'taskList';

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

@@ -6,14 +6,20 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.isImage = void 0;
 exports.transformSliceForMedia = transformSliceForMedia;
-exports.unwrapNestedMediaElements = exports.transformSliceToCorrectMediaWrapper = void 0;
+exports.unwrapNestedMediaElements = exports.transformSliceToMediaSingleWithNewExperience = exports.transformSliceToCorrectMediaWrapper = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _utils = require("@atlaskit/editor-prosemirror/utils");
 var _utils2 = require("@atlaskit/editor-common/utils");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _mediaCommon = require("@atlaskit/media-common");
+var _mediaSingle = require("@atlaskit/editor-common/media-single");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+/**
+ * Ensure correct layout in nested mode
+ *
+ * TODO: this func is only used in handlePaste, so layout update won't work for drop event
+ */
 function transformSliceForMedia(slice, schema) {
   var _schema$nodes = schema.nodes,
     mediaSingle = _schema$nodes.mediaSingle,
@@ -21,8 +27,6 @@ function transformSliceForMedia(slice, schema) {
     table = _schema$nodes.table,
     bulletList = _schema$nodes.bulletList,
     orderedList = _schema$nodes.orderedList,
-    media = _schema$nodes.media,
-    mediaInline = _schema$nodes.mediaInline,
     expand = _schema$nodes.expand,
     nestedExpand = _schema$nodes.nestedExpand;
   return function (selection) {
@@ -49,27 +53,6 @@ function transformSliceForMedia(slice, schema) {
         return node.type.name === 'mediaSingle' ? mediaSingle.createChecked(attrs, node.content, node.marks) : node;
       });
     }
-    var __mediaTraceId = (0, _mediaCommon.getRandomHex)(8);
-    newSlice = (0, _utils2.mapSlice)(newSlice, function (node) {
-      // This logic is duplicated in editor-plugin-ai where external images can be inserted
-      // from external sources through the use of AI.  The editor-plugin-ai package is avoiding
-      // sharing dependencies with editor-core to support products using it with various versions
-      // of editor packages.
-      // The duplication is in the following file:
-      // packages/editor/editor-plugin-ai/src/prebuilt/content-transformers/markdown-to-pm/markdown-transformer.ts
-      if (node.type.name === 'media') {
-        return media.createChecked(_objectSpread(_objectSpread({}, node.attrs), {}, {
-          __external: node.attrs.type === 'external',
-          __mediaTraceId: node.attrs.type === 'external' ? null : __mediaTraceId
-        }), node.content, node.marks);
-      }
-      if (node.type.name === 'mediaInline') {
-        return mediaInline.createChecked(_objectSpread(_objectSpread({}, node.attrs), {}, {
-          __mediaTraceId: __mediaTraceId
-        }), node.content, node.marks);
-      }
-      return node;
-    });
     return newSlice;
   };
 }
@@ -95,6 +78,49 @@ var transformSliceToCorrectMediaWrapper = exports.transformSliceToCorrectMediaWr
   });
 };
 
+/**
+ * This func will be called when copy & paste, drag & drop external html with media, media files, and slices from editor
+ * Because width may not be available when transform, DEFAULT_IMAGE_WIDTH is used as a fallback
+ *
+ */
+var transformSliceToMediaSingleWithNewExperience = exports.transformSliceToMediaSingleWithNewExperience = function transformSliceToMediaSingleWithNewExperience(slice, schema) {
+  var _schema$nodes3 = schema.nodes,
+    mediaInline = _schema$nodes3.mediaInline,
+    mediaSingle = _schema$nodes3.mediaSingle,
+    media = _schema$nodes3.media;
+  var newSlice = (0, _utils2.mapSlice)(slice, function (node) {
+    // This logic is duplicated in editor-plugin-ai where external images can be inserted
+    // from external sources through the use of AI.  The editor-plugin-ai package is avoiding
+    // sharing dependencies with editor-core to support products using it with various versions
+    // of editor packages.
+    // The duplication is in the following file:
+    // packages/editor/editor-plugin-ai/src/prebuilt/content-transformers/markdown-to-pm/markdown-transformer.ts
+    if (node.type === mediaSingle) {
+      return (0, _platformFeatureFlags.getBooleanFF)('platform.editor.media.extended-resize-experience') ? mediaSingle.createChecked({
+        width: node.attrs.width || _mediaSingle.DEFAULT_IMAGE_WIDTH,
+        widthType: node.attrs.widthType || 'pixel',
+        layout: node.attrs.layout
+      }, node.content, node.marks) : node;
+    }
+    return node;
+  });
+  return (0, _utils2.mapSlice)(newSlice, function (node) {
+    var __mediaTraceId = (0, _mediaCommon.getRandomHex)(8);
+    if (node.type === media) {
+      return media.createChecked(_objectSpread(_objectSpread({}, node.attrs), {}, {
+        __external: node.attrs.type === 'external',
+        __mediaTraceId: node.attrs.type === 'external' ? null : __mediaTraceId
+      }), node.content, node.marks);
+    }
+    if (node.type.name === 'mediaInline') {
+      return mediaInline.createChecked(_objectSpread(_objectSpread({}, node.attrs), {}, {
+        __mediaTraceId: __mediaTraceId
+      }), node.content, node.marks);
+    }
+    return node;
+  });
+};
+
 /**
  * Check base styles to see if an element will be invisible when rendered in a document.
  * @param element

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

@@ -13,11 +13,11 @@ exports.handleSelectedTableWithAnalytics = exports.handleRichTextWithAnalytics =
 exports.sendPasteAnalyticsEvent = sendPasteAnalyticsEvent;
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _analytics = require("../../analytics");
+var _analytics = require("@atlaskit/editor-common/analytics");
+var _analytics2 = require("../../analytics");
 var _util = require("../util");
 var _handlers = require("../handlers");
 var _utils = require("@atlaskit/editor-prosemirror/utils");
-var _slice = require("../../../utils/slice");
 var _utils2 = require("@atlaskit/editor-common/utils");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -101,7 +101,7 @@ function getContent(_ref) {
 }
 function getMediaTraceId(slice) {
   var traceId;
-  (0, _slice.mapSlice)(slice, function (node) {
+  (0, _utils2.mapSlice)(slice, function (node) {
     if (node.type.name === 'media' || node.type.name === 'mediaInline') {
       traceId = node.attrs.__mediaTraceId;
     }
@@ -176,7 +176,7 @@ function createPasteAnalyticsPayloadBySelection(event, slice, pasteContext) {
     // If we have a link among the pasted content, grab the
     // domain and send it up with the analytics event
     if (content === _analytics.PasteContents.url || content === _analytics.PasteContents.mixed) {
-      (0, _slice.mapSlice)(slice, function (node) {
+      (0, _utils2.mapSlice)(slice, function (node) {
         var linkMark = node.marks.find(function (mark) {
           return mark.type.name === 'link';
         });
@@ -223,7 +223,7 @@ function createPasteAnalyticsPayload(view, event, slice, pasteContext) {
 // so pasteCommandWithAnalytics is useless in this case.
 function sendPasteAnalyticsEvent(view, event, slice, pasteContext) {
   var payload = createPasteAnalyticsPayload(view, event, slice, pasteContext);
-  view.dispatch((0, _analytics.addAnalytics)(view.state, view.state.tr, payload));
+  view.dispatch((0, _analytics2.addAnalytics)(view.state, view.state.tr, payload));
 }
 var handlePasteAsPlainTextWithAnalytics = exports.handlePasteAsPlainTextWithAnalytics = function handlePasteAsPlainTextWithAnalytics(view, event, slice) {
   return injectAnalyticsPayloadBeforeCommand(createPasteAnalyticsPayloadBySelection(event, slice, {
@@ -284,7 +284,7 @@ function injectAnalyticsPayloadBeforeCommand(createPayloadByTransaction) {
       if (dispatch && originalTransaction.docChanged) {
         // it needs to know the selection before the changes
         var payload = createPayloadByTransaction(state.selection);
-        (0, _analytics.addAnalytics)(state, originalTransaction, payload);
+        (0, _analytics2.addAnalytics)(state, originalTransaction, payload);
         dispatch(originalTransaction);
       }
       return true;