@atlaskit/editor-common 111.20.4 → 111.20.6

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/editor-common
 
+## 111.20.6
+
+### Patch Changes
+
+- [`6197fb38452ae`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6197fb38452ae) -
+  [ux] Sets height auto explicitly when static position is applied to address latent bug discovered
+  by ForgeAdfRenderer.
+- Updated dependencies
+
+## 111.20.5
+
+### Patch Changes
+
+- [`64fe39d800a84`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/64fe39d800a84) -
+  Improve ExperienceCheckPopupMutation logic to be more performant
+- Updated dependencies
+
 ## 111.20.4
 
 ### Patch Changes

package/dist/cjs/experiences/ExperienceCheckPopupMutation.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ExperienceCheckPopupMutation = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
@@ -21,18 +22,10 @@ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length)
  * - 'editorContent': Content-level popups or modals in portal containers (e.g., block menu)
  */
 var ExperienceCheckPopupMutation = exports.ExperienceCheckPopupMutation = /*#__PURE__*/function () {
-  function ExperienceCheckPopupMutation(_ref) {
-    var getEditorDom = _ref.getEditorDom,
-      getTarget = _ref.getTarget,
-      nestedElementQuery = _ref.nestedElementQuery,
-      _ref$type = _ref.type,
-      type = _ref$type === void 0 ? 'editorRoot' : _ref$type;
+  function ExperienceCheckPopupMutation(config) {
     (0, _classCallCheck2.default)(this, ExperienceCheckPopupMutation);
     (0, _defineProperty2.default)(this, "observers", []);
-    this.getEditorDom = getEditorDom;
-    this.getTarget = getTarget;
-    this.nestedElementQuery = nestedElementQuery;
-    this.type = type;
+    this.config = config;
   }
 
   /**
@@ -41,13 +34,14 @@ var ExperienceCheckPopupMutation = exports.ExperienceCheckPopupMutation = /*#__P
   return (0, _createClass2.default)(ExperienceCheckPopupMutation, [{
     key: "getObserveTargets",
     value: function getObserveTargets() {
-      switch (this.type) {
+      var config = this.config;
+      switch (config.type) {
         case 'inline':
-          return this.getInlineTargets();
+          return this.getInlineTargets(config);
         case 'editorRoot':
-          return this.getEditorRootTargets();
+          return this.getEditorRootTargets(config);
         case 'editorContent':
-          return this.getEditorContentTargets();
+          return this.getEditorContentTargets(config);
       }
     }
 
@@ -58,8 +52,8 @@ var ExperienceCheckPopupMutation = exports.ExperienceCheckPopupMutation = /*#__P
      */
   }, {
     key: "getEditorContentTargets",
-    value: function getEditorContentTargets() {
-      var target = this.getTarget();
+    value: function getEditorContentTargets(config) {
+      var target = config.getTarget();
       if (!target) {
         return [];
       }
@@ -87,8 +81,8 @@ var ExperienceCheckPopupMutation = exports.ExperienceCheckPopupMutation = /*#__P
      */
   }, {
     key: "getInlineTargets",
-    value: function getInlineTargets() {
-      var target = this.getTarget();
+    value: function getInlineTargets(config) {
+      var target = config.getTarget();
       if (!target) {
         return [];
       }
@@ -102,26 +96,13 @@ var ExperienceCheckPopupMutation = exports.ExperienceCheckPopupMutation = /*#__P
      */
   }, {
     key: "getEditorRootTargets",
-    value: function getEditorRootTargets() {
+    value: function getEditorRootTargets(config) {
       var targets = [];
-      var editorDom = this.getEditorDom();
+      var editorDom = config.getEditorDom();
       if (editorDom) {
         var editorRoot = editorDom.closest('.akEditor') || editorDom.parentElement;
         if (editorRoot instanceof HTMLElement) {
           targets.push(editorRoot);
-          var wrappers = editorRoot.querySelectorAll('[data-editor-popup]');
-          var _iterator2 = _createForOfIteratorHelper(wrappers),
-            _step2;
-          try {
-            for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-              var wrapper = _step2.value;
-              targets.push(wrapper);
-            }
-          } catch (err) {
-            _iterator2.e(err);
-          } finally {
-            _iterator2.f();
-          }
         }
       }
       return targets;
@@ -130,8 +111,7 @@ var ExperienceCheckPopupMutation = exports.ExperienceCheckPopupMutation = /*#__P
     key: "start",
     value: function start(callback) {
       var _this = this;
-      this.stop();
-      var target = this.getTarget();
+      var target = this.config.type === 'editorRoot' ? this.config.getEditorDom() : this.config.getTarget();
       var doc = (0, _browserApis.getDocument)();
       if (!target || !doc) {
         callback({
@@ -141,78 +121,58 @@ var ExperienceCheckPopupMutation = exports.ExperienceCheckPopupMutation = /*#__P
         return;
       }
       var observeTargets = this.getObserveTargets();
-      var query = this.nestedElementQuery;
+      var query = this.config.nestedElementQuery;
+      var subtree = this.config.type === 'inline' && this.config.subtree === true;
       var observe = function observe(el) {
         var observer = new MutationObserver(onMutation);
         observer.observe(el, {
-          childList: true
+          childList: true,
+          subtree: subtree
         });
         _this.observers.push(observer);
       };
       var onMutation = function onMutation(mutations) {
-        var _iterator3 = _createForOfIteratorHelper(mutations),
-          _step3;
-        try {
-          for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
-            var mutation = _step3.value;
-            if (mutation.type !== 'childList') {
-              continue;
-            }
-            var _iterator4 = _createForOfIteratorHelper(mutation.addedNodes),
-              _step4;
-            try {
-              for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
-                var node = _step4.value;
-                if (!(node instanceof HTMLElement)) {
-                  continue;
-                }
-                var found = (0, _experienceUtils.popupWithNestedElement)(node, query) || node.matches(query) || !!node.querySelector(query);
-                if (found) {
-                  callback({
-                    status: 'success'
-                  });
-                  return;
-                }
-              }
-            } catch (err) {
-              _iterator4.e(err);
-            } finally {
-              _iterator4.f();
-            }
-          }
-        } catch (err) {
-          _iterator3.e(err);
-        } finally {
-          _iterator3.f();
+        var found = mutations.some(function (_ref) {
+          var type = _ref.type,
+            addedNodes = _ref.addedNodes;
+          return type === 'childList' && (0, _toConsumableArray2.default)(addedNodes).some(function (node) {
+            return node instanceof HTMLElement && ((0, _experienceUtils.popupWithNestedElement)(node, query) || node.matches(query) || node.querySelector(query) !== null);
+          });
+        });
+        if (found) {
+          callback({
+            status: 'success'
+          });
+          return;
         }
       };
-      var _iterator5 = _createForOfIteratorHelper(observeTargets),
-        _step5;
+      var _iterator2 = _createForOfIteratorHelper(observeTargets),
+        _step2;
       try {
-        for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
-          var observeTarget = _step5.value;
+        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+          var observeTarget = _step2.value;
           observe(observeTarget);
         }
       } catch (err) {
-        _iterator5.e(err);
+        _iterator2.e(err);
       } finally {
-        _iterator5.f();
+        _iterator2.f();
       }
     }
   }, {
     key: "stop",
     value: function stop() {
-      var _iterator6 = _createForOfIteratorHelper(this.observers),
-        _step6;
+      var _iterator3 = _createForOfIteratorHelper(this.observers),
+        _step3;
       try {
-        for (_iterator6.s(); !(_step6 = _iterator6.n()).done;) {
-          var observer = _step6.value;
+        for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+          var observer = _step3.value;
           observer.disconnect();
         }
       } catch (err) {
-        _iterator6.e(err);
+        _iterator3.e(err);
       } finally {
-        _iterator6.f();
+        _iterator3.f();
       }
       this.observers = [];
     }

package/dist/cjs/monitoring/error.js

@@ -19,7 +19,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var 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 _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); }
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "111.20.3";
+var packageVersion = "0.0.0-development";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/cjs/ui/DropList/index.js

@@ -24,7 +24,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
  * @jsx jsx
  */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "111.20.3";
+var packageVersion = "0.0.0-development";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var fadeIn = (0, _react2.keyframes)({

package/dist/cjs/ui/MediaSingle/styled.js

@@ -15,6 +15,7 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
 var _react = _interopRequireDefault(require("react"));
 var _react2 = require("@emotion/react");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _utils = require("../../utils");
 var _breakout = require("../../utils/breakout");
@@ -258,7 +259,7 @@ var RenderFallbackContainer = function RenderFallbackContainer(_ref2) {
 
 // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Needs manual remediation
 var mediaWrapperStyle = exports.mediaWrapperStyle = function mediaWrapperStyle(props) {
-  return (0, _react2.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n\tposition: relative;\n\n\t", "\n\n\t/* Editor */\n  & > figure {\n\t\tposition: ", ";\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\n\t/* Comments on media project adds comment badge as child of the media wrapper,\n\tthus we need to exclude it so that style is applied to intended div */\n\t& > div:not([data-media-badges='true']) {\n\t\tposition: ", ";\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\n\t& * [data-mark-annotation-type='inlineComment'] {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t}\n\n\t&[data-node-type='embedCard'] > div {\n\t\twidth: 100%;\n\t}\n\n\t/* Renderer */\n\t[data-node-type='media'] {\n\t\tposition: static !important;\n\n\t\t> div {\n\t\t\tposition: absolute;\n\t\t\theight: 100%;\n\t\t}\n\t}\n"])), RenderFallbackContainer(props), props.hasFallbackContainer ? 'absolute' : 'relative', props.hasFallbackContainer ? 'absolute' : 'relative');
+  return (0, _react2.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n\tposition: relative;\n\n\t", "\n\n\t/* Editor */\n  & > figure {\n\t\tposition: ", ";\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\n\t/* Comments on media project adds comment badge as child of the media wrapper,\n\tthus we need to exclude it so that style is applied to intended div */\n\t& > div:not([data-media-badges='true']) {\n\t\tposition: ", ";\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\n\t& * [data-mark-annotation-type='inlineComment'] {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t}\n\n\t&[data-node-type='embedCard'] > div {\n\t\twidth: 100%;\n\t}\n\n\t/* Renderer */\n\t[data-node-type='media'] {\n\t\tposition: static !important;\n\t\t", "\n\n\t\t> div {\n\t\t\tposition: absolute;\n\t\t\theight: 100%;\n\t\t}\n\t}\n"])), RenderFallbackContainer(props), props.hasFallbackContainer ? 'absolute' : 'relative', props.hasFallbackContainer ? 'absolute' : 'relative', (0, _platformFeatureFlags.fg)('platform_forge_ui_support_images_in_adfrenderer') ? 'height: auto !important;' : '');
 };
 var MediaWrapper = exports.MediaWrapper = function MediaWrapper(_ref3) {
   var children = _ref3.children,

package/dist/es2019/experiences/ExperienceCheckPopupMutation.js

@@ -11,30 +11,25 @@ import { popupWithNestedElement } from './experience-utils';
  */
 
 export class ExperienceCheckPopupMutation {
-  constructor({
-    getEditorDom,
-    getTarget,
-    nestedElementQuery,
-    type = 'editorRoot'
-  }) {
+  constructor(config) {
     _defineProperty(this, "observers", []);
-    this.getEditorDom = getEditorDom;
-    this.getTarget = getTarget;
-    this.nestedElementQuery = nestedElementQuery;
-    this.type = type;
+    this.config = config;
   }
 
   /**
    * Returns the list of DOM elements to observe based on popup type.
    */
   getObserveTargets() {
-    switch (this.type) {
+    const {
+      config
+    } = this;
+    switch (config.type) {
       case 'inline':
-        return this.getInlineTargets();
+        return this.getInlineTargets(config);
       case 'editorRoot':
-        return this.getEditorRootTargets();
+        return this.getEditorRootTargets(config);
       case 'editorContent':
-        return this.getEditorContentTargets();
+        return this.getEditorContentTargets(config);
     }
   }
 
@@ -43,8 +38,8 @@ export class ExperienceCheckPopupMutation {
    * [data-editor-popup] wrappers within it. Content-level popups and modals
    * appear in portal containers.
    */
-  getEditorContentTargets() {
-    const target = this.getTarget();
+  getEditorContentTargets(config) {
+    const target = config.getTarget();
     if (!target) {
       return [];
     }
@@ -61,8 +56,8 @@ export class ExperienceCheckPopupMutation {
    * The caller is responsible for resolving the correct container
    * (e.g. the toolbar button-group) via the getTarget function.
    */
-  getInlineTargets() {
-    const target = this.getTarget();
+  getInlineTargets(config) {
+    const target = config.getTarget();
     if (!target) {
       return [];
     }
@@ -74,24 +69,19 @@ export class ExperienceCheckPopupMutation {
    * The editorDom is the ProseMirror element, but popups appear as direct children
    * of the parent .akEditor container. So we observe the parent of editorDom.
    */
-  getEditorRootTargets() {
+  getEditorRootTargets(config) {
     const targets = [];
-    const editorDom = this.getEditorDom();
+    const editorDom = config.getEditorDom();
     if (editorDom) {
       const editorRoot = editorDom.closest('.akEditor') || editorDom.parentElement;
       if (editorRoot instanceof HTMLElement) {
         targets.push(editorRoot);
-        const wrappers = editorRoot.querySelectorAll('[data-editor-popup]');
-        for (const wrapper of wrappers) {
-          targets.push(wrapper);
-        }
       }
     }
     return targets;
   }
   start(callback) {
-    this.stop();
-    const target = this.getTarget();
+    const target = this.config.type === 'editorRoot' ? this.config.getEditorDom() : this.config.getTarget();
     const doc = getDocument();
     if (!target || !doc) {
       callback({
@@ -101,31 +91,26 @@ export class ExperienceCheckPopupMutation {
       return;
     }
     const observeTargets = this.getObserveTargets();
-    const query = this.nestedElementQuery;
+    const query = this.config.nestedElementQuery;
+    const subtree = this.config.type === 'inline' && this.config.subtree === true;
     const observe = el => {
       const observer = new MutationObserver(onMutation);
       observer.observe(el, {
-        childList: true
+        childList: true,
+        subtree
       });
       this.observers.push(observer);
     };
     const onMutation = mutations => {
-      for (const mutation of mutations) {
-        if (mutation.type !== 'childList') {
-          continue;
-        }
-        for (const node of mutation.addedNodes) {
-          if (!(node instanceof HTMLElement)) {
-            continue;
-          }
-          const found = popupWithNestedElement(node, query) || node.matches(query) || !!node.querySelector(query);
-          if (found) {
-            callback({
-              status: 'success'
-            });
-            return;
-          }
-        }
+      const found = mutations.some(({
+        type,
+        addedNodes
+      }) => type === 'childList' && [...addedNodes].some(node => node instanceof HTMLElement && (popupWithNestedElement(node, query) || node.matches(query) || node.querySelector(query) !== null)));
+      if (found) {
+        callback({
+          status: 'success'
+        });
+        return;
       }
     };
     for (const observeTarget of observeTargets) {

package/dist/es2019/monitoring/error.js

@@ -4,7 +4,7 @@ import { isFedRamp } from './environment';
 import { normaliseSentryBreadcrumbs, SERIALIZABLE_ATTRIBUTES } from './normalise-sentry-breadcrumbs';
 const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-const packageVersion = "111.20.3";
+const packageVersion = "0.0.0-development";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/es2019/ui/DropList/index.js

@@ -14,7 +14,7 @@ import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
 import { fg } from '@atlaskit/platform-feature-flags';
 import Layer from '../Layer';
 const packageName = "@atlaskit/editor-common";
-const packageVersion = "111.20.3";
+const packageVersion = "0.0.0-development";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 const fadeIn = keyframes({

package/dist/es2019/ui/MediaSingle/styled.js

@@ -8,6 +8,7 @@ import React from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { akEditorDefaultLayoutWidth, akEditorFullPageMaxWidth, akEditorFullWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { nonWrappedLayouts } from '../../utils';
 import { calcBreakoutWidth, calcWideWidth } from '../../utils/breakout';
@@ -320,6 +321,7 @@ export const mediaWrapperStyle = props => css`
 	/* Renderer */
 	[data-node-type='media'] {
 		position: static !important;
+		${fg('platform_forge_ui_support_images_in_adfrenderer') ? 'height: auto !important;' : ''}
 
 		> div {
 			position: absolute;

package/dist/esm/experiences/ExperienceCheckPopupMutation.js

@@ -1,3 +1,4 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
@@ -16,18 +17,10 @@ import { popupWithNestedElement } from './experience-utils';
  */
 
 export var ExperienceCheckPopupMutation = /*#__PURE__*/function () {
-  function ExperienceCheckPopupMutation(_ref) {
-    var getEditorDom = _ref.getEditorDom,
-      getTarget = _ref.getTarget,
-      nestedElementQuery = _ref.nestedElementQuery,
-      _ref$type = _ref.type,
-      type = _ref$type === void 0 ? 'editorRoot' : _ref$type;
+  function ExperienceCheckPopupMutation(config) {
     _classCallCheck(this, ExperienceCheckPopupMutation);
     _defineProperty(this, "observers", []);
-    this.getEditorDom = getEditorDom;
-    this.getTarget = getTarget;
-    this.nestedElementQuery = nestedElementQuery;
-    this.type = type;
+    this.config = config;
   }
 
   /**
@@ -36,13 +29,14 @@ export var ExperienceCheckPopupMutation = /*#__PURE__*/function () {
   return _createClass(ExperienceCheckPopupMutation, [{
     key: "getObserveTargets",
     value: function getObserveTargets() {
-      switch (this.type) {
+      var config = this.config;
+      switch (config.type) {
         case 'inline':
-          return this.getInlineTargets();
+          return this.getInlineTargets(config);
         case 'editorRoot':
-          return this.getEditorRootTargets();
+          return this.getEditorRootTargets(config);
         case 'editorContent':
-          return this.getEditorContentTargets();
+          return this.getEditorContentTargets(config);
       }
     }
 
@@ -53,8 +47,8 @@ export var ExperienceCheckPopupMutation = /*#__PURE__*/function () {
      */
   }, {
     key: "getEditorContentTargets",
-    value: function getEditorContentTargets() {
-      var target = this.getTarget();
+    value: function getEditorContentTargets(config) {
+      var target = config.getTarget();
       if (!target) {
         return [];
       }
@@ -82,8 +76,8 @@ export var ExperienceCheckPopupMutation = /*#__PURE__*/function () {
      */
   }, {
     key: "getInlineTargets",
-    value: function getInlineTargets() {
-      var target = this.getTarget();
+    value: function getInlineTargets(config) {
+      var target = config.getTarget();
       if (!target) {
         return [];
       }
@@ -97,26 +91,13 @@ export var ExperienceCheckPopupMutation = /*#__PURE__*/function () {
      */
   }, {
     key: "getEditorRootTargets",
-    value: function getEditorRootTargets() {
+    value: function getEditorRootTargets(config) {
       var targets = [];
-      var editorDom = this.getEditorDom();
+      var editorDom = config.getEditorDom();
       if (editorDom) {
         var editorRoot = editorDom.closest('.akEditor') || editorDom.parentElement;
         if (editorRoot instanceof HTMLElement) {
           targets.push(editorRoot);
-          var wrappers = editorRoot.querySelectorAll('[data-editor-popup]');
-          var _iterator2 = _createForOfIteratorHelper(wrappers),
-            _step2;
-          try {
-            for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-              var wrapper = _step2.value;
-              targets.push(wrapper);
-            }
-          } catch (err) {
-            _iterator2.e(err);
-          } finally {
-            _iterator2.f();
-          }
         }
       }
       return targets;
@@ -125,8 +106,7 @@ export var ExperienceCheckPopupMutation = /*#__PURE__*/function () {
     key: "start",
     value: function start(callback) {
       var _this = this;
-      this.stop();
-      var target = this.getTarget();
+      var target = this.config.type === 'editorRoot' ? this.config.getEditorDom() : this.config.getTarget();
       var doc = getDocument();
       if (!target || !doc) {
         callback({
@@ -136,78 +116,58 @@ export var ExperienceCheckPopupMutation = /*#__PURE__*/function () {
         return;
       }
       var observeTargets = this.getObserveTargets();
-      var query = this.nestedElementQuery;
+      var query = this.config.nestedElementQuery;
+      var subtree = this.config.type === 'inline' && this.config.subtree === true;
       var observe = function observe(el) {
         var observer = new MutationObserver(onMutation);
         observer.observe(el, {
-          childList: true
+          childList: true,
+          subtree: subtree
         });
         _this.observers.push(observer);
       };
       var onMutation = function onMutation(mutations) {
-        var _iterator3 = _createForOfIteratorHelper(mutations),
-          _step3;
-        try {
-          for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
-            var mutation = _step3.value;
-            if (mutation.type !== 'childList') {
-              continue;
-            }
-            var _iterator4 = _createForOfIteratorHelper(mutation.addedNodes),
-              _step4;
-            try {
-              for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
-                var node = _step4.value;
-                if (!(node instanceof HTMLElement)) {
-                  continue;
-                }
-                var found = popupWithNestedElement(node, query) || node.matches(query) || !!node.querySelector(query);
-                if (found) {
-                  callback({
-                    status: 'success'
-                  });
-                  return;
-                }
-              }
-            } catch (err) {
-              _iterator4.e(err);
-            } finally {
-              _iterator4.f();
-            }
-          }
-        } catch (err) {
-          _iterator3.e(err);
-        } finally {
-          _iterator3.f();
+        var found = mutations.some(function (_ref) {
+          var type = _ref.type,
+            addedNodes = _ref.addedNodes;
+          return type === 'childList' && _toConsumableArray(addedNodes).some(function (node) {
+            return node instanceof HTMLElement && (popupWithNestedElement(node, query) || node.matches(query) || node.querySelector(query) !== null);
+          });
+        });
+        if (found) {
+          callback({
+            status: 'success'
+          });
+          return;
         }
       };
-      var _iterator5 = _createForOfIteratorHelper(observeTargets),
-        _step5;
+      var _iterator2 = _createForOfIteratorHelper(observeTargets),
+        _step2;
       try {
-        for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
-          var observeTarget = _step5.value;
+        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+          var observeTarget = _step2.value;
           observe(observeTarget);
         }
       } catch (err) {
-        _iterator5.e(err);
+        _iterator2.e(err);
       } finally {
-        _iterator5.f();
+        _iterator2.f();
       }
     }
   }, {
     key: "stop",
     value: function stop() {
-      var _iterator6 = _createForOfIteratorHelper(this.observers),
-        _step6;
+      var _iterator3 = _createForOfIteratorHelper(this.observers),
+        _step3;
       try {
-        for (_iterator6.s(); !(_step6 = _iterator6.n()).done;) {
-          var observer = _step6.value;
+        for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+          var observer = _step3.value;
           observer.disconnect();
         }
       } catch (err) {
-        _iterator6.e(err);
+        _iterator3.e(err);
       } finally {
-        _iterator6.f();
+        _iterator3.f();
       }
       this.observers = [];
     }

package/dist/esm/monitoring/error.js

@@ -10,7 +10,7 @@ import { isFedRamp } from './environment';
 import { normaliseSentryBreadcrumbs, SERIALIZABLE_ATTRIBUTES } from './normalise-sentry-breadcrumbs';
 var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
 var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
-var packageVersion = "111.20.3";
+var packageVersion = "0.0.0-development";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/esm/ui/DropList/index.js

@@ -21,7 +21,7 @@ import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
 import { fg } from '@atlaskit/platform-feature-flags';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "111.20.3";
+var packageVersion = "0.0.0-development";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var fadeIn = keyframes({

package/dist/esm/ui/MediaSingle/styled.js

@@ -12,6 +12,7 @@ import React from 'react';
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
 import { akEditorDefaultLayoutWidth, akEditorFullPageMaxWidth, akEditorFullWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { nonWrappedLayouts } from '../../utils';
 import { calcBreakoutWidth, calcWideWidth } from '../../utils/breakout';
@@ -248,7 +249,7 @@ var RenderFallbackContainer = function RenderFallbackContainer(_ref2) {
 
 // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression -- Needs manual remediation
 export var mediaWrapperStyle = function mediaWrapperStyle(props) {
-  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n\tposition: relative;\n\n\t", "\n\n\t/* Editor */\n  & > figure {\n\t\tposition: ", ";\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\n\t/* Comments on media project adds comment badge as child of the media wrapper,\n\tthus we need to exclude it so that style is applied to intended div */\n\t& > div:not([data-media-badges='true']) {\n\t\tposition: ", ";\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\n\t& * [data-mark-annotation-type='inlineComment'] {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t}\n\n\t&[data-node-type='embedCard'] > div {\n\t\twidth: 100%;\n\t}\n\n\t/* Renderer */\n\t[data-node-type='media'] {\n\t\tposition: static !important;\n\n\t\t> div {\n\t\t\tposition: absolute;\n\t\t\theight: 100%;\n\t\t}\n\t}\n"])), RenderFallbackContainer(props), props.hasFallbackContainer ? 'absolute' : 'relative', props.hasFallbackContainer ? 'absolute' : 'relative');
+  return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n\tposition: relative;\n\n\t", "\n\n\t/* Editor */\n  & > figure {\n\t\tposition: ", ";\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\n\t/* Comments on media project adds comment badge as child of the media wrapper,\n\tthus we need to exclude it so that style is applied to intended div */\n\t& > div:not([data-media-badges='true']) {\n\t\tposition: ", ";\n\t\theight: 100%;\n\t\twidth: 100%;\n\t}\n\n\t& * [data-mark-annotation-type='inlineComment'] {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t}\n\n\t&[data-node-type='embedCard'] > div {\n\t\twidth: 100%;\n\t}\n\n\t/* Renderer */\n\t[data-node-type='media'] {\n\t\tposition: static !important;\n\t\t", "\n\n\t\t> div {\n\t\t\tposition: absolute;\n\t\t\theight: 100%;\n\t\t}\n\t}\n"])), RenderFallbackContainer(props), props.hasFallbackContainer ? 'absolute' : 'relative', props.hasFallbackContainer ? 'absolute' : 'relative', fg('platform_forge_ui_support_images_in_adfrenderer') ? 'height: auto !important;' : '');
 };
 export var MediaWrapper = function MediaWrapper(_ref3) {
   var children = _ref3.children,

package/dist/types/experiences/ExperienceCheckPopupMutation.d.ts

@@ -6,19 +6,32 @@ import type { ExperienceCheck, ExperienceCheckCallback } from './ExperienceCheck
  * - 'editorContent': Content-level popups or modals in portal containers (e.g., block menu)
  */
 export type PopupCheckType = 'inline' | 'editorRoot' | 'editorContent';
-export type ExperienceCheckPopupMutationConfig = {
+type InlineConfig = {
+    getTarget: () => HTMLElement | undefined | null;
+    nestedElementQuery: string;
+    /**
+     * Observe the entire subtree for mutations, not just direct children.
+     * Use with caution — only enable when the observed DOM subtree is small/lightweight
+     * (e.g. a single toolbar button). Enabling on large subtrees can cause performance issues.
+     */
+    subtree?: boolean;
+    type: 'inline';
+};
+type EditorRootConfig = {
     getEditorDom: () => HTMLElement | undefined | null;
+    nestedElementQuery: string;
+    type: 'editorRoot';
+};
+type EditorContentConfig = {
     getTarget: () => HTMLElement | undefined | null;
     nestedElementQuery: string;
-    type?: PopupCheckType;
+    type: 'editorContent';
 };
+export type ExperienceCheckPopupMutationConfig = InlineConfig | EditorRootConfig | EditorContentConfig;
 export declare class ExperienceCheckPopupMutation implements ExperienceCheck {
-    private getEditorDom;
-    private getTarget;
-    private nestedElementQuery;
+    private config;
     private observers;
-    private type;
-    constructor({ getEditorDom, getTarget, nestedElementQuery, type, }: ExperienceCheckPopupMutationConfig);
+    constructor(config: ExperienceCheckPopupMutationConfig);
     /**
      * Returns the list of DOM elements to observe based on popup type.
      */
@@ -44,3 +57,4 @@ export declare class ExperienceCheckPopupMutation implements ExperienceCheck {
     start(callback: ExperienceCheckCallback): void;
     stop(): void;
 }
+export {};

package/dist/types-ts4.5/experiences/ExperienceCheckPopupMutation.d.ts

@@ -6,19 +6,32 @@ import type { ExperienceCheck, ExperienceCheckCallback } from './ExperienceCheck
  * - 'editorContent': Content-level popups or modals in portal containers (e.g., block menu)
  */
 export type PopupCheckType = 'inline' | 'editorRoot' | 'editorContent';
-export type ExperienceCheckPopupMutationConfig = {
+type InlineConfig = {
+    getTarget: () => HTMLElement | undefined | null;
+    nestedElementQuery: string;
+    /**
+     * Observe the entire subtree for mutations, not just direct children.
+     * Use with caution — only enable when the observed DOM subtree is small/lightweight
+     * (e.g. a single toolbar button). Enabling on large subtrees can cause performance issues.
+     */
+    subtree?: boolean;
+    type: 'inline';
+};
+type EditorRootConfig = {
     getEditorDom: () => HTMLElement | undefined | null;
+    nestedElementQuery: string;
+    type: 'editorRoot';
+};
+type EditorContentConfig = {
     getTarget: () => HTMLElement | undefined | null;
     nestedElementQuery: string;
-    type?: PopupCheckType;
+    type: 'editorContent';
 };
+export type ExperienceCheckPopupMutationConfig = InlineConfig | EditorRootConfig | EditorContentConfig;
 export declare class ExperienceCheckPopupMutation implements ExperienceCheck {
-    private getEditorDom;
-    private getTarget;
-    private nestedElementQuery;
+    private config;
     private observers;
-    private type;
-    constructor({ getEditorDom, getTarget, nestedElementQuery, type, }: ExperienceCheckPopupMutationConfig);
+    constructor(config: ExperienceCheckPopupMutationConfig);
     /**
      * Returns the list of DOM elements to observe based on popup type.
      */
@@ -44,3 +57,4 @@ export declare class ExperienceCheckPopupMutation implements ExperienceCheck {
     start(callback: ExperienceCheckCallback): void;
     stop(): void;
 }
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "111.20.4",
+	"version": "111.20.6",
 	"description": "A package that contains common classes and components for editor and renderer",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -30,7 +30,7 @@
 	},
 	"dependencies": {
 		"@atlaskit/activity-provider": "^2.5.0",
-		"@atlaskit/adf-schema": "^51.5.0",
+		"@atlaskit/adf-schema": "^52.0.0",
 		"@atlaskit/adf-utils": "^19.27.0",
 		"@atlaskit/afm-i18n-platform-editor-editor-common": "2.18.0",
 		"@atlaskit/analytics-listeners": "^10.0.0",
@@ -42,7 +42,7 @@
 		"@atlaskit/codemod-utils": "^4.2.0",
 		"@atlaskit/css": "^0.19.0",
 		"@atlaskit/custom-steps": "^0.16.0",
-		"@atlaskit/dropdown-menu": "^16.4.0",
+		"@atlaskit/dropdown-menu": "^16.5.0",
 		"@atlaskit/editor-json-transformer": "^8.31.0",
 		"@atlaskit/editor-palette": "^2.1.0",
 		"@atlaskit/editor-prosemirror": "^7.3.0",
@@ -73,7 +73,7 @@
 		"@atlaskit/primitives": "^18.0.0",
 		"@atlaskit/profilecard": "^24.37.0",
 		"@atlaskit/prosemirror-history": "^0.2.0",
-		"@atlaskit/react-ufo": "^5.3.0",
+		"@atlaskit/react-ufo": "^5.4.0",
 		"@atlaskit/section-message": "^8.12.0",
 		"@atlaskit/smart-card": "^43.25.0",
 		"@atlaskit/smart-user-picker": "^9.0.0",
@@ -82,7 +82,7 @@
 		"@atlaskit/task-decision": "^19.2.0",
 		"@atlaskit/textfield": "^8.2.0",
 		"@atlaskit/theme": "^21.0.0",
-		"@atlaskit/tmp-editor-statsig": "^31.0.0",
+		"@atlaskit/tmp-editor-statsig": "^31.3.0",
 		"@atlaskit/tokens": "^11.0.0",
 		"@atlaskit/tooltip": "^20.14.0",
 		"@atlaskit/width-detector": "^5.0.0",
@@ -268,6 +268,9 @@
 		"platform_editor_native_anchor_patch_2": {
 			"type": "boolean"
 		},
+		"platform_forge_ui_support_images_in_adfrenderer": {
+			"type": "boolean"
+		},
 		"platform_editor_toolbar_aifc_placement_overridden": {
 			"type": "boolean"
 		}