@atlaskit/editor-core 178.1.1 → 178.1.2

package/dist/es2019/plugins/media/nodeviews/mediaNodeView/media.js

@@ -12,12 +12,9 @@ export const FILE_WIDTH = 156;
 export class MediaNode extends Component {
   constructor(_props) {
     super(_props);
-
     _defineProperty(this, "state", {});
-
     _defineProperty(this, "setViewMediaClientConfig", async () => {
       const mediaProvider = await this.props.mediaProvider;
-
       if (mediaProvider) {
         const viewMediaClientConfig = mediaProvider.viewMediaClientConfig;
         this.setState({
@@ -25,13 +22,11 @@ export class MediaNode extends Component {
         });
       }
     });
-
     _defineProperty(this, "selectMediaSingleFromCard", ({
       event
     }) => {
       this.selectMediaSingle(event);
     });
-
     _defineProperty(this, "selectMediaSingle", event => {
       // We need to call "stopPropagation" here in order to prevent the browser from navigating to
       // another URL if the media node is wrapped in a link mark.
@@ -40,49 +35,41 @@ export class MediaNode extends Component {
       const {
         state
       } = this.props.view;
-
       if (event.shiftKey) {
         // don't select text if there is current selection in a table (as this would override selected cells)
         if (state.selection instanceof CellSelection) {
           return;
         }
-
-        setTextSelection(this.props.view, state.selection.from < propPos ? state.selection.from : propPos - 1, // + 3 needed for offset of the media inside mediaSingle and cursor to make whole mediaSingle selected
+        setTextSelection(this.props.view, state.selection.from < propPos ? state.selection.from : propPos - 1,
+        // + 3 needed for offset of the media inside mediaSingle and cursor to make whole mediaSingle selected
         state.selection.to > propPos ? state.selection.to : propPos + 2);
       } else {
         setNodeSelection(this.props.view, propPos - 1);
       }
     });
-
     _defineProperty(this, "onFullscreenChange", fullscreen => {
       this.mediaPluginState.updateAndDispatch({
         isFullscreen: fullscreen
       });
     });
-
     _defineProperty(this, "handleNewNode", props => {
       const {
         node
       } = props;
       this.mediaPluginState.handleMediaNodeMount(node, () => this.props.getPos());
     });
-
     const {
       view
     } = this.props;
     this.mediaPluginState = mediaStateKey.getState(view.state);
   }
-
   shouldComponentUpdate(nextProps, nextState) {
     const hasNewViewMediaClientConfig = !this.state.viewMediaClientConfig && nextState.viewMediaClientConfig;
-
     if (this.props.selected !== nextProps.selected || this.props.node.attrs.id !== nextProps.node.attrs.id || this.props.node.attrs.collection !== nextProps.node.attrs.collection || this.props.maxDimensions.height !== nextProps.maxDimensions.height || this.props.maxDimensions.width !== nextProps.maxDimensions.width || this.props.contextIdentifierProvider !== nextProps.contextIdentifierProvider || this.props.isLoading !== nextProps.isLoading || this.props.mediaProvider !== nextProps.mediaProvider || hasNewViewMediaClientConfig) {
       return true;
     }
-
     return false;
   }
-
   async componentDidMount() {
     this.handleNewNode(this.props);
     const {
@@ -93,24 +80,20 @@ export class MediaNode extends Component {
     });
     await this.setViewMediaClientConfig();
   }
-
   componentWillUnmount() {
     const {
       node
     } = this.props;
     this.mediaPluginState.handleMediaNodeUnmount(node);
   }
-
   componentDidUpdate(prevProps) {
     if (prevProps.node.attrs.id !== this.props.node.attrs.id) {
       this.mediaPluginState.handleMediaNodeUnmount(prevProps.node);
       this.handleNewNode(this.props);
     }
-
     this.mediaPluginState.updateElement();
     this.setViewMediaClientConfig();
   }
-
   render() {
     const {
       node,
@@ -131,13 +114,11 @@ export class MediaNode extends Component {
       url,
       alt
     } = node.attrs;
-
     if (isLoading || type !== 'external' && !viewMediaClientConfig) {
       return /*#__PURE__*/React.createElement(MediaCardWrapper, {
         dimensions: originalDimensions
       }, /*#__PURE__*/React.createElement(CardLoading, null));
     }
-
     const contextId = contextIdentifierProvider && contextIdentifierProvider.objectId;
     const identifier = type === 'external' ? {
       dataURI: url,
@@ -147,10 +128,11 @@ export class MediaNode extends Component {
       id,
       mediaItemType: 'file',
       collectionName: collection
-    }; // mediaClientConfig is not needed for "external" case. So we have to cheat here.
+    };
+
+    // mediaClientConfig is not needed for "external" case. So we have to cheat here.
     // there is a possibility mediaClientConfig will be part of a identifier,
     // so this might be not an issue
-
     const mediaClientConfig = viewMediaClientConfig || {
       authProvider: () => ({})
     };
@@ -175,6 +157,5 @@ export class MediaNode extends Component {
       alt: alt
     }));
   }
-
 }
 export default withImageLoader(MediaNode);

package/dist/es2019/plugins/media/nodeviews/mediaSingle.js

@@ -1,6 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-
 /** @jsx jsx */
 import { jsx } from '@emotion/react';
 import React, { Component } from 'react';
@@ -29,30 +28,25 @@ import { insertAndSelectCaptionFromMediaSinglePos } from '../commands/captions';
 export default class MediaSingleNode extends Component {
   constructor(...args) {
     super(...args);
-
     _defineProperty(this, "state", {
       width: undefined,
       height: undefined,
       viewMediaClientConfig: undefined,
       isCopying: false
     });
-
     _defineProperty(this, "mediaSingleWrapperRef", /*#__PURE__*/React.createRef());
-
     _defineProperty(this, "captionPlaceHolderRef", /*#__PURE__*/React.createRef());
-
     _defineProperty(this, "createMediaNodeUpdater", props => {
       const node = this.props.node.firstChild;
-      return new MediaNodeUpdater({ ...props,
+      return new MediaNodeUpdater({
+        ...props,
         isMediaSingle: true,
         node: node ? node : this.props.node,
         dispatchAnalyticsEvent: this.props.dispatchAnalyticsEvent
       });
     });
-
     _defineProperty(this, "setViewMediaClientConfig", async props => {
       const mediaProvider = await props.mediaProvider;
-
       if (mediaProvider) {
         const viewMediaClientConfig = mediaProvider.viewMediaClientConfig;
         this.setState({
@@ -60,45 +54,36 @@ export default class MediaSingleNode extends Component {
         });
       }
     });
-
     _defineProperty(this, "updateMediaNodeAttributes", async props => {
       const mediaNodeUpdater = this.createMediaNodeUpdater(props);
       const {
         addPendingTask
-      } = this.props.mediaPluginState; // we want the first child of MediaSingle (type "media")
+      } = this.props.mediaPluginState;
 
+      // we want the first child of MediaSingle (type "media")
       const node = this.props.node.firstChild;
-
       if (!node) {
         return;
       }
-
       const updatedDimensions = await mediaNodeUpdater.getRemoteDimensions();
-
       if (updatedDimensions) {
         mediaNodeUpdater.updateDimensions(updatedDimensions);
       }
-
       if (node.attrs.type === 'external' && node.attrs.__external) {
         const updatingNode = mediaNodeUpdater.handleExternalMedia(this.props.getPos);
         addPendingTask(updatingNode);
         await updatingNode;
         return;
       }
-
       const contextId = mediaNodeUpdater.getNodeContextId();
-
       if (!contextId) {
         await mediaNodeUpdater.updateContextId();
       }
-
       const hasDifferentContextId = await mediaNodeUpdater.hasDifferentContextId();
-
       if (hasDifferentContextId) {
         this.setState({
           isCopying: true
         });
-
         try {
           const copyNode = mediaNodeUpdater.copyNode({
             traceId: node.attrs.__mediaTraceId
@@ -113,7 +98,6 @@ export default class MediaSingleNode extends Component {
         }
       }
     });
-
     _defineProperty(this, "selectMediaSingle", ({
       event
     }) => {
@@ -124,32 +108,29 @@ export default class MediaSingleNode extends Component {
       const {
         state
       } = this.props.view;
-
       if (event.shiftKey) {
         // don't select text if there is current selection in a table (as this would override selected cells)
         if (state.selection instanceof CellSelection) {
           return;
         }
-
-        setTextSelection(this.props.view, state.selection.from < propPos ? state.selection.from : propPos, // + 3 needed for offset of the media inside mediaSingle and cursor to make whole mediaSingle selected
+        setTextSelection(this.props.view, state.selection.from < propPos ? state.selection.from : propPos,
+        // + 3 needed for offset of the media inside mediaSingle and cursor to make whole mediaSingle selected
         state.selection.to > propPos ? state.selection.to : propPos + 3);
       } else {
         setNodeSelection(this.props.view, propPos);
       }
     });
-
     _defineProperty(this, "updateSize", (width, layout) => {
       const {
         state,
         dispatch
       } = this.props.view;
       const pos = this.props.getPos();
-
       if (typeof pos === 'undefined') {
         return;
       }
-
-      const tr = state.tr.setNodeMarkup(pos, undefined, { ...this.props.node.attrs,
+      const tr = state.tr.setNodeMarkup(pos, undefined, {
+        ...this.props.node.attrs,
         layout,
         width
       });
@@ -162,72 +143,58 @@ export default class MediaSingleNode extends Component {
        * [1] https://discuss.prosemirror.net/t/setnodemarkup-loses-current-nodeselection/976
        * [2] https://discuss.prosemirror.net/t/setnodemarkup-and-deselect/3673
        */
-
       tr.setSelection(NodeSelection.create(tr.doc, pos));
       return dispatch(tr);
     });
-
     _defineProperty(this, "onMediaSingleClicked", event => {
       var _this$captionPlaceHol;
-
       if (!browser.ios) {
         return;
       }
-
       if (this.mediaSingleWrapperRef.current !== event.target) {
         return;
       }
-
       (_this$captionPlaceHol = this.captionPlaceHolderRef.current) === null || _this$captionPlaceHol === void 0 ? void 0 : _this$captionPlaceHol.click();
     });
-
     _defineProperty(this, "clickPlaceholder", () => {
       const {
         view,
         getPos,
         node
       } = this.props;
-
       if (typeof getPos === 'boolean') {
         return;
       }
-
       insertAndSelectCaptionFromMediaSinglePos(getPos(), node)(view.state, view.dispatch);
     });
-
     _defineProperty(this, "getLineLength", (view, pos) => {
       if (isRichMediaInsideOfBlockNode(view, pos)) {
         const $pos = view.state.doc.resolve(pos);
         const domNode = view.nodeDOM($pos.pos);
-
         if ($pos.nodeAfter && floatingLayouts.indexOf($pos.nodeAfter.attrs.layout) > -1 && domNode && domNode.parentElement) {
           return domNode.parentElement.offsetWidth;
         }
-
         if (domNode instanceof HTMLElement) {
           return domNode.offsetWidth;
         }
       }
-
       return null;
     });
   }
-
   UNSAFE_componentWillReceiveProps(nextProps) {
     if (nextProps.mediaProvider !== this.props.mediaProvider) {
       this.setViewMediaClientConfig(nextProps);
-    } // Forced updates not required on mobile
-
+    }
 
+    // Forced updates not required on mobile
     if (nextProps.isCopyPasteEnabled === false) {
       return;
-    } // We need to call this method on any prop change since attrs can get removed with collab editing
-    // the method internally checks if we already have all attrs
-
+    }
 
+    // We need to call this method on any prop change since attrs can get removed with collab editing
+    // the method internally checks if we already have all attrs
     this.createMediaNodeUpdater(nextProps).updateFileAttrs();
   }
-
   async componentDidMount() {
     const {
       contextIdentifierProvider
@@ -237,7 +204,6 @@ export default class MediaSingleNode extends Component {
       contextIdentifierProvider: await contextIdentifierProvider
     });
   }
-
   render() {
     const {
       selected,
@@ -260,11 +226,9 @@ export default class MediaSingleNode extends Component {
       width,
       height
     } = attrs;
-
     if (attrs.type === 'external') {
       if (isMediaBlobUrlFromAttrs(attrs)) {
         const urlAttrs = getAttrsFromUrl(attrs.url);
-
         if (urlAttrs) {
           const {
             width: urlWidth,
@@ -274,26 +238,21 @@ export default class MediaSingleNode extends Component {
           height = height || urlHeight;
         }
       }
-
       const {
         width: stateWidth,
         height: stateHeight
       } = this.state;
-
       if (width === null) {
         width = stateWidth || DEFAULT_IMAGE_WIDTH;
       }
-
       if (height === null) {
         height = stateHeight || DEFAULT_IMAGE_HEIGHT;
       }
     }
-
     if (!width || !height) {
       width = DEFAULT_IMAGE_WIDTH;
       height = DEFAULT_IMAGE_HEIGHT;
     }
-
     const mediaSingleProps = {
       layout,
       width,
@@ -305,11 +264,9 @@ export default class MediaSingleNode extends Component {
       hasFallbackContainer: false
     };
     let canResize = !!this.props.mediaOptions.allowResizing;
-
     if (!this.props.mediaOptions.allowResizingInTables) {
       // If resizing not allowed in tables, check parents for tables
       const pos = getPos();
-
       if (pos) {
         const $pos = state.doc.resolve(pos);
         const {
@@ -319,7 +276,6 @@ export default class MediaSingleNode extends Component {
         canResize = canResize && !disabledNode;
       }
     }
-
     const lineLength = this.getLineLength(view, getPos()) || this.props.lineLength;
     const isSelected = selected();
     const shouldShowPlaceholder = getMediaFeatureFlag('captions', mediaOptions.featureFlags) && node.childCount !== 2 && isSelected && state.selection instanceof NodeSelection;
@@ -347,25 +303,17 @@ export default class MediaSingleNode extends Component {
       dispatchAnalyticsEvent: this.props.dispatchAnalyticsEvent
     }), MediaChildren) : jsx(MediaSingle, mediaSingleProps, MediaChildren);
   }
-
 }
-
 _defineProperty(MediaSingleNode, "defaultProps", {
   mediaOptions: {}
 });
-
 _defineProperty(MediaSingleNode, "displayName", 'MediaSingleNode');
-
 class MediaSingleNodeView extends ReactNodeView {
   constructor(...args) {
     super(...args);
-
     _defineProperty(this, "lastOffsetLeft", 0);
-
     _defineProperty(this, "forceViewUpdate", false);
-
     _defineProperty(this, "selectionType", null);
-
     _defineProperty(this, "checkAndUpdateSelectionType", () => {
       const getPos = this.getPos;
       const {
@@ -375,25 +323,20 @@ class MediaSingleNodeView extends ReactNodeView {
       this.selectionType = isNodeSelected;
       return isNodeSelected;
     });
-
     _defineProperty(this, "isNodeSelected", () => {
       this.checkAndUpdateSelectionType();
       return this.selectionType !== null;
     });
   }
-
   createDomRef() {
     const domRef = document.createElement('div');
-
     if (this.reactComponentProps.mediaOptions && this.reactComponentProps.mediaOptions.allowMediaSingleEditable) {
       // workaround Chrome bug in https://product-fabric.atlassian.net/browse/ED-5379
       // see also: https://github.com/ProseMirror/prosemirror/issues/884
       domRef.contentEditable = 'true';
     }
-
     return domRef;
   }
-
   getContentDOM() {
     const dom = document.createElement('div');
     dom.classList.add(MEDIA_CONTENT_WRAP_CLASS_NAME);
@@ -401,44 +344,34 @@ class MediaSingleNodeView extends ReactNodeView {
       dom
     };
   }
-
   viewShouldUpdate(nextNode) {
     if (this.forceViewUpdate) {
       this.forceViewUpdate = false;
       return true;
     }
-
     if (this.node.attrs !== nextNode.attrs) {
       return true;
     }
-
     if (this.selectionType !== this.checkAndUpdateSelectionType()) {
       return true;
     }
-
     if (this.node.childCount !== nextNode.childCount) {
       return true;
     }
-
     return super.viewShouldUpdate(nextNode);
   }
-
   getNodeMediaId(node) {
     if (node.firstChild) {
       return node.firstChild.attrs.id;
     }
-
     return undefined;
   }
-
   update(node, decorations, _innerDecorations, isValidUpdate) {
     if (!isValidUpdate) {
       isValidUpdate = (currentNode, newNode) => this.getNodeMediaId(currentNode) === this.getNodeMediaId(newNode);
     }
-
     return super.update(node, decorations, _innerDecorations, isValidUpdate);
   }
-
   render(props, forwardRef) {
     const {
       eventDispatcher,
@@ -446,8 +379,9 @@ class MediaSingleNodeView extends ReactNodeView {
       providerFactory,
       mediaOptions,
       dispatchAnalyticsEvent
-    } = this.reactComponentProps; // getPos is a boolean for marks, since this is a node we know it must be a function
+    } = this.reactComponentProps;
 
+    // getPos is a boolean for marks, since this is a node we know it must be a function
     const getPos = this.getPos;
     return jsx(WithProviders, {
       providers: ['mediaProvider', 'contextIdentifierProvider'],
@@ -487,24 +421,19 @@ class MediaSingleNodeView extends ReactNodeView {
       }
     });
   }
-
   ignoreMutation() {
     // DOM has changed; recalculate if we need to re-render
     if (this.dom) {
       const offsetLeft = this.dom.offsetLeft;
-
       if (offsetLeft !== this.lastOffsetLeft) {
         this.lastOffsetLeft = offsetLeft;
         this.forceViewUpdate = true;
         this.update(this.node, [], [], () => true);
       }
     }
-
     return true;
   }
-
 }
-
 export const ReactMediaSingleNode = (portalProviderAPI, eventDispatcher, providerFactory, dispatchAnalyticsEvent, mediaOptions = {}) => (node, view, getPos) => {
   const hasIntlContext = true;
   return new MediaSingleNodeView(node, view, getPos, portalProviderAPI, eventDispatcher, {

package/dist/es2019/plugins/media/picker-facade.js

@@ -3,17 +3,15 @@ import { isImagePreview } from '@atlaskit/media-picker';
 export default class PickerFacade {
   constructor(pickerType, config, pickerConfig, analyticsName) {
     _defineProperty(this, "onDragListeners", []);
-
     _defineProperty(this, "onStartListeners", []);
-
     _defineProperty(this, "eventListeners", {});
-
     _defineProperty(this, "handleUploadPreviewUpdate", event => {
       const {
         file,
         preview
-      } = event; //check if upload-error was called before upload-preview-update
+      } = event;
 
+      //check if upload-error was called before upload-preview-update
       const isErroredFile = this.erroredFiles.has(file.id);
       const {
         dimensions,
@@ -35,28 +33,22 @@ export default class PickerFacade {
       this.eventListeners[file.id] = [];
       this.onStartListeners.forEach(cb => cb(state, evt => this.subscribeStateChanged(file, evt), this.analyticsName || this.pickerType));
     });
-
     _defineProperty(this, "subscribeStateChanged", (file, onStateChanged) => {
       const subscribers = this.eventListeners[file.id];
-
       if (!subscribers) {
         return;
       }
-
       subscribers.push(onStateChanged);
     });
-
     _defineProperty(this, "handleUploadError", ({
       error,
       fileId
     }) => {
       const listeners = this.eventListeners[fileId];
       this.erroredFiles.add(fileId);
-
       if (!listeners) {
         return;
       }
-
       listeners.forEach(cb => cb({
         id: fileId,
         status: 'error',
@@ -64,21 +56,19 @@ export default class PickerFacade {
           description: error.description,
           name: error.name
         }
-      })); // remove listeners
+      }));
 
+      // remove listeners
       delete this.eventListeners[fileId];
     });
-
     _defineProperty(this, "handleMobileUploadEnd", event => {
       const {
         file
       } = event;
       const listeners = this.eventListeners[file.id];
-
       if (!listeners) {
         return;
       }
-
       listeners.forEach(cb => cb({
         id: file.id,
         status: 'mobile-upload-end',
@@ -87,86 +77,70 @@ export default class PickerFacade {
         publicId: file.publicId
       }));
     });
-
     _defineProperty(this, "handleReady", event => {
       const {
         file
       } = event;
       const listeners = this.eventListeners[file.id];
-
       if (!listeners) {
         return;
       }
-
       listeners.forEach(cb => cb({
         id: file.id,
         status: 'ready'
-      })); // remove listeners
+      }));
 
+      // remove listeners
       delete this.eventListeners[file.id];
     });
-
     this.config = config;
     this.pickerConfig = pickerConfig;
     this.pickerType = pickerType;
     this.analyticsName = analyticsName;
     this.erroredFiles = new Set();
   }
-
   async init() {
     let picker;
-
     if (this.pickerType === 'customMediaPicker') {
       picker = this.picker = this.pickerConfig;
     }
-
     if (!picker) {
       return this;
     }
-
     picker.on('upload-preview-update', this.handleUploadPreviewUpdate);
     picker.on('upload-end', this.handleReady);
     picker.on('upload-error', this.handleUploadError);
     picker.on('mobile-upload-end', this.handleMobileUploadEnd);
     return this;
   }
-
   get type() {
     return this.pickerType;
   }
-
   get mediaPicker() {
     return this.picker;
   }
-
   destroy() {
     const {
       picker
     } = this;
-
     if (!picker) {
       return;
     }
-
     picker.removeAllListeners('upload-preview-update');
     picker.removeAllListeners('upload-end');
     picker.removeAllListeners('upload-error');
     this.onStartListeners = [];
     this.onDragListeners = [];
   }
-
   setUploadParams(params) {
     if (this.picker) {
       this.picker.setUploadParams(params);
     }
   }
-
   onNewMedia(cb) {
     this.onStartListeners.push(cb);
   }
-
   onDrag(cb) {
     this.onDragListeners.push(cb);
   }
-
 }