@atlaskit/editor-plugin-media 12.8.2 → 12.9.0

package/dist/cjs/nodeviews/mediaNodeView/media.js

@@ -29,7 +29,7 @@ var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _pluginKey = require("../../pm-plugins/plugin-key");
 var _styles = require("../styles");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t3 in e) "default" !== _t3 && {}.hasOwnProperty.call(e, _t3) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t3)) && (i.get || i.set) ? o(f, _t3, i) : f[_t3] = e[_t3]); return f; })(e, t); }
 function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 // This is being used by DropPlaceholder now
@@ -46,12 +46,12 @@ var MediaNode = exports.MediaNode = /*#__PURE__*/function (_Component) {
     (0, _defineProperty2.default)(_this, "unbindKeyDown", null);
     (0, _defineProperty2.default)(_this, "setViewMediaClientConfig", /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
       var mediaProvider, viewMediaClientConfig, viewAndUploadMediaClientConfig;
-      return _regenerator.default.wrap(function _callee$(_context) {
+      return _regenerator.default.wrap(function (_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
-            _context.next = 2;
+            _context.next = 1;
             return _this.props.mediaProvider;
-          case 2:
+          case 1:
             mediaProvider = _context.sent;
             if (mediaProvider) {
               viewMediaClientConfig = mediaProvider.viewMediaClientConfig;
@@ -63,7 +63,7 @@ var MediaNode = exports.MediaNode = /*#__PURE__*/function (_Component) {
                 });
               }
             }
-          case 4:
+          case 2:
           case "end":
             return _context.stop();
         }
@@ -112,6 +112,18 @@ var MediaNode = exports.MediaNode = /*#__PURE__*/function (_Component) {
         canUpdateVideoCaptions: (0, _platformFeatureFlags.fg)('platform_media_video_captions') ? !!viewAndUploadMediaClientConfig : false
       };
     }));
