@atlaskit/editor-plugin-media 0.2.0 → 0.3.1

package/dist/esm/utils/media-common.js

@@ -0,0 +1,175 @@
+import { atTheBeginningOfBlock, atTheBeginningOfDoc, atTheEndOfBlock, endPositionOfParent, GapCursorSelection, startPositionOfParent } from '@atlaskit/editor-common/selection';
+import { createNewParagraphBelow, createParagraphNear } from '@atlaskit/editor-common/utils';
+import { deleteSelection, splitBlock } from '@atlaskit/editor-prosemirror/commands';
+import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
+import { findPositionOfNodeBefore } from '@atlaskit/editor-prosemirror/utils';
+import { isMediaBlobUrl } from '@atlaskit/media-client';
+var isTemporary = function isTemporary(id) {
+  return id.indexOf('temporary:') === 0;
+};
+export var isMediaBlobUrlFromAttrs = function isMediaBlobUrlFromAttrs(attrs) {
+  return !!(attrs && attrs.type === 'external' && isMediaBlobUrl(attrs.url));
+};
+export var posOfMediaGroupNearby = function posOfMediaGroupNearby(state) {
+  return posOfParentMediaGroup(state) || posOfFollowingMediaGroup(state) || posOfPrecedingMediaGroup(state) || posOfMediaGroupNextToGapCursor(state);
+};
+export var isSelectionNonMediaBlockNode = function isSelectionNonMediaBlockNode(state) {
+  var _ref = state.selection,
+    node = _ref.node;
+  return node && node.type !== state.schema.nodes.media && node.isBlock;
+};
+export var isSelectionMediaSingleNode = function isSelectionMediaSingleNode(state) {
+  var _ref2 = state.selection,
+    node = _ref2.node;
+  return node && node.type === state.schema.nodes.mediaSingle;
+};
+export var posOfPrecedingMediaGroup = function posOfPrecedingMediaGroup(state) {
+  if (!atTheBeginningOfBlock(state)) {
+    return;
+  }
+  return posOfMediaGroupAbove(state, state.selection.$from);
+};
+var posOfMediaGroupNextToGapCursor = function posOfMediaGroupNextToGapCursor(state) {
+  var selection = state.selection;
+  if (selection instanceof GapCursorSelection) {
+    var $pos = state.selection.$from;
+    var mediaGroupType = state.schema.nodes.mediaGroup;
+    return posOfImmediatePrecedingMediaGroup($pos, mediaGroupType) || posOfImmediateFollowingMediaGroup($pos, mediaGroupType);
+  }
+};
+var posOfImmediatePrecedingMediaGroup = function posOfImmediatePrecedingMediaGroup($pos, mediaGroupType) {
+  if ($pos.nodeBefore && $pos.nodeBefore.type === mediaGroupType) {
+    return $pos.pos - $pos.nodeBefore.nodeSize + 1;
+  }
+};
+var posOfImmediateFollowingMediaGroup = function posOfImmediateFollowingMediaGroup($pos, mediaGroupType) {
+  if ($pos.nodeAfter && $pos.nodeAfter.type === mediaGroupType) {
+    return $pos.pos + 1;
+  }
+};
+var posOfFollowingMediaGroup = function posOfFollowingMediaGroup(state) {
+  if (!atTheEndOfBlock(state)) {
+    return;
+  }
+  return posOfMediaGroupBelow(state, state.selection.$to);
+};
+var posOfMediaGroupAbove = function posOfMediaGroupAbove(state, $pos) {
+  var adjacentPos;
+  var adjacentNode;
+  if (isSelectionNonMediaBlockNode(state)) {
+    adjacentPos = $pos.pos;
+    adjacentNode = $pos.nodeBefore;
+  } else {
+    adjacentPos = startPositionOfParent($pos) - 1;
+    adjacentNode = state.doc.resolve(adjacentPos).nodeBefore;
+  }
+  if (adjacentNode && adjacentNode.type === state.schema.nodes.mediaGroup) {
+    return adjacentPos - adjacentNode.nodeSize + 1;
+  }
+  return;
+};
+
+/**
+ * Determine whether the cursor is inside empty paragraph
+ * or the selection is the entire paragraph
+ */
+export var isInsidePotentialEmptyParagraph = function isInsidePotentialEmptyParagraph(state) {
+  var $from = state.selection.$from;
+  return $from.parent.type === state.schema.nodes.paragraph && atTheBeginningOfBlock(state) && atTheEndOfBlock(state);
+};
+var posOfMediaGroupBelow = function posOfMediaGroupBelow(state, $pos) {
+  var prepend = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
+  var adjacentPos;
+  var adjacentNode;
+  if (isSelectionNonMediaBlockNode(state)) {
+    adjacentPos = $pos.pos;
+    adjacentNode = $pos.nodeAfter;
+  } else {
+    adjacentPos = endPositionOfParent($pos);
+    adjacentNode = state.doc.nodeAt(adjacentPos);
+  }
+  if (adjacentNode && adjacentNode.type === state.schema.nodes.mediaGroup) {
+    return prepend ? adjacentPos + 1 : adjacentPos + adjacentNode.nodeSize - 1;
+  }
+  return;
+};
+export var posOfParentMediaGroup = function posOfParentMediaGroup(state, $pos) {
+  var prepend = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+  var $from = state.selection.$from;
+  $pos = $pos || $from;
+  if ($pos.parent.type === state.schema.nodes.mediaGroup) {
+    return prepend ? startPositionOfParent($pos) : endPositionOfParent($pos) - 1;
+  }
+  return;
+};
+export var removeMediaNode = function removeMediaNode(view, node, getPos) {
+  var id = node.attrs.id;
+  var state = view.state;
+  var tr = state.tr,
+    selection = state.selection,
+    doc = state.doc;
+  var currentMediaNodePos = getPos();
+  if (typeof currentMediaNodePos !== 'number') {
+    return;
+  }
+  tr.deleteRange(currentMediaNodePos, currentMediaNodePos + node.nodeSize);
+  if (isTemporary(id)) {
+    tr.setMeta('addToHistory', false);
+  }
+  var $currentMediaNodePos = doc.resolve(currentMediaNodePos);
+  var nodeBefore = $currentMediaNodePos.nodeBefore,
+    parent = $currentMediaNodePos.parent;
+  var isLastMediaNode = $currentMediaNodePos.index() === parent.childCount - 1;
+
+  // If deleting a selected media node, we need to tell where the cursor to go next.
+  // Prosemirror didn't gave us the behaviour of moving left if the media node is not the last one.
+  // So we handle it ourselves.
+  if (selection.from === currentMediaNodePos && !isLastMediaNode && !atTheBeginningOfDoc(state) && nodeBefore && nodeBefore.type.name === 'media') {
+    var _nodeBefore = findPositionOfNodeBefore(tr.selection);
+    if (_nodeBefore) {
+      tr.setSelection(NodeSelection.create(tr.doc, _nodeBefore));
+    }
+  }
+  view.dispatch(tr);
+};
+export var splitMediaGroup = function splitMediaGroup(view) {
+  var selection = view.state.selection;
+
+  // if selection is not a media node, do nothing.
+  if (!(selection instanceof NodeSelection) || selection.node.type !== view.state.schema.nodes.media) {
+    return false;
+  }
+  deleteSelection(view.state, view.dispatch);
+  if (selection.$to.nodeAfter) {
+    splitBlock(view.state, view.dispatch);
+    createParagraphNear(false)(view.state, view.dispatch);
+  } else {
+    createNewParagraphBelow(view.state, view.dispatch);
+  }
+  return true;
+};
+var isOptionalAttr = function isOptionalAttr(attr) {
+  return attr.length > 1 && attr[0] === '_' && attr[1] === '_';
+};
+export var copyOptionalAttrsFromMediaState = function copyOptionalAttrsFromMediaState(mediaState, node) {
+  Object.keys(node.attrs).filter(isOptionalAttr).forEach(function (key) {
+    var mediaStateKey = key.substring(2);
+    var attrValue = mediaState[mediaStateKey];
+    if (attrValue !== undefined) {
+      // @ts-ignore - [unblock prosemirror bump] assigning to readonly prop
+      node.attrs[key] = attrValue;
+    }
+  });
+};
+export var getMediaNodeFromSelection = function getMediaNodeFromSelection(state) {
+  if (!isSelectionMediaSingleNode(state)) {
+    return null;
+  }
+  var tr = state.tr;
+  var pos = tr.selection.from + 1;
+  var mediaNode = tr.doc.nodeAt(pos);
+  if (mediaNode && mediaNode.type === state.schema.nodes.media) {
+    return mediaNode;
+  }
+  return null;
+};

