@atlaskit/editor-plugin-media 0.3.1 → 0.3.2

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @atlaskit/editor-plugin-media
 
+## 0.3.2
+
+### Patch Changes
+
+- [#41248](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/41248) [`21fa5648746`](https://bitbucket.org/atlassian/atlassian-frontend/commits/21fa5648746) - Fix incorrect layout calculation for nested Media Single nodes resized via toolbar
+- Updated dependencies
+
 ## 0.3.1
 
 ### Patch Changes

package/dist/cjs/toolbar/index.js

@@ -297,6 +297,11 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
           // get pos of media node
           mediaWidth || _mediaSingle.DEFAULT_IMAGE_WIDTH);
           var pixelWidth = isLegacy ? pixelWidthFromElement : mediaSingleWidth;
+
+          //hasParentNode will return falsey value if selection depth === 0
+          var isNested = (0, _utils.hasParentNode)(function (n) {
+            return n.type !== state.schema.nodes.doc;
+          })(state.selection);
           return /*#__PURE__*/_react.default.createElement(_PixelEntry.PixelEntry, {
             intl: intl,
             width: pluginState.isResizing ? pluginState.resizingWidth : pixelWidth,
@@ -316,7 +321,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
               var _pluginInjectionApi$a4;
               var width = _ref2.width,
                 validation = _ref2.validation;
-              var newLayout = (0, _utils2.calcNewLayout)(width, layout, contentWidth, options.fullWidthEnabled);
+              var newLayout = (0, _utils2.calcNewLayout)(width, layout, contentWidth, options.fullWidthEnabled, isNested);
               (0, _commands.updateMediaSingleWidth)(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a4 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a4 === void 0 ? void 0 : _pluginInjectionApi$a4.actions)(width, validation, newLayout)(state, dispatch);
             },
             onMigrate: function onMigrate() {

package/dist/cjs/toolbar/utils.js

@@ -81,7 +81,10 @@ var getPixelWidthOfElement = exports.getPixelWidthOfElement = function getPixelW
 };
 var calcNewLayout = exports.calcNewLayout = function calcNewLayout(width, layout, contentWidth) {
   var fullWidthMode = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
+  var isNested = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
   var isWrappedLayout = _mediaSingle.wrappedLayouts.indexOf(layout) > -1;
+
+  //See flowchart for layout logic: https://hello.atlassian.net/wiki/spaces/TWPCP/whiteboard/2969594044
   if (width >= _editorSharedStyles.akEditorFullWidthLayoutWidth) {
     // If width is greater than or equal to full editor width
     return 'full-width';
@@ -90,11 +93,11 @@ var calcNewLayout = exports.calcNewLayout = function calcNewLayout(width, layout
     // If under editor full width mode
     return isWrappedLayout ? layout : 'center';
   }
-  if (width > contentWidth) {
+  if (width > contentWidth && !isNested) {
     // If width is greater than content length and not nested
     return 'wide';
   }
-  return isWrappedLayout && width !== contentWidth ? layout : 'center';
+  return isNested || isWrappedLayout && width !== contentWidth ? layout : 'center';
 };
 var maxToolbarFitWidth = 0;
 var getMaxToolbarWidth = exports.getMaxToolbarWidth = function getMaxToolbarWidth() {

package/dist/es2019/toolbar/index.js

@@ -4,7 +4,7 @@ import { buildLayoutButtons } from '@atlaskit/editor-common/card';
 import { calcMinWidth, DEFAULT_IMAGE_HEIGHT, DEFAULT_IMAGE_WIDTH } from '@atlaskit/editor-common/media-single';
 import commonMessages, { cardMessages } from '@atlaskit/editor-common/messages';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
-import { findParentNodeOfType, hasParentNodeOfType, removeSelectedNode } from '@atlaskit/editor-prosemirror/utils';
+import { findParentNodeOfType, hasParentNode, hasParentNodeOfType, removeSelectedNode } from '@atlaskit/editor-prosemirror/utils';
 import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
 import DownloadIcon from '@atlaskit/icon/glyph/download';
 import RemoveIcon from '@atlaskit/icon/glyph/editor/remove';
@@ -300,6 +300,9 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
           // get pos of media node
           mediaWidth || DEFAULT_IMAGE_WIDTH);
           const pixelWidth = isLegacy ? pixelWidthFromElement : mediaSingleWidth;
+
+          //hasParentNode will return falsey value if selection depth === 0
+          const isNested = hasParentNode(n => n.type !== state.schema.nodes.doc)(state.selection);
           return /*#__PURE__*/React.createElement(PixelEntry, {
             intl: intl,
             width: pluginState.isResizing ? pluginState.resizingWidth : pixelWidth,
@@ -320,7 +323,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
               validation
             }) => {
               var _pluginInjectionApi$a4;
-              const newLayout = calcNewLayout(width, layout, contentWidth, options.fullWidthEnabled);
+              const newLayout = calcNewLayout(width, layout, contentWidth, options.fullWidthEnabled, isNested);
               updateMediaSingleWidth(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a4 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a4 === void 0 ? void 0 : _pluginInjectionApi$a4.actions)(width, validation, newLayout)(state, dispatch);
             },
             onMigrate: () => {

package/dist/es2019/toolbar/utils.js

@@ -56,8 +56,10 @@ export const getPixelWidthOfElement = (editorView, pos, mediaWidth) => {
   }
   return mediaWidth;
 };
-export const calcNewLayout = (width, layout, contentWidth, fullWidthMode = false) => {
+export const calcNewLayout = (width, layout, contentWidth, fullWidthMode = false, isNested = false) => {
   const isWrappedLayout = wrappedLayouts.indexOf(layout) > -1;
+
+  //See flowchart for layout logic: https://hello.atlassian.net/wiki/spaces/TWPCP/whiteboard/2969594044
   if (width >= akEditorFullWidthLayoutWidth) {
     // If width is greater than or equal to full editor width
     return 'full-width';
@@ -66,11 +68,11 @@ export const calcNewLayout = (width, layout, contentWidth, fullWidthMode = false
     // If under editor full width mode
     return isWrappedLayout ? layout : 'center';
   }
-  if (width > contentWidth) {
+  if (width > contentWidth && !isNested) {
     // If width is greater than content length and not nested
     return 'wide';
   }
-  return isWrappedLayout && width !== contentWidth ? layout : 'center';
+  return isNested || isWrappedLayout && width !== contentWidth ? layout : 'center';
 };
 let maxToolbarFitWidth = 0;
 export const getMaxToolbarWidth = () => {

package/dist/esm/toolbar/index.js

@@ -8,7 +8,7 @@ import { buildLayoutButtons } from '@atlaskit/editor-common/card';
 import { calcMinWidth, DEFAULT_IMAGE_HEIGHT, DEFAULT_IMAGE_WIDTH } from '@atlaskit/editor-common/media-single';
 import commonMessages, { cardMessages } from '@atlaskit/editor-common/messages';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
-import { findParentNodeOfType, hasParentNodeOfType, removeSelectedNode } from '@atlaskit/editor-prosemirror/utils';
+import { findParentNodeOfType, hasParentNode, hasParentNodeOfType, removeSelectedNode } from '@atlaskit/editor-prosemirror/utils';
 import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
 import DownloadIcon from '@atlaskit/icon/glyph/download';
 import RemoveIcon from '@atlaskit/icon/glyph/editor/remove';
@@ -287,6 +287,11 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
           // get pos of media node
           mediaWidth || DEFAULT_IMAGE_WIDTH);
           var pixelWidth = isLegacy ? pixelWidthFromElement : mediaSingleWidth;
+
+          //hasParentNode will return falsey value if selection depth === 0
+          var isNested = hasParentNode(function (n) {
+            return n.type !== state.schema.nodes.doc;
+          })(state.selection);
           return /*#__PURE__*/React.createElement(PixelEntry, {
             intl: intl,
             width: pluginState.isResizing ? pluginState.resizingWidth : pixelWidth,
@@ -306,7 +311,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
               var _pluginInjectionApi$a4;
               var width = _ref2.width,
                 validation = _ref2.validation;
-              var newLayout = calcNewLayout(width, layout, contentWidth, options.fullWidthEnabled);
+              var newLayout = calcNewLayout(width, layout, contentWidth, options.fullWidthEnabled, isNested);
               updateMediaSingleWidth(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a4 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a4 === void 0 ? void 0 : _pluginInjectionApi$a4.actions)(width, validation, newLayout)(state, dispatch);
             },
             onMigrate: function onMigrate() {

package/dist/esm/toolbar/utils.js

@@ -74,7 +74,10 @@ export var getPixelWidthOfElement = function getPixelWidthOfElement(editorView,
 };
 export var calcNewLayout = function calcNewLayout(width, layout, contentWidth) {
   var fullWidthMode = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
+  var isNested = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
   var isWrappedLayout = wrappedLayouts.indexOf(layout) > -1;
+
+  //See flowchart for layout logic: https://hello.atlassian.net/wiki/spaces/TWPCP/whiteboard/2969594044
   if (width >= akEditorFullWidthLayoutWidth) {
     // If width is greater than or equal to full editor width
     return 'full-width';
@@ -83,11 +86,11 @@ export var calcNewLayout = function calcNewLayout(width, layout, contentWidth) {
     // If under editor full width mode
     return isWrappedLayout ? layout : 'center';
   }
-  if (width > contentWidth) {
+  if (width > contentWidth && !isNested) {
     // If width is greater than content length and not nested
     return 'wide';
   }
-  return isWrappedLayout && width !== contentWidth ? layout : 'center';
+  return isNested || isWrappedLayout && width !== contentWidth ? layout : 'center';
 };
 var maxToolbarFitWidth = 0;
 export var getMaxToolbarWidth = function getMaxToolbarWidth() {

package/dist/types/toolbar/utils.d.ts

@@ -7,5 +7,5 @@ export declare const downloadMedia: (mediaPluginState: MediaPluginState) => Prom
 export declare const removeMediaGroupNode: (state: EditorState) => import("prosemirror-state").Transaction;
 export declare const getSelectedMediaSingle: (state: EditorState) => import("prosemirror-utils/dist/types").FindResult;
 export declare const getPixelWidthOfElement: (editorView: EditorView, pos: number, mediaWidth: number) => number;
-export declare const calcNewLayout: (width: number, layout: RichMediaLayout, contentWidth: number, fullWidthMode?: boolean) => RichMediaLayout;
+export declare const calcNewLayout: (width: number, layout: RichMediaLayout, contentWidth: number, fullWidthMode?: boolean, isNested?: boolean) => RichMediaLayout;
 export declare const getMaxToolbarWidth: () => number;

package/dist/types-ts4.5/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-ts4.5/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-ts4.5/commands/index.d.ts

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

package/dist/types-ts4.5/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-ts4.5/index.d.ts

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

package/dist/types-ts4.5/media-plugin-options.d.ts

@@ -0,0 +1,17 @@
+import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import type { ErrorReporter } from '@atlaskit/editor-common/utils';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
+import type { CustomMediaPicker, getPosHandler, MediaState } from './types';
+export type MediaPluginOptions = {
+    providerFactory: ProviderFactory;
+    nodeViews: {
+        [name: string]: (node: PMNode, view: EditorView, getPos: getPosHandler) => NodeView;
+    };
+    errorReporter?: ErrorReporter;
+    uploadErrorHandler?: (state: MediaState) => void;
+    waitForMediaUpload?: boolean;
+    customDropzoneContainer?: HTMLElement;
+    customMediaPicker?: CustomMediaPicker;
+    allowResizing: boolean;
+};

package/dist/types-ts4.5/next-plugin-type.d.ts

@@ -0,0 +1,33 @@
+import type { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
+import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
+import type { DecorationsPlugin } from '@atlaskit/editor-plugin-decorations';
+import type { EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
+import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
+import type { FloatingToolbarPlugin } from '@atlaskit/editor-plugin-floating-toolbar';
+import type { FocusPlugin } from '@atlaskit/editor-plugin-focus';
+import type { GridPlugin } from '@atlaskit/editor-plugin-grid';
+import type { GuidelinePlugin } from '@atlaskit/editor-plugin-guideline';
+import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
+import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
+import type { MediaPluginState } from './pm-plugins/types';
+import type { MediaOptions } from './types';
+import type { InsertMediaAsMediaSingle } from './utils/media-single';
+export type MediaNextEditorPluginType = NextEditorPlugin<'media', {
+    pluginConfiguration: MediaOptions | undefined;
+    dependencies: [
+        FeatureFlagsPlugin,
+        OptionalPlugin<AnalyticsPlugin>,
+        GuidelinePlugin,
+        GridPlugin,
+        WidthPlugin,
+        DecorationsPlugin,
+        FloatingToolbarPlugin,
+        EditorDisabledPlugin,
+        FocusPlugin,
+        SelectionPlugin
+    ];
+    sharedState: MediaPluginState | null;
+    actions: {
+        insertMediaAsMediaSingle: InsertMediaAsMediaSingle;
+    };
+}>;

package/dist/types-ts4.5/nodeviews/__mocks__/mediaNodeUpdater.d.ts

@@ -0,0 +1,24 @@
+export declare class MediaNodeUpdater {
+    static instances: MediaNodeUpdater[];
+    static mockOverrides: {};
+    static mockReset(): void;
+    constructor();
+    static setMock(thisKey: string, value: any): void;
+    updateContextId(): Promise<void>;
+    updateNodeContextId(): Promise<void>;
+    getAttrs(): void;
+    getObjectId(): Promise<void>;
+    getNodeContextId(): void;
+    updateDimensions(): void;
+    getRemoteDimensions(): Promise<void>;
+    isNodeFromDifferentCollection(): Promise<void>;
+    hasDifferentContextId(): Promise<void>;
+    copyNode(): Promise<void>;
+    copyNodeFromPos(): Promise<void>;
+    updateMediaSingleFileAttrs(): Promise<void>;
+    uploadExternalMedia(): Promise<void>;
+    isMediaBlobUrl(): void;
+    copyNodeFromBlobUrl(): void;
+    updateNodeAttrs(): void;
+    handleExternalMedia(): Promise<void>;
+}

package/dist/types-ts4.5/nodeviews/mediaGroup.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import type { WrappedComponentProps } from 'react-intl-next';
+import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
+import type { PortalProviderAPI } from '@atlaskit/editor-common/portal-provider';
+import type { ContextIdentifierProvider, MediaProvider, ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
+import type { MediaClientConfig } from '@atlaskit/media-core';
+import type { MediaNextEditorPluginType } from '../next-plugin-type';
+import type { getPosHandler, MediaOptions } from '../types';
+export type MediaGroupProps = {
+    forwardRef?: (ref: HTMLElement) => void;
+    node: PMNode;
+    view: EditorView;
+    getPos: () => number | undefined;
+    disabled?: boolean;
+    allowLazyLoading?: boolean;
+    mediaProvider: Promise<MediaProvider>;
+    contextIdentifierProvider?: Promise<ContextIdentifierProvider>;
+    isCopyPasteEnabled?: boolean;
+    anchorPos: number;
+    headPos: number;
+    mediaOptions: MediaOptions;
+} & WrappedComponentProps;
+export interface MediaGroupState {
+    viewMediaClientConfig?: MediaClientConfig;
+}
+declare const IntlMediaGroup: React.FC<import("react-intl-next").WithIntlProps<MediaGroupProps>> & {
+    WrappedComponent: React.ComponentType<MediaGroupProps>;
+};
+export default IntlMediaGroup;
+export declare const ReactMediaGroupNode: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, mediaOptions: MediaOptions | undefined, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => (node: PMNode, view: EditorView, getPos: getPosHandler) => NodeView;

package/dist/types-ts4.5/nodeviews/mediaInline.d.ts

@@ -0,0 +1,50 @@
+import React from 'react';
+import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
+import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
+import type { PortalProviderAPI } from '@atlaskit/editor-common/portal-provider';
+import type { ContextIdentifierProvider, MediaProvider, ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import { SelectionBasedNodeView } from '@atlaskit/editor-common/selection-based-node-view';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { EditorView, NodeView } from '@atlaskit/editor-prosemirror/view';
+import type { FileIdentifier } from '@atlaskit/media-client';
+import type { MediaNextEditorPluginType } from '../next-plugin-type';
+import type { MediaPluginState } from '../pm-plugins/types';
+import type { getPosHandler, getPosHandler as ProsemirrorGetPosHandler } from '../types';
+import { MediaNodeUpdater } from './mediaNodeUpdater';
+export interface MediaInlineProps {
+    mediaProvider: Promise<MediaProvider>;
+    identifier: FileIdentifier;
+    node: PMNode;
+    isSelected: boolean;
+    view: EditorView;
+    getPos: ProsemirrorGetPosHandler;
+    dispatchAnalyticsEvent?: DispatchAnalyticsEvent;
+    contextIdentifierProvider?: Promise<ContextIdentifierProvider>;
+    mediaPluginState: MediaPluginState;
+}
+export declare const createMediaNodeUpdater: (props: MediaInlineProps) => MediaNodeUpdater;
+/**
+ * Handles updating the media inline node attributes
+ * but also handling copy-paste for cross-editor of the same instance
+ * using the contextid
+ *
+ */
+export declare const updateMediaNodeAttributes: (props: MediaInlineProps, mediaNodeUpdater: MediaNodeUpdater) => Promise<void>;
+export declare const handleNewNode: (props: MediaInlineProps) => void;
+export declare const MediaInline: React.FC<MediaInlineProps>;
+export interface MediaInlineNodeViewProps {
+    providerFactory: ProviderFactory;
+    api: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined;
+    dispatchAnalyticsEvent?: DispatchAnalyticsEvent;
+}
+export declare class MediaInlineNodeView extends SelectionBasedNodeView<MediaInlineNodeViewProps> {
+    createDomRef(): HTMLSpanElement;
+    getContentDOM(): {
+        dom: HTMLSpanElement;
+    };
+    ignoreMutation(): boolean;
+    viewShouldUpdate(nextNode: PMNode): boolean;
+    render(props: MediaInlineNodeViewProps): JSX.Element;
+}
+export declare const ReactMediaInlineNode: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, api: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined, dispatchAnalyticsEvent?: DispatchAnalyticsEvent) => (node: PMNode, view: EditorView, getPos: getPosHandler) => NodeView;

package/dist/types-ts4.5/nodeviews/mediaNodeUpdater.d.ts

@@ -0,0 +1,45 @@
+import type { MediaADFAttrs } from '@atlaskit/adf-schema';
+import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
+import type { ContextIdentifierProvider, MediaProvider } from '@atlaskit/editor-common/provider-factory';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { MediaTraceContext } from '@atlaskit/media-common';
+import type { MediaOptions, getPosHandler as ProsemirrorGetPosHandler } from '../types';
+export type RemoteDimensions = {
+    id: string;
+    height: number;
+    width: number;
+};
+export interface MediaNodeUpdaterProps {
+    view: EditorView;
+    node: PMNode;
+    mediaProvider?: Promise<MediaProvider>;
+    contextIdentifierProvider?: Promise<ContextIdentifierProvider>;
+    isMediaSingle: boolean;
+    mediaOptions?: MediaOptions;
+    dispatchAnalyticsEvent?: DispatchAnalyticsEvent;
+}
+export declare class MediaNodeUpdater {
+    props: MediaNodeUpdaterProps;
+    constructor(props: MediaNodeUpdaterProps);
+    isMediaBlobUrl(): boolean;
+    updateContextId: () => Promise<void>;
+    updateNodeContextId: (getPos: ProsemirrorGetPosHandler) => Promise<void>;
+    private hasFileAttributesDefined;
+    private getNewFileAttrsForNode;
+    updateMediaSingleFileAttrs: () => Promise<void>;
+    updateNodeAttrs: (getPos: ProsemirrorGetPosHandler) => Promise<void>;
+    getAttrs: () => MediaADFAttrs | undefined;
+    getObjectId: () => Promise<string | null>;
+    uploadExternalMedia: (getPos: ProsemirrorGetPosHandler) => Promise<void>;
+    getNodeContextId: () => string | null;
+    updateDimensions: (dimensions: RemoteDimensions) => void;
+    getRemoteDimensions(): Promise<false | RemoteDimensions>;
+    hasDifferentContextId: () => Promise<boolean>;
+    isNodeFromDifferentCollection: () => Promise<boolean>;
+    handleExternalMedia(getPos: ProsemirrorGetPosHandler): Promise<void>;
+    copyNodeFromBlobUrl: (getPos: ProsemirrorGetPosHandler) => Promise<void>;
+    copyNodeFromPos: (getPos: ProsemirrorGetPosHandler, traceContext?: MediaTraceContext) => Promise<void>;
+    copyNode: (traceContext?: MediaTraceContext) => Promise<void>;
+    private copyFile;
+}

package/dist/types-ts4.5/nodeviews/mediaNodeView/index.d.ts

@@ -0,0 +1,28 @@
+/// <reference types="react" />
+import type { MediaADFAttrs } from '@atlaskit/adf-schema';
+import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
+import type { PortalProviderAPI } from '@atlaskit/editor-common/portal-provider';
+import type { ContextIdentifierProvider, MediaProvider, ProviderFactory, Providers } from '@atlaskit/editor-common/provider-factory';
+import { SelectionBasedNodeView } from '@atlaskit/editor-common/selection-based-node-view';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { WidthPluginState } from '@atlaskit/editor-plugin-width';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { Decoration, EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { MediaNextEditorPluginType } from '../../next-plugin-type';
+import type { getPosHandler, MediaOptions } from '../../types';
+import type { MediaNodeViewProps } from '../types';
+declare class MediaNodeView extends SelectionBasedNodeView<MediaNodeViewProps> {
+    private isSelected;
+    createDomRef(): HTMLElement;
+    viewShouldUpdate(nextNode: PMNode, decorations: Decoration[]): boolean;
+    stopEvent(event: Event): boolean;
+    getAttrs(): MediaADFAttrs;
+    isMediaBlobUrl(): boolean;
+    renderMediaNodeWithState: (mediaProvider?: Promise<MediaProvider>, contextIdentifierProvider?: Promise<ContextIdentifierProvider>) => ({ width: editorWidth }: {
+        width?: import("@atlaskit/editor-common/types").EditorContainerWidth | undefined;
+    }) => JSX.Element;
+    renderMediaNodeWithProviders: ({ mediaProvider, contextIdentifierProvider, }: Providers) => JSX.Element;
+    render(): JSX.Element;
+}
+export declare const ReactMediaNode: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, mediaOptions: MediaOptions | undefined, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => (node: PMNode, view: EditorView, getPos: getPosHandler) => MediaNodeView;
+export {};

package/dist/types-ts4.5/nodeviews/mediaNodeView/media.d.ts

@@ -0,0 +1,44 @@
+import React, { Component } from 'react';
+import type { ContextIdentifierProvider, MediaProvider } from '@atlaskit/editor-common/provider-factory';
+import type { ImageLoaderProps } from '@atlaskit/editor-common/utils';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { CardDimensions, CardOnClickCallback, NumericalCardDimensions } from '@atlaskit/media-card';
+import type { MediaClientConfig } from '@atlaskit/media-core';
+import type { MediaOptions, getPosHandler as ProsemirrorGetPosHandler, ReactNodeProps } from '../../types';
+export declare const MEDIA_HEIGHT = 125;
+export declare const FILE_WIDTH = 156;
+export interface MediaNodeProps extends ReactNodeProps, ImageLoaderProps {
+    view: EditorView;
+    node: PMNode;
+    getPos: ProsemirrorGetPosHandler;
+    contextIdentifierProvider?: Promise<ContextIdentifierProvider>;
+    originalDimensions: NumericalCardDimensions;
+    maxDimensions: CardDimensions;
+    isMediaSingle?: boolean;
+    onClick?: CardOnClickCallback;
+    mediaProvider?: Promise<MediaProvider>;
+    isLoading?: boolean;
+    mediaOptions?: MediaOptions;
+}
+interface MediaNodeState {
+    viewMediaClientConfig?: MediaClientConfig;
+    contextIdentifierProvider?: ContextIdentifierProvider;
+}
+export declare class MediaNode extends Component<MediaNodeProps, MediaNodeState> {
+    private mediaPluginState;
+    state: MediaNodeState;
+    constructor(props: MediaNodeProps);
+    shouldComponentUpdate(nextProps: MediaNodeProps, nextState: MediaNodeState): boolean;
+    componentDidMount(): Promise<void>;
+    componentWillUnmount(): void;
+    componentDidUpdate(prevProps: Readonly<MediaNodeProps>): void;
+    private setViewMediaClientConfig;
+    private selectMediaSingleFromCard;
+    private selectMediaSingle;
+    render(): JSX.Element;
+    private onFullscreenChange;
+    private handleNewNode;
+}
+declare const _default: React.ComponentClass<MediaNodeProps & ImageLoaderProps, any>;
+export default _default;

package/dist/types-ts4.5/nodeviews/mediaSingle.d.ts

@@ -0,0 +1,62 @@
+/** @jsx jsx */
+import type { MouseEvent } from 'react';
+import React, { Component } from 'react';
+import { jsx } from '@emotion/react';
+import type { RichMediaLayout as MediaSingleLayout } from '@atlaskit/adf-schema';
+import type { DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
+import type { EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
+import type { PortalProviderAPI } from '@atlaskit/editor-common/portal-provider';
+import type { ContextIdentifierProvider, ProviderFactory } from '@atlaskit/editor-common/provider-factory';
+import ReactNodeView from '@atlaskit/editor-common/react-node-view';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import type { Decoration, DecorationSource, EditorView } from '@atlaskit/editor-prosemirror/view';
+import type { CardEvent } from '@atlaskit/media-card';
+import type { MediaClientConfig } from '@atlaskit/media-core';
+import type { MediaNextEditorPluginType } from '../next-plugin-type';
+import type { ForwardRef, getPosHandler } from '../types';
+import type { MediaOptions } from '../types';
+import { MediaNodeUpdater } from './mediaNodeUpdater';
+import type { MediaSingleNodeProps, MediaSingleNodeViewProps } from './types';
+export interface MediaSingleNodeState {
+    width?: number;
+    height?: number;
+    viewMediaClientConfig?: MediaClientConfig;
+    contextIdentifierProvider?: ContextIdentifierProvider;
+    isCopying: boolean;
+}
+export default class MediaSingleNode extends Component<MediaSingleNodeProps, MediaSingleNodeState> {
+    static defaultProps: Partial<MediaSingleNodeProps>;
+    static displayName: string;
+    state: MediaSingleNodeState;
+    mediaSingleWrapperRef: React.RefObject<HTMLDivElement>;
+    captionPlaceHolderRef: React.RefObject<HTMLSpanElement>;
+    createMediaNodeUpdater: (props: MediaSingleNodeProps) => MediaNodeUpdater;
+    UNSAFE_componentWillReceiveProps(nextProps: MediaSingleNodeProps): void;
+    setViewMediaClientConfig: (props: MediaSingleNodeProps) => Promise<void>;
+    updateMediaNodeAttributes: (props: MediaSingleNodeProps) => Promise<void>;
+    componentDidMount(): Promise<void>;
+    selectMediaSingle: ({ event }: CardEvent) => void;
+    updateSize: (width: number | null, layout: MediaSingleLayout) => void;
+    onMediaSingleClicked: (event: MouseEvent) => void;
+    render(): jsx.JSX.Element;
+    private clickPlaceholder;
+}
+declare class MediaSingleNodeView extends ReactNodeView<MediaSingleNodeViewProps> {
+    lastOffsetLeft: number;
+    forceViewUpdate: boolean;
+    selectionType: number | null;
+    createDomRef(): HTMLElement;
+    getContentDOM(): {
+        dom: HTMLDivElement;
+    };
+    viewShouldUpdate(nextNode: PMNode): boolean;
+    checkAndUpdateSelectionType: () => import("@atlaskit/editor-common/utils").SelectedState | null;
+    isNodeSelected: () => boolean;
+    getNodeMediaId(node: PMNode): string | undefined;
+    update(node: PMNode, decorations: readonly Decoration[], _innerDecorations?: DecorationSource, isValidUpdate?: (currentNode: PMNode, newNode: PMNode) => boolean): boolean;
+    render(props: MediaSingleNodeViewProps, forwardRef?: ForwardRef): jsx.JSX.Element;
+    ignoreMutation(): boolean;
+}
+export declare const ReactMediaSingleNode: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined, dispatchAnalyticsEvent?: DispatchAnalyticsEvent, mediaOptions?: MediaOptions) => (node: PMNode, view: EditorView, getPos: getPosHandler) => MediaSingleNodeView;
+export {};

package/dist/types-ts4.5/nodeviews/messages.d.ts

@@ -0,0 +1,7 @@
+export declare const messages: {
+    mediaGroupDeleteLabel: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+};

package/dist/types-ts4.5/nodeviews/styles.d.ts

@@ -0,0 +1,16 @@
+/** @jsx jsx */
+import React from 'react';
+import { jsx } from '@emotion/react';
+import type { NumericalCardDimensions } from '@atlaskit/media-card';
+export declare const MediaInlineNodeSelector = "media-inline-node";
+export declare const MediaSingleNodeSelector = "media-single-node";
+export declare const figureWrapper: import("@emotion/react").SerializedStyles;
+type MediaCardWrapperProps = {
+    dimensions: NumericalCardDimensions;
+    children: React.ReactNode;
+    selected?: boolean;
+    borderWidth?: number;
+    onContextMenu?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
+};
+export declare const MediaCardWrapper: ({ dimensions, children, selected, borderWidth, onContextMenu, }: MediaCardWrapperProps) => jsx.JSX.Element;
+export {};