+    (0, _defineProperty2.default)(_this, "onPreviewRender", function (fileId) {
+      if ((0, _platformFeatureFlags.fg)('aifc_page_create_with_rovo_include_infographics')) {
+        var _this$props$pluginInj2;
+        (_this$props$pluginInj2 = _this.props.pluginInjectionApi) === null || _this$props$pluginInj2 === void 0 || (_this$props$pluginInj2 = _this$props$pluginInj2.core) === null || _this$props$pluginInj2 === void 0 || _this$props$pluginInj2.actions.execute(function (_ref3) {
+          var tr = _ref3.tr;
+          return tr.setMeta(_pluginKey.stateKey, {
+            type: 'PREVIEW_RENDERED',
+            fileId: fileId
+          });
+        });
+      }
+    });
     (0, _defineProperty2.default)(_this, "onError", function (reason) {
       var _this$props$api;
       var nestedUnder = _this.getNestedUnder();
@@ -182,24 +194,23 @@ var MediaNode = exports.MediaNode = /*#__PURE__*/function (_Component) {
     key: "componentDidMount",
     value: function () {
       var _componentDidMount = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
-        var contextIdentifierProvider;
-        return _regenerator.default.wrap(function _callee2$(_context2) {
+        var contextIdentifierProvider, _t, _t2;
+        return _regenerator.default.wrap(function (_context2) {
           while (1) switch (_context2.prev = _context2.next) {
             case 0:
               this.handleNewNode(this.props);
               contextIdentifierProvider = this.props.contextIdentifierProvider;
-              _context2.t0 = this;
-              _context2.next = 5;
+              _t = this;
+              _context2.next = 1;
               return contextIdentifierProvider;
-            case 5:
-              _context2.t1 = _context2.sent;
-              _context2.t2 = {
-                contextIdentifierProvider: _context2.t1
-              };
-              _context2.t0.setState.call(_context2.t0, _context2.t2);
-              _context2.next = 10;
+            case 1:
+              _t2 = _context2.sent;
+              _t.setState.call(_t, {
+                contextIdentifierProvider: _t2
+              });
+              _context2.next = 2;
               return this.setViewMediaClientConfig();
-            case 10:
+            case 2:
             case "end":
               return _context2.stop();
           }
@@ -377,6 +388,7 @@ var MediaNode = exports.MediaNode = /*#__PURE__*/function (_Component) {
         ssr: ssr,
         mediaSettings: this.getMediaSettings(viewAndUploadMediaClientConfig),
         isAIGenerating: !!this.props.isAIGenerating,
+        onPreviewRender: this.onPreviewRender,
         onError: (0, _expValEquals.expValEquals)('platform_editor_media_error_analytics', 'isEnabled', true) ? this.onError : undefined
       })));
     }

package/dist/cjs/nodeviews/mediaSingleNext.js

@@ -32,7 +32,7 @@ var _ResizableMediaSingleNext = _interopRequireDefault(require("../ui/ResizableM
 var _helpers = require("./helpers");
 var _mediaNodeUpdater = require("./mediaNodeUpdater");
 var _styles = require("./styles");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t2 in e) "default" !== _t2 && {}.hasOwnProperty.call(e, _t2) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t2)) && (i.get || i.set) ? o(f, _t2, i) : f[_t2] = e[_t2]); return f; })(e, t); }
 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; } /**
  * @jsxRuntime classic
@@ -86,63 +86,63 @@ var useMediaNodeUpdater = function useMediaNodeUpdater(_ref) {
 };
 var mediaAsyncOperations = /*#__PURE__*/function () {
   var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(props) {
-    var updatedDimensions, currentAttrs, updatingNode, contextId, shouldNodeBeDeepCopied, copyNode;
-    return _regenerator.default.wrap(function _callee$(_context) {
+    var updatedDimensions, currentAttrs, updatingNode, contextId, shouldNodeBeDeepCopied, copyNode, _t;
+    return _regenerator.default.wrap(function (_context) {
       while (1) switch (_context.prev = _context.next) {
         case 0:
-          _context.next = 2;
+          _context.next = 1;
           return props.updater.getRemoteDimensions();
-        case 2:
+        case 1:
           updatedDimensions = _context.sent;
           currentAttrs = props.mediaChildNode.attrs;
           if (updatedDimensions && ((currentAttrs === null || currentAttrs === void 0 ? void 0 : currentAttrs.width) !== updatedDimensions.width || (currentAttrs === null || currentAttrs === void 0 ? void 0 : currentAttrs.height) !== updatedDimensions.height)) {
             props.updater.updateDimensions(updatedDimensions);
           }
           if (!(props.mediaChildNode.attrs.type === 'external' && props.mediaChildNode.attrs.__external)) {
-            _context.next = 11;
+            _context.next = 3;
             break;
           }
           updatingNode = props.updater.handleExternalMedia(props.getPos);
           props.addPendingTask(updatingNode);
-          _context.next = 10;
+          _context.next = 2;
           return updatingNode;
-        case 10:
+        case 2:
           return _context.abrupt("return");
-        case 11:
+        case 3:
           contextId = props.updater.getNodeContextId();
           if (contextId) {
-            _context.next = 15;
+            _context.next = 4;
             break;
           }
-          _context.next = 15;
+          _context.next = 4;
           return props.updater.updateContextId();
-        case 15:
-          _context.next = 17;
+        case 4:
+          _context.next = 5;
           return props.updater.shouldNodeBeDeepCopied();
-        case 17:
+        case 5:
           shouldNodeBeDeepCopied = _context.sent;
           if (!shouldNodeBeDeepCopied) {
-            _context.next = 28;
+            _context.next = 9;
             break;
           }
-          _context.prev = 19;
+          _context.prev = 6;
           copyNode = props.updater.copyNode({
             traceId: props.mediaNode.attrs.__mediaTraceId
           });
           props.addPendingTask(copyNode);
-          _context.next = 24;
+          _context.next = 7;
           return copyNode;
-        case 24:
-          _context.next = 28;
+        case 7:
+          _context.next = 9;
           break;
-        case 26:
-          _context.prev = 26;
-          _context.t0 = _context["catch"](19);
-        case 28:
+        case 8:
+          _context.prev = 8;
+          _t = _context["catch"](6);
+        case 9:
         case "end":
           return _context.stop();
       }
-    }, _callee, null, [[19, 26]]);
+    }, _callee, null, [[6, 8]]);
   }));
   return function mediaAsyncOperations(_x) {
     return _ref2.apply(this, arguments);

package/dist/cjs/pm-plugins/ai-generating-decoration.js

@@ -10,6 +10,7 @@ exports.createAIGeneratingDecorationPlugin = createAIGeneratingDecorationPlugin;
 exports.hasAIGeneratingDecoration = hasAIGeneratingDecoration;
 exports.setAIGeneratingMeta = setAIGeneratingMeta;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _view = require("@atlaskit/editor-prosemirror/view");
@@ -82,10 +83,11 @@ function hasAIGeneratingDecoration(decorations) {
  * );
  * ```
  */
-function setAIGeneratingMeta(tr, mediaId) {
+function setAIGeneratingMeta(tr, mediaId, source) {
   return tr.setMeta(aiGeneratingDecorationPluginKey, {
     type: 'SET_GENERATING',
-    mediaId: mediaId
+    mediaId: mediaId,
+    source: source
   }).setMeta('addToHistory', false);
 }
 
@@ -109,7 +111,7 @@ function createAIGeneratingDecorationPlugin() {
     state: {
       init: function init() {
         return {
-          generatingMediaIds: new Set(),
+          generatingMediaIds: new Map(),
           decorationSet: _view.DecorationSet.empty
         };
       },
@@ -118,7 +120,7 @@ function createAIGeneratingDecorationPlugin() {
         if (!(0, _platformFeatureFlags.fg)('cc-maui-phase-2') || !(0, _expValEquals.expValEquals)('cc-maui-experiment', 'isEnabled', true)) {
           if (pluginState.generatingMediaIds.size > 0) {
             return {
-              generatingMediaIds: new Set(),
+              generatingMediaIds: new Map(),
               decorationSet: _view.DecorationSet.empty
             };
           }
@@ -129,30 +131,76 @@ function createAIGeneratingDecorationPlugin() {
           switch (meta.type) {
             case 'SET_GENERATING':
               {
-                var ids = new Set(pluginState.generatingMediaIds);
-                ids.add(meta.mediaId);
+                var _meta$source;
+                var ids = new Map(pluginState.generatingMediaIds);
+                ids.set(meta.mediaId, (_meta$source = meta.source) !== null && _meta$source !== void 0 ? _meta$source : 'maui');
+                var _hasCwrIds = (0, _platformFeatureFlags.fg)('aifc_page_create_with_rovo_include_infographics') && (0, _toConsumableArray2.default)(ids.values()).some(function (s) {
+                  return s === 'cwr';
+                });
+                var newDecoSet = buildDecorationSet(newState.doc, ids);
+                if (_hasCwrIds && newDecoSet.find().length === 0 && ids.size > 0) {
+                  // CWR fallback — keep existing decorations during transient doc absence
+                  return {
+                    generatingMediaIds: ids,
+                    decorationSet: pluginState.decorationSet
+                  };
+                }
                 return {
                   generatingMediaIds: ids,
-                  decorationSet: buildDecorationSet(newState.doc, ids)
+                  decorationSet: newDecoSet
                 };
               }
             case 'CLEAR_GENERATING':
               {
-                var _ids = new Set(pluginState.generatingMediaIds);
+                var _ids = new Map(pluginState.generatingMediaIds);
                 _ids.delete(meta.mediaId);
+                var _hasCwrIds2 = (0, _platformFeatureFlags.fg)('aifc_page_create_with_rovo_include_infographics') && (0, _toConsumableArray2.default)(_ids.values()).some(function (s) {
+                  return s === 'cwr';
+                });
+                var _newDecoSet = buildDecorationSet(newState.doc, _ids);
+                if (_hasCwrIds2 && _newDecoSet.find().length === 0) {
+                  // CWR fallback — keep existing decorations during transient doc absence
+                  return {
+                    generatingMediaIds: _ids,
+                    decorationSet: pluginState.decorationSet
+                  };
+                }
                 return {
                   generatingMediaIds: _ids,
-                  decorationSet: buildDecorationSet(newState.doc, _ids)
+                  decorationSet: _newDecoSet
                 };
               }
             case 'CLEAR_ALL':
               return {
-                generatingMediaIds: new Set(),
+                generatingMediaIds: new Map(),
                 decorationSet: _view.DecorationSet.empty
               };
           }
         }
 
+        // CWR path
+        // Rebuild decorations from scratch because CWR streaming replaces the
+        // entire document on every chunk and map() drops decorations whose
+        // positions can't be mapped.
+        var hasCwrIds = (0, _platformFeatureFlags.fg)('aifc_page_create_with_rovo_include_infographics') && (0, _toConsumableArray2.default)(pluginState.generatingMediaIds.values()).some(function (s) {
+          return s === 'cwr';
+        });
+        if (tr.docChanged && hasCwrIds) {
+          var rebuilt = buildDecorationSet(newState.doc, pluginState.generatingMediaIds);
+          var prevCount = pluginState.decorationSet.find().length;
+          var newCount = rebuilt.find().length;
+
+          // Prevents flickering that results from updating during transient
+          // doc replacements (when nodes are briefly absent)
+          if (newCount !== prevCount && newCount >= pluginState.generatingMediaIds.size) {
+            return _objectSpread(_objectSpread({}, pluginState), {}, {
+              decorationSet: rebuilt
+            });
+          }
+          return pluginState;
+        }
+
+        // Remix path
         // Map decorations through document changes so positions stay in sync
         if (tr.docChanged && pluginState.decorationSet !== _view.DecorationSet.empty) {
           try {
@@ -160,9 +208,8 @@ function createAIGeneratingDecorationPlugin() {
               decorationSet: pluginState.decorationSet.map(tr.mapping, newState.doc)
             });
           } catch (_unused) {
-            // Collaborative editing edge case — reset
             return {
-              generatingMediaIds: new Set(),
+              generatingMediaIds: new Map(),
               decorationSet: _view.DecorationSet.empty
             };
           }

package/dist/cjs/pm-plugins/commands.js

@@ -48,10 +48,10 @@ var trackMediaPaste = exports.trackMediaPaste = function trackMediaPaste(attrs)
  * Decorations live in the view layer only and never affect the document model
  * or undo/redo history.
  */
-var setAIGenerating = exports.setAIGenerating = function setAIGenerating(mediaId) {
+var setAIGenerating = exports.setAIGenerating = function setAIGenerating(mediaId, source) {
   return function (_ref4) {
     var tr = _ref4.tr;
-    return (0, _aiGeneratingDecoration.setAIGeneratingMeta)(tr, mediaId);
+    return (0, _aiGeneratingDecoration.setAIGeneratingMeta)(tr, mediaId, source);
   };
 };
 

package/dist/cjs/pm-plugins/main.js

@@ -42,7 +42,7 @@ var _actions = require("./actions");
 var _mediaTaskManager = require("./mediaTaskManager");
 var _pickerFacade = _interopRequireDefault(require("./picker-facade"));
 var _pluginKey = require("./plugin-key");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t3 in e) "default" !== _t3 && {}.hasOwnProperty.call(e, _t3) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t3)) && (i.get || i.set) ? o(f, _t3, i) : f[_t3] = e[_t3]); return f; })(e, t); }
 function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
@@ -83,6 +83,7 @@ var MediaPluginStateImplementation = exports.MediaPluginStateImplementation = /*
     (0, _defineProperty2.default)(this, "ignoreLinks", false);
     (0, _defineProperty2.default)(this, "waitForMediaUpload", true);
     (0, _defineProperty2.default)(this, "allUploadsFinished", true);
+    (0, _defineProperty2.default)(this, "previewRenderedMediaIds", new Set());
     (0, _defineProperty2.default)(this, "showDropzone", false);
     (0, _defineProperty2.default)(this, "isFullscreen", false);
     (0, _defineProperty2.default)(this, "layout", 'center');
@@ -714,19 +715,19 @@ var MediaPluginStateImplementation = exports.MediaPluginStateImplementation = /*
     key: "setMediaProvider",
     value: function () {
       var _setMediaProvider = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(mediaProvider) {
-        var viewMediaClientConfig, wrappedError, view, allowsUploads;
-        return _regenerator.default.wrap(function _callee$(_context) {
+        var viewMediaClientConfig, wrappedError, view, allowsUploads, _t;
+        return _regenerator.default.wrap(function (_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
               if (!(this.previousMediaProvider === mediaProvider)) {
-                _context.next = 2;
+                _context.next = 1;
                 break;
               }
               return _context.abrupt("return");
-            case 2:
+            case 1:
               this.previousMediaProvider = mediaProvider;
               if (mediaProvider) {
-                _context.next = 8;
+                _context.next = 2;
                 break;
               }
               this.destroyPickers();
@@ -737,21 +738,21 @@ var MediaPluginStateImplementation = exports.MediaPluginStateImplementation = /*
                 }));
               }
               return _context.abrupt("return");
-            case 8:
-              _context.prev = 8;
+            case 2:
+              _context.prev = 2;
               if (!(mediaProvider instanceof Promise)) {
-                _context.next = 15;
+                _context.next = 4;
                 break;
               }
-              _context.next = 12;
+              _context.next = 3;
               return mediaProvider;
-            case 12:
+            case 3:
               this.mediaProvider = _context.sent;
-              _context.next = 16;
+              _context.next = 5;
               break;
-            case 15:
+            case 4:
               this.mediaProvider = mediaProvider;
-            case 16:
+            case 5:
               // Ignored via go/ees007
               // eslint-disable-next-line @atlaskit/editor/enforce-todo-comment-format
               // TODO [MS-2038]: remove once context api is removed
@@ -764,12 +765,12 @@ var MediaPluginStateImplementation = exports.MediaPluginStateImplementation = /*
                 }
               }
               (0, _assert.default)(this.mediaProvider.viewMediaClientConfig, "MediaProvider promise did not resolve to a valid instance of MediaProvider - ".concat(this.mediaProvider));
-              _context.next = 28;
+              _context.next = 7;
               break;
-            case 20:
-              _context.prev = 20;
-              _context.t0 = _context["catch"](8);
-              wrappedError = new Error("Media functionality disabled due to rejected provider: ".concat(_context.t0 instanceof Error ? _context.t0.message : String(_context.t0)));
+            case 6:
+              _context.prev = 6;
+              _t = _context["catch"](2);
+              wrappedError = new Error("Media functionality disabled due to rejected provider: ".concat(_t instanceof Error ? _t.message : String(_t)));
               this.errorReporter.captureException(wrappedError);
               this.destroyPickers();
               this.allowsUploads = false;
@@ -779,7 +780,7 @@ var MediaPluginStateImplementation = exports.MediaPluginStateImplementation = /*
                 }));
               }
               return _context.abrupt("return");
-            case 28:
+            case 7:
               this.mediaClientConfig = this.mediaProvider.viewMediaClientConfig;
               this.allowsUploads = !!this.mediaProvider.uploadMediaClientConfig;
               view = this.view, allowsUploads = this.allowsUploads; // make sure editable DOM node is mounted
@@ -790,31 +791,31 @@ var MediaPluginStateImplementation = exports.MediaPluginStateImplementation = /*
                 }));
               }
               if (!this.allowsUploads) {
-                _context.next = 42;
+                _context.next = 11;
                 break;
               }
               this.uploadMediaClientConfig = this.mediaProvider.uploadMediaClientConfig;
               if (!(this.mediaProvider.uploadParams && this.uploadMediaClientConfig)) {
-                _context.next = 39;
+                _context.next = 9;
                 break;
               }
-              _context.next = 37;
+              _context.next = 8;
               return this.initPickers(this.mediaProvider.uploadParams, _pickerFacade.default);
-            case 37:
-              _context.next = 40;
+            case 8:
+              _context.next = 10;
               break;
-            case 39:
+            case 9:
               this.destroyPickers();
-            case 40:
-              _context.next = 43;
+            case 10:
+              _context.next = 12;
               break;
-            case 42:
+            case 11:
               this.destroyPickers();
-            case 43:
+            case 12:
             case "end":
               return _context.stop();
           }
-        }, _callee, this, [[8, 20]]);
+        }, _callee, this, [[2, 6]]);
       }));
       function setMediaProvider(_x) {
         return _setMediaProvider.apply(this, arguments);
@@ -932,19 +933,19 @@ var MediaPluginStateImplementation = exports.MediaPluginStateImplementation = /*
     value: function () {
       var _initPickers = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(uploadParams, Picker) {
         var _this3 = this;
-        var errorReporter, pickers, pickerPromises, pickerFacadeConfig, customPicker;
-        return _regenerator.default.wrap(function _callee2$(_context2) {
+        var errorReporter, pickers, pickerPromises, pickerFacadeConfig, customPicker, _t2;
+        return _regenerator.default.wrap(function (_context2) {
           while (1) switch (_context2.prev = _context2.next) {
             case 0:
               if (!(this.destroyed || !this.uploadMediaClientConfig)) {
-                _context2.next = 2;
+                _context2.next = 1;
                 break;
               }
               return _context2.abrupt("return");
-            case 2:
+            case 1:
               errorReporter = this.errorReporter, pickers = this.pickers, pickerPromises = this.pickerPromises; // create pickers if they don't exist, re-use otherwise
               if (pickers.length) {
-                _context2.next = 14;
+                _context2.next = 4;
                 break;
               }
               pickerFacadeConfig = {
@@ -952,27 +953,26 @@ var MediaPluginStateImplementation = exports.MediaPluginStateImplementation = /*
                 errorReporter: errorReporter
               };
               if (!this.options.customMediaPicker) {
-                _context2.next = 13;
+                _context2.next = 3;
                 break;
               }
               customPicker = new Picker('customMediaPicker', pickerFacadeConfig, this.options.customMediaPicker).init();
               pickerPromises.push(customPicker);
-              _context2.t0 = pickers;
-              _context2.next = 11;
+              _t2 = pickers;
+              _context2.next = 2;
               return customPicker;
-            case 11:
-              _context2.t1 = this.customPicker = _context2.sent;
-              _context2.t0.push.call(_context2.t0, _context2.t1);
-            case 13:
+            case 2:
+              _t2.push.call(_t2, this.customPicker = _context2.sent);
+            case 3:
               pickers.forEach(function (picker) {
                 picker.onNewMedia(_this3.insertFile);
               });
-            case 14:
+            case 4:
               // set new upload params for the pickers
               pickers.forEach(function (picker) {
                 return picker.setUploadParams(uploadParams);
               });
-            case 15:
+            case 5:
             case "end":
               return _context2.stop();
           }
@@ -1044,7 +1044,7 @@ var createPlugin = exports.createPlugin = function createPlugin(_schema, options
           nextPluginState = nextPluginState.clone();
         }
         var meta = tr.getMeta(_pluginKey.stateKey);
-        if (meta) {
+        if (meta && meta.type !== 'PREVIEW_RENDERED') {
           var allowsUploads = meta.allowsUploads;
           pluginState.updateAndDispatch({
             allowsUploads: typeof allowsUploads === 'undefined' ? pluginState.allowsUploads : allowsUploads
@@ -1052,6 +1052,15 @@ var createPlugin = exports.createPlugin = function createPlugin(_schema, options
           nextPluginState = nextPluginState.clone();
         }
 
+        // Handle preview render notifications — add the file ID to the
+        // previewRenderedMediaIds Set so sharedState subscribers can react.
+        if ((meta === null || meta === void 0 ? void 0 : meta.type) === 'PREVIEW_RENDERED' && typeof meta.fileId === 'string') {
+          var newSet = new Set(pluginState.previewRenderedMediaIds);
+          newSet.add(meta.fileId);
+          pluginState.previewRenderedMediaIds = newSet;
+          nextPluginState = nextPluginState.clone();
+        }
+
         // ACTIONS
         switch (meta === null || meta === void 0 ? void 0 : meta.type) {
           case _actions.ACTIONS.SHOW_MEDIA_VIEWER:

package/dist/cjs/pm-plugins/mediaTaskManager.js

@@ -26,15 +26,15 @@ var MediaTaskManager = exports.MediaTaskManager = /*#__PURE__*/(0, _createClass2
   (0, _defineProperty2.default)(this, "waitForPendingTasks", /*#__PURE__*/function () {
     var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(timeout, lastTask) {
       var chainedPromise, rejectTimeout, timeoutPromise;
-      return _regenerator.default.wrap(function _callee$(_context) {
+      return _regenerator.default.wrap(function (_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
             if (!(lastTask && _this.pendingTask === lastTask)) {
-              _context.next = 2;
+              _context.next = 1;
               break;
             }
             return _context.abrupt("return", lastTask);
-          case 2:
+          case 1:
             chainedPromise = _this.pendingTask.then(function () {
               return (
                 // Call ourselves to make sure that no new pending tasks have been
@@ -43,11 +43,11 @@ var MediaTaskManager = exports.MediaTaskManager = /*#__PURE__*/(0, _createClass2
               );
             });
             if (timeout) {
-              _context.next = 5;
+              _context.next = 2;
               break;
             }
             return _context.abrupt("return", chainedPromise);
-          case 5:
+          case 2:
             timeoutPromise = new Promise(function (_resolve, reject) {
               rejectTimeout = window.setTimeout(function () {
                 return reject(new Error("Media operations did not finish in ".concat(timeout, " ms")));
@@ -57,7 +57,7 @@ var MediaTaskManager = exports.MediaTaskManager = /*#__PURE__*/(0, _createClass2
               clearTimeout(rejectTimeout);
               return value;
             })]));
-          case 7:
+          case 3:
           case "end":
             return _context.stop();
         }

package/dist/cjs/pm-plugins/picker-facade.js

@@ -122,24 +122,24 @@ var PickerFacade = exports.default = /*#__PURE__*/function () {
     value: function () {
       var _init = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
         var picker;
-        return _regenerator.default.wrap(function _callee$(_context) {
+        return _regenerator.default.wrap(function (_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
               if (this.pickerType === 'customMediaPicker') {
                 picker = this.picker = this.pickerConfig;
               }
               if (picker) {
-                _context.next = 3;
+                _context.next = 1;
                 break;
               }
               return _context.abrupt("return", this);
-            case 3:
+            case 1:
               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 _context.abrupt("return", this);
-            case 8:
+            case 2:
             case "end":
               return _context.stop();
           }