package/dist/esm/utils/media-files.js

@@ -0,0 +1,291 @@
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
+import { atTheBeginningOfBlock, atTheEndOfBlock, atTheEndOfDoc, endPositionOfParent, startPositionOfParent } from '@atlaskit/editor-common/selection';
+import { findFarthestParentNode, insideTableCell, isInLayoutColumn, isInListItem, isSupportedInParent, setNodeSelection, setTextSelection } from '@atlaskit/editor-common/utils';
+import { Fragment } from '@atlaskit/editor-prosemirror/model';
+import { canInsert, hasParentNode, safeInsert } from '@atlaskit/editor-prosemirror/utils';
+import { copyOptionalAttrsFromMediaState, isInsidePotentialEmptyParagraph, isSelectionNonMediaBlockNode, posOfMediaGroupNearby, posOfParentMediaGroup, posOfPrecedingMediaGroup } from './media-common';
+export var canInsertMediaInline = function canInsertMediaInline(state) {
+  var node = state.schema.nodes.mediaInline.create({});
+  return canInsert(state.selection.$to, Fragment.from(node));
+};
+var getInsertMediaGroupAnalytics = function getInsertMediaGroupAnalytics(mediaState, inputMethod) {
+  var media = '';
+  if (mediaState.length === 1) {
+    media = mediaState[0].fileMimeType || 'unknown';
+  } else if (mediaState.length > 1) {
+    media = 'multiple';
+  }
+  return {
+    action: ACTION.INSERTED,
+    actionSubject: ACTION_SUBJECT.DOCUMENT,
+    actionSubjectId: ACTION_SUBJECT_ID.MEDIA,
+    attributes: {
+      type: ACTION_SUBJECT_ID.MEDIA_GROUP,
+      inputMethod: inputMethod,
+      fileExtension: media
+    },
+    eventType: EVENT_TYPE.TRACK
+  };
+};
+var getInsertMediaInlineAnalytics = function getInsertMediaInlineAnalytics(mediaState, inputMethod) {
+  var media = mediaState.fileMimeType || 'unknown';
+  return {
+    action: ACTION.INSERTED,
+    actionSubject: ACTION_SUBJECT.DOCUMENT,
+    actionSubjectId: ACTION_SUBJECT_ID.MEDIA,
+    attributes: {
+      type: ACTION_SUBJECT_ID.MEDIA_INLINE,
+      inputMethod: inputMethod,
+      fileExtension: media
+    },
+    eventType: EVENT_TYPE.TRACK
+  };
+};
+
+/**
+ * Check if current editor selections is a media group or not.
+ * @param state Editor state
+ */
+function isSelectionMediaGroup(state) {
+  var schema = state.schema;
+  var selectionParent = state.selection.$anchor.node();
+  return selectionParent && selectionParent.type === schema.nodes.mediaGroup;
+}
+
+/**
+ * Insert a paragraph after if reach the end of doc
+ * and there is no media group in the front or selection is a non media block node
+ * @param node Node at insertion point
+ * @param state Editor state
+ */
+function shouldAppendParagraph(state, node) {
+  var media = state.schema.nodes.media;
+  var wasMediaNode = node && node.type === media;
+  return (insideTableCell(state) || isInListItem(state) || isInLayoutColumn(state) || atTheEndOfDoc(state) && (!posOfPrecedingMediaGroup(state) || isSelectionNonMediaBlockNode(state))) && !wasMediaNode;
+}
+
+/**
+ * Create a new media inline to insert the new media.
+ * @param view Editor view
+ * @param mediaState Media file to be added to the editor
+ * @param collection Collection for the media to be added
+ */
+export var insertMediaInlineNode = function insertMediaInlineNode(editorAnalyticsAPI) {
+  return function (view, mediaState, collection, inputMethod) {
+    var state = view.state,
+      dispatch = view.dispatch;
+    var schema = state.schema,
+      tr = state.tr;
+    var mediaInline = schema.nodes.mediaInline;
+
+    // Do nothing if no media found
+    if (!mediaInline || !mediaState || collection === undefined) {
+      return false;
+    }
+    var id = mediaState.id;
+    var mediaInlineNode = mediaInline.create({
+      id: id,
+      collection: collection
+    });
+    var space = state.schema.text(' ');
+    var pos = state.selection.$to.pos;
+
+    // If the selection is inside an empty list item set pos inside paragraph
+    if (isInListItem(state) && isInsidePotentialEmptyParagraph(state)) {
+      pos = pos + 1;
+    }
+    var content = Fragment.from([mediaInlineNode, space]);
+
+    // Delete the selection if a selection is made
+    var deleteRange = findDeleteRange(state);
+    if (!deleteRange) {
+      tr.insert(pos, content);
+    } else {
+      tr.insert(pos, content).deleteRange(deleteRange.start, deleteRange.end);
+    }
+    editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(getInsertMediaInlineAnalytics(mediaState, inputMethod))(tr);
+    dispatch(tr);
+    return true;
+  };
+};
+
+/**
+ * Insert a media into an existing media group
+ * or create a new media group to insert the new media.
+ * @param view Editor view
+ * @param mediaStates Media files to be added to the editor
+ * @param collection Collection for the media to be added
+ */
+export var insertMediaGroupNode = function insertMediaGroupNode(editorAnalyticsAPI) {
+  return function (view, mediaStates, collection, inputMethod) {
+    var state = view.state,
+      dispatch = view.dispatch;
+    var tr = state.tr,
+      schema = state.schema;
+    var _schema$nodes = schema.nodes,
+      media = _schema$nodes.media,
+      paragraph = _schema$nodes.paragraph;
+
+    // Do nothing if no media found
+    if (!media || !mediaStates.length) {
+      return;
+    }
+    var mediaNodes = createMediaFileNodes(mediaStates, collection, media);
+    var mediaInsertPos = findMediaInsertPos(state);
+    var resolvedInsertPos = tr.doc.resolve(mediaInsertPos);
+    var parent = resolvedInsertPos.parent;
+    var nodeAtInsertionPoint = tr.doc.nodeAt(mediaInsertPos);
+    var shouldSplit = !isSelectionMediaGroup(state) && isSupportedInParent(state, Fragment.from(state.schema.nodes.mediaGroup.createChecked({}, mediaNodes)));
+    var withParagraph = shouldAppendParagraph(state, nodeAtInsertionPoint);
+    var content = parent.type === schema.nodes.mediaGroup ? mediaNodes // If parent is a mediaGroup do not wrap items again.
+    : [schema.nodes.mediaGroup.createChecked({}, mediaNodes)];
+    if (shouldSplit) {
+      content = withParagraph ? content.concat(paragraph.create()) : content;
+      // delete the selection or empty paragraph
+      var deleteRange = findDeleteRange(state);
+      if (!deleteRange) {
+        tr.insert(mediaInsertPos, content);
+      } else if (mediaInsertPos <= deleteRange.start) {
+        tr.deleteRange(deleteRange.start, deleteRange.end).insert(mediaInsertPos, content);
+      } else {
+        tr.insert(mediaInsertPos, content).deleteRange(deleteRange.start, deleteRange.end);
+      }
+      editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(getInsertMediaGroupAnalytics(mediaStates, inputMethod))(tr);
+      dispatch(tr);
+      setSelectionAfterMediaInsertion(view);
+      return;
+    }
+
+    // Don't append new paragraph when adding media to a existing mediaGroup
+    if (withParagraph && parent.type !== schema.nodes.mediaGroup) {
+      content.push(paragraph.create());
+    }
+    editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(getInsertMediaGroupAnalytics(mediaStates, inputMethod))(tr);
+    dispatch(safeInsert(Fragment.fromArray(content), mediaInsertPos)(tr));
+  };
+};
+var createMediaFileNodes = function createMediaFileNodes(mediaStates, collection, media) {
+  var nodes = mediaStates.map(function (mediaState) {
+    var id = mediaState.id;
+    var node = media.create({
+      id: id,
+      type: 'file',
+      collection: collection
+    });
+    copyOptionalAttrsFromMediaState(mediaState, node);
+    return node;
+  });
+  return nodes;
+};
+
+/**
+ * Find root list node if exist from current selection
+ * @param state Editor state
+ */
+var findRootListNode = function findRootListNode(state) {
+  var _state$schema$nodes = state.schema.nodes,
+    bulletList = _state$schema$nodes.bulletList,
+    orderedList = _state$schema$nodes.orderedList;
+  return findFarthestParentNode(function (node) {
+    return node.type === bulletList || node.type === orderedList;
+  })(state.selection.$from);
+};
+
+/**
+ * Return position of media to be inserted, if it is inside a list
+ * @param content Content to be inserted
+ * @param state Editor State
+ */
+export var getPosInList = function getPosInList(state) {
+  var _state$schema$nodes2 = state.schema.nodes,
+    mediaGroup = _state$schema$nodes2.mediaGroup,
+    listItem = _state$schema$nodes2.listItem;
+
+  // 1. Check if I am inside a list.
+  if (hasParentNode(function (node) {
+    return node.type === listItem;
+  })(state.selection)) {
+    // 2. Get end position of root list
+    var rootListNode = findRootListNode(state);
+    if (rootListNode) {
+      var pos = rootListNode.pos + rootListNode.node.nodeSize;
+      // 3. Fint the first location inside the media group
+      var nextNode = state.doc.nodeAt(pos);
+      if (nextNode && nextNode.type === mediaGroup) {
+        return pos + 1;
+      }
+      return pos;
+    }
+  }
+  return;
+};
+
+/**
+ * Find insertion point,
+ * If it is in a List it will return position to the next block,
+ * If there are any media group close it will return this position
+ * Otherwise, It will return the respective block given selection.
+ * @param content Content to be inserted
+ * @param state Editor state
+ */
+var findMediaInsertPos = function findMediaInsertPos(state) {
+  var _state$selection = state.selection,
+    $from = _state$selection.$from,
+    $to = _state$selection.$to;
+
+  // Check if selection is inside a list.
+  var posInList = getPosInList(state);
+  if (posInList) {
+    // If I have a position in lists, I should return, otherwise I am not inside a list
+    return posInList;
+  }
+  var nearbyMediaGroupPos = posOfMediaGroupNearby(state);
+  if (nearbyMediaGroupPos && (!isSelectionNonMediaBlockNode(state) || $from.pos < nearbyMediaGroupPos && $to.pos < nearbyMediaGroupPos)) {
+    return nearbyMediaGroupPos;
+  }
+  if (isSelectionNonMediaBlockNode(state)) {
+    return $to.pos;
+  }
+  if (atTheEndOfBlock(state)) {
+    return $to.pos + 1;
+  }
+  if (atTheBeginningOfBlock(state)) {
+    return $from.pos - 1;
+  }
+  return $to.pos;
+};
+var findDeleteRange = function findDeleteRange(state) {
+  var _state$selection2 = state.selection,
+    $from = _state$selection2.$from,
+    $to = _state$selection2.$to;
+  if (posOfParentMediaGroup(state)) {
+    return;
+  }
+  if (!isInsidePotentialEmptyParagraph(state) || posOfMediaGroupNearby(state)) {
+    return range($from.pos, $to.pos);
+  }
+  return range(startPositionOfParent($from) - 1, endPositionOfParent($to));
+};
+var range = function range(start) {
+  var end = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : start;
+  return {
+    start: start,
+    end: end
+  };
+};
+var setSelectionAfterMediaInsertion = function setSelectionAfterMediaInsertion(view) {
+  var state = view.state;
+  var doc = state.doc;
+  var mediaPos = posOfMediaGroupNearby(state);
+  if (!mediaPos) {
+    return;
+  }
+  var $mediaPos = doc.resolve(mediaPos);
+  var endOfMediaGroup = endPositionOfParent($mediaPos);
+  if (endOfMediaGroup + 1 >= doc.nodeSize - 1) {
+    // if nothing after the media group, fallback to select the newest uploaded media item
+    setNodeSelection(view, mediaPos);
+  } else {
+    setTextSelection(view, endOfMediaGroup + 1);
+  }
+};

package/dist/esm/utils/media-single.js

@@ -0,0 +1,172 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+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) { _defineProperty(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; }
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
+import { safeInsert, shouldSplitSelectedNodeOnNodeInsertion } from '@atlaskit/editor-common/insert';
+import { getMaxWidthForNestedNodeNext, getMediaSingleInitialWidth, MEDIA_SINGLE_DEFAULT_MIN_PIXEL_WIDTH, MEDIA_SINGLE_VIDEO_MIN_PIXEL_WIDTH } from '@atlaskit/editor-common/media-single';
+import { atTheBeginningOfBlock } from '@atlaskit/editor-common/selection';
+import { checkNodeDown, isEmptyParagraph } from '@atlaskit/editor-common/utils';
+import { Fragment, Slice } from '@atlaskit/editor-prosemirror/model';
+import { safeInsert as pmSafeInsert } from '@atlaskit/editor-prosemirror/utils';
+import { getBooleanFF } from '@atlaskit/platform-feature-flags';
+import { copyOptionalAttrsFromMediaState } from '../utils/media-common';
+import { isImage } from './is-image';
+var getInsertMediaAnalytics = function getInsertMediaAnalytics(inputMethod, fileExtension) {
+  return {
+    action: ACTION.INSERTED,
+    actionSubject: ACTION_SUBJECT.DOCUMENT,
+    actionSubjectId: ACTION_SUBJECT_ID.MEDIA,
+    attributes: {
+      inputMethod: inputMethod,
+      fileExtension: fileExtension,
+      type: ACTION_SUBJECT_ID.MEDIA_SINGLE
+    },
+    eventType: EVENT_TYPE.TRACK
+  };
+};
+function shouldAddParagraph(state) {
+  return atTheBeginningOfBlock(state) && !checkNodeDown(state.selection, state.doc, isEmptyParagraph);
+}
+function insertNodesWithOptionalParagraph(nodes) {
+  var analyticsAttributes = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  var editorAnalyticsAPI = arguments.length > 2 ? arguments[2] : undefined;
+  return function (state, dispatch) {
+    var tr = state.tr,
+      schema = state.schema;
+    var paragraph = schema.nodes.paragraph;
+    var inputMethod = analyticsAttributes.inputMethod,
+      fileExtension = analyticsAttributes.fileExtension;
+    var openEnd = 0;
+    if (shouldAddParagraph(state)) {
+      nodes.push(paragraph.create());
+      openEnd = 1;
+    }
+    tr.replaceSelection(new Slice(Fragment.from(nodes), 0, openEnd));
+    if (inputMethod) {
+      editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(getInsertMediaAnalytics(inputMethod, fileExtension))(tr);
+    }
+    if (dispatch) {
+      dispatch(tr);
+    }
+    return true;
+  };
+}
+export var isMediaSingle = function isMediaSingle(schema, fileMimeType) {
+  return !!schema.nodes.mediaSingle && isImage(fileMimeType);
+};
+export var insertMediaAsMediaSingle = function insertMediaAsMediaSingle(view, node, inputMethod, editorAnalyticsAPI) {
+  var state = view.state,
+    dispatch = view.dispatch;
+  var _state$schema$nodes = state.schema.nodes,
+    mediaSingle = _state$schema$nodes.mediaSingle,
+    media = _state$schema$nodes.media;
+  if (!mediaSingle) {
+    return false;
+  }
+
+  // if not an image type media node
+  if (node.type !== media || !isImage(node.attrs.__fileMimeType) && node.attrs.type !== 'external') {
+    return false;
+  }
+  var mediaSingleNode = mediaSingle.create({}, node);
+  var nodes = [mediaSingleNode];
+  var analyticsAttributes = {
+    inputMethod: inputMethod,
+    fileExtension: node.attrs.__fileMimeType
+  };
+  return insertNodesWithOptionalParagraph(nodes, analyticsAttributes, editorAnalyticsAPI)(state, dispatch);
+};
+export var insertMediaSingleNode = function insertMediaSingleNode(view, mediaState, inputMethod, collection, alignLeftOnInsert, newInsertionBehaviour, widthPluginState, editorAnalyticsAPI) {
+  var _state$selection$$fro;
+  if (collection === undefined) {
+    return false;
+  }
+  var state = view.state,
+    dispatch = view.dispatch;
+  var grandParentNodeType = (_state$selection$$fro = state.selection.$from.node(-1)) === null || _state$selection$$fro === void 0 ? void 0 : _state$selection$$fro.type;
+  var parentNodeType = state.selection.$from.parent.type;
+
+  // add undefined as fallback as we don't want media single width to have upper limit as 0
+  // if widthPluginState.width is 0, default 760 will be used
+  var contentWidth = getMaxWidthForNestedNodeNext(view, state.selection.$from.pos, true) || (widthPluginState === null || widthPluginState === void 0 ? void 0 : widthPluginState.lineLength) || (widthPluginState === null || widthPluginState === void 0 ? void 0 : widthPluginState.width) || undefined;
+  var node = createMediaSingleNode(state.schema, collection, contentWidth, mediaState.status !== 'error' && isVideo(mediaState.fileMimeType) ? MEDIA_SINGLE_VIDEO_MIN_PIXEL_WIDTH : MEDIA_SINGLE_DEFAULT_MIN_PIXEL_WIDTH, alignLeftOnInsert)(mediaState);
+  var fileExtension;
+  if (mediaState.fileName) {
+    var extensionIdx = mediaState.fileName.lastIndexOf('.');
+    fileExtension = extensionIdx >= 0 ? mediaState.fileName.substring(extensionIdx + 1) : undefined;
+  }
+  // should split if media is valid content for the grandparent of the selected node
+  // and the parent node is a paragraph
+  if (shouldSplitSelectedNodeOnNodeInsertion({
+    parentNodeType: parentNodeType,
+    grandParentNodeType: grandParentNodeType,
+    content: node
+  })) {
+    insertNodesWithOptionalParagraph([node], {
+      fileExtension: fileExtension,
+      inputMethod: inputMethod
+    }, editorAnalyticsAPI)(state, dispatch);
+  } else {
+    var tr = null;
+    if (newInsertionBehaviour) {
+      tr = safeInsert(node, state.selection.from)(state.tr);
+    }
+    if (!tr) {
+      var content = shouldAddParagraph(view.state) ? Fragment.fromArray([node, state.schema.nodes.paragraph.create()]) : node;
+      tr = pmSafeInsert(content, undefined, true)(state.tr);
+    }
+    if (inputMethod) {
+      editorAnalyticsAPI === null || editorAnalyticsAPI === void 0 || editorAnalyticsAPI.attachAnalyticsEvent(getInsertMediaAnalytics(inputMethod, fileExtension))(tr);
+    }
+    dispatch(tr);
+  }
+  return true;
+};
+export var createMediaSingleNode = function createMediaSingleNode(schema, collection, maxWidth, minWidth, alignLeftOnInsert) {
+  return function (mediaState) {
+    var id = mediaState.id,
+      dimensions = mediaState.dimensions,
+      contextId = mediaState.contextId,
+      _mediaState$scaleFact = mediaState.scaleFactor,
+      scaleFactor = _mediaState$scaleFact === void 0 ? 1 : _mediaState$scaleFact;
+    var _ref = dimensions || {
+        height: undefined,
+        width: undefined
+      },
+      width = _ref.width,
+      height = _ref.height;
+    var _schema$nodes = schema.nodes,
+      media = _schema$nodes.media,
+      mediaSingle = _schema$nodes.mediaSingle;
+    var scaledWidth = width && Math.round(width / scaleFactor);
+    var mediaNode = media.create({
+      id: id,
+      type: 'file',
+      collection: collection,
+      contextId: contextId,
+      width: scaledWidth,
+      height: height && Math.round(height / scaleFactor)
+    });
+    var mediaSingleAttrs = alignLeftOnInsert ? {
+      layout: 'align-start'
+    } : {};
+    var extendedMediaSingleAttrs = getBooleanFF('platform.editor.media.extended-resize-experience') ? _objectSpread(_objectSpread({}, mediaSingleAttrs), {}, {
+      width: getMediaSingleInitialWidth(scaledWidth, maxWidth, minWidth),
+      // TODO: change to use enum
+      widthType: 'pixel'
+    }) : mediaSingleAttrs;
+    copyOptionalAttrsFromMediaState(mediaState, mediaNode);
+    return mediaSingle.createChecked(extendedMediaSingleAttrs, mediaNode);
+  };
+};
+export 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;
+}
+export var isVideo = function isVideo(fileType) {
+  return !!fileType && fileType.includes('video');
+};

package/dist/types/commands/captions.d.ts

@@ -0,0 +1,5 @@
+import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
+import type { Command } from '@atlaskit/editor-common/types';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+export declare const selectCaptionFromMediaSinglePos: (mediaSingleNodePos: number, mediaSingleNode: PMNode) => Command;
+export declare const insertAndSelectCaptionFromMediaSinglePos: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined) => (mediaSingleNodePos: number | undefined, mediaSingleNode: PMNode) => Command;

package/dist/types/commands/helpers.d.ts

@@ -0,0 +1,15 @@
+import type { Command } from '@atlaskit/editor-common/types';
+import type { EditorState } from '@atlaskit/editor-prosemirror/state';
+import type { MediaNodeWithPosHandler, MediaPluginState } from '../pm-plugins/types';
+/**
+ * Note that Media Inline is inserted like a media single node into the media plugin state.
+ * Though it is not of type mediaSingle, it shares the same `findMediaSingleNode` method
+ *
+ */
+export declare const findMediaSingleNode: (mediaPluginState: MediaPluginState, id: string) => MediaNodeWithPosHandler | null;
+export declare const findAllMediaSingleNodes: (mediaPluginState: MediaPluginState, id: string) => MediaNodeWithPosHandler[];
+export declare const isMediaNode: (pos: number, state: EditorState) => boolean | null;
+export declare const updateAllMediaSingleNodesAttrs: (id: string, attrs: object) => Command;
+export declare const updateCurrentMediaNodeAttrs: (attrs: object, mediaNode: MediaNodeWithPosHandler) => Command;
+export declare const updateMediaSingleNodeAttrs: (id: string, attrs: object) => Command;
+export declare const replaceExternalMedia: (pos: number, attrs: object) => Command;

package/dist/types/commands/index.d.ts

@@ -0,0 +1 @@
+export { updateMediaSingleNodeAttrs, updateAllMediaSingleNodesAttrs, replaceExternalMedia, } from './helpers';

package/dist/types/commands/linking.d.ts

@@ -0,0 +1,9 @@
+import type { EditorAnalyticsAPI, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import type { Command, CommandDispatch } from '@atlaskit/editor-common/types';
+import type { EditorState } from '@atlaskit/editor-prosemirror/state';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+export declare const showLinkingToolbar: Command;
+export declare const showLinkingToolbarWithMediaTypeCheck: Command;
+export declare const hideLinkingToolbar: (state: EditorState, dispatch?: CommandDispatch, view?: EditorView, focusFloatingToolbar?: boolean) => void;
+export declare const unlink: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined) => Command;
+export declare const setUrlToMedia: (url: string, inputMethod: INPUT_METHOD.TYPEAHEAD | INPUT_METHOD.MANUAL, editorAnalyticsAPI: EditorAnalyticsAPI | undefined) => Command;

package/dist/types/index.d.ts

@@ -1 +1,2 @@
-export {};
+export type { MediaNextEditorPluginType as MediaPlugin } from './next-plugin-type';
+export { mediaPlugin } from './plugin';