@atlaskit/editor-common 128.3.1 → 128.4.0

package/dist/es2019/ui-menu/DropdownMenu/index.js

@@ -16,7 +16,6 @@ import MenuGroup from '@atlaskit/menu/menu-group';
 import Section from '@atlaskit/menu/section';
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import Tooltip from '@atlaskit/tooltip/Tooltip';
 import { DropdownMenuSharedCssClassName } from '../../styles';
 import { KeyDownHandlerContext } from '../../ui-menu/ToolbarArrowKeyNavigationProvider';
@@ -377,16 +376,16 @@ export function DropdownMenuItem({
   const tabIndex = item.wrapperTabIndex === null ? undefined : item.wrapperTabIndex || -1;
   const dropListItem = jsx("div", {
     css: () => buttonStyles(item.isActive, submenuActive),
-    role: expValEquals('platform_editor_august_a11y', 'isEnabled', true) ? shouldUseDefaultRole ? undefined : 'menuitem' : undefined,
+    role: shouldUseDefaultRole ? undefined : 'menuitem',
     tabIndex: tabIndex,
     "aria-disabled": item.isDisabled ? 'true' : 'false',
-    "aria-expanded": expValEquals('platform_editor_august_a11y', 'isEnabled', true) ? item['aria-expanded'] : undefined,
+    "aria-expanded": item['aria-expanded'],
     onMouseDown: _handleSubmenuActive
   }, jsx(CustomItem, {
     item: item,
     key: (_item$key2 = item.key) !== null && _item$key2 !== void 0 ? _item$key2 : String(item.content),
     testId: testId,
-    role: shouldUseDefaultRole ? 'button' : expValEquals('platform_editor_august_a11y', 'isEnabled', true) ? undefined : 'menuitem',
+    role: shouldUseDefaultRole ? 'button' : undefined,
     iconBefore: item.elemBefore,
     iconAfter: item.elemAfter,
     isDisabled: item.isDisabled,
@@ -397,8 +396,7 @@ export function DropdownMenuItem({
     onMouseDown: onMouseDown,
     component: DropdownMenuItemCustomComponent,
     onMouseEnter: onMouseEnterHandler,
-    onMouseLeave: onMouseLeaveHandler,
-    "aria-expanded": expValEquals('platform_editor_august_a11y', 'isEnabled', true) ? undefined : item['aria-expanded']
+    onMouseLeave: onMouseLeaveHandler
   }, item.content));
   if (item.tooltipDescription) {
     var _item$key3;

package/dist/es2019/utils/index.js

@@ -86,9 +86,6 @@ getDistortedDurationMonitor,
  */
 measureRender } from './performance/measure-render';
 export { startMeasure, stopMeasure, clearMeasure } from './performance/measure';
-export { TTI_FROM_INVOCATION_SEVERITY_THRESHOLD_DEFAULTS } from './performance/TTI_FROM_INVOCATION_SEVERITY_THRESHOLD_DEFAULTS';
-export { TTI_SEVERITY_THRESHOLD_DEFAULTS } from './performance/TTI_SEVERITY_THRESHOLD_DEFAULTS';
-export { measureTTI, getTTISeverity } from './performance/measure-tti';
 /**
  * @private
  * @deprecated
@@ -121,8 +118,6 @@ export { isTextInput } from './is-text-input';
 export { ZERO_WIDTH_SPACE, ZERO_WIDTH_JOINER } from '../whitespace';
 export { shouldForceTracking } from './should-force-tracking';
 export { getModeFromTheme } from './getModeFromTheme';
-export { getPerformanceOptions, stopMeasureReactNodeViewRendered } from './get-performance-options';
-export { startMeasureReactNodeViewRendered } from './startMeasureReactNodeViewRendered';
 export { sniffUserBrowserExtensions } from './browser-extensions';
 export { RenderCountProfiler, PROFILER_KEY } from './profiler/render-count';
 export { validateADFEntity, validationErrorHandler } from './validate-using-spec';

package/dist/esm/analytics/types/enums.js

@@ -50,14 +50,12 @@ export var ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["DISPLAYED"] = "displayed";
   ACTION["DIVERGED"] = "diverged";
   ACTION["DISPATCHED_INVALID_TRANSACTION"] = "dispatchedInvalidTransaction";
-  ACTION["DISPATCHED_VALID_TRANSACTION"] = "dispatchedValidTransaction";
   ACTION["DOUBLE_CLICKED"] = "doubleClicked";
   ACTION["DRAGGED"] = "dragged";
   ACTION["EDITED"] = "edited";
   ACTION["EDITOR_CRASHED"] = "unhandledErrorCaught";
   ACTION["EDITOR_CRASHED_ADDITIONAL_INFORMATION"] = "unhandledErrorCaughtAdditionalInfov2";
   ACTION["EDITOR_MOUNTED"] = "mounted";
-  ACTION["EDITOR_CONTENT_RETRIEVAL_PERFORMED"] = "contentRetrievalPerformed";
   ACTION["RE_RENDERED"] = "reRendered";
   ACTION["ENDED"] = "ended";
   ACTION["ENTERED"] = "entered";
@@ -116,7 +114,6 @@ export var ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["PRESSED"] = "pressed";
   ACTION["QUICK_INSERT_INFORMATION"] = "quickInsertInformation";
   ACTION["PROSEMIRROR_RENDERED"] = "proseMirrorRendered";
-  ACTION["REACT_NODEVIEW_RENDERED"] = "reactNodeViewRendered";
   ACTION["REFERENCE_SYNCED_BLOCK_DELETE"] = "referenceSyncedBlockDelete";
   ACTION["REFERENCE_SYNCED_BLOCK_UPDATE"] = "referenceSyncedBlockUpdate";
   ACTION["REFERENCE_SYNCED_BLOCK_UNSYNC"] = "referenceSyncedBlockUnsync";
@@ -172,18 +169,9 @@ export var ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["UPLOAD_EXTERNAL_FAIL"] = "uploadExternalFailed";
   ACTION["VIEWED"] = "viewed";
   ACTION["VISITED"] = "visited";
-  ACTION["WITH_PLUGIN_STATE_CALLED"] = "withPluginStateCalled";
   ACTION["RENDERED"] = "rendered";
-  ACTION["RENDERED_SAMPLED"] = "renderedSampled";
   ACTION["REASONING_VIEWED"] = "reasoningViewed";
   ACTION["ON_EDITOR_READY_CALLBACK"] = "onEditorReadyCallback";
-  /**
-   * @private
-   * @deprecated
-   *
-   * This is no longer used and can be removed at a later date
-   */
-  ACTION["ON_CHANGE_CALLBACK"] = "onChangeCalled";
   ACTION["NESTED_TABLE_TRANSFORMED"] = "nestedTableTransformed";
   ACTION["CONTAINER_NODE_TRANSFORMED"] = "containerNodeTransformed";
   ACTION["NATIVE_EMBEDS_TRANSFORMED"] = "nativeEmbedsTransformed";

package/dist/esm/block-node-badges.js

@@ -0,0 +1,88 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import React, { useEffect, useState } from 'react';
+import debounce from 'lodash/debounce';
+import { fg } from '@atlaskit/platform-feature-flags/fg';
+// eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
+import { Box, xcss } from '@atlaskit/primitives';
+var BADGE_VISIBILITY_BREAKPOINT = 200;
+var containerStyles = xcss({
+  display: 'flex',
+  position: 'absolute',
+  top: 'space.0',
+  right: 'space.0',
+  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
+  lineHeight: "var(--ds-space-200, 16px)",
+  gap: 'space.025',
+  zIndex: 'card',
+  height: 'fit-content',
+  width: 'fit-content',
+  margin: 'space.075'
+});
+
+// The above styles are used for both editor and renderer, and in renderer the
+// document body is the main scroll area. This means it overscrolls the primary
+// toolbar, where the z-index is "2". We have to hack in our own z-index less
+// than that to ensure our badge appears under the toolbar when scrolled.
+var hackedZIndexStyles = xcss({
+  zIndex: '1'
+});
+var resizeOffsetStyles = xcss({
+  right: 'space.150'
+});
+var getBadgeVisible = function getBadgeVisible(width, height) {
+  return width && width < BADGE_VISIBILITY_BREAKPOINT || height && height < BADGE_VISIBILITY_BREAKPOINT ? false : true;
+};
+export var BlockNodeBadges = function BlockNodeBadges(_ref) {
+  var children = _ref.children,
+    element = _ref.element,
+    width = _ref.width,
+    height = _ref.height,
+    extendedResizeOffset = _ref.extendedResizeOffset,
+    _ref$useMinimumZIndex = _ref.useMinimumZIndex,
+    useMinimumZIndex = _ref$useMinimumZIndex === void 0 ? false : _ref$useMinimumZIndex;
+  var _useState = useState(getBadgeVisible(width, height)),
+    _useState2 = _slicedToArray(_useState, 2),
+    visible = _useState2[0],
+    setVisible = _useState2[1];
+  useEffect(function () {
+    var observer = new ResizeObserver(debounce(function (entries) {
+      var _entries = _slicedToArray(entries, 1),
+        entry = _entries[0];
+      var _entry$contentRect = entry.contentRect,
+        width = _entry$contentRect.width,
+        height = _entry$contentRect.height;
+      setVisible(getBadgeVisible(width, height));
+    }));
+    if (element) {
+      // Ignored via go/ees005
+      // eslint-disable-next-line @atlaskit/editor/no-as-casting
+      observer.observe(element);
+    }
+    return function () {
+      observer.disconnect();
+    };
+  }, [element]);
+  if (typeof children === 'function') {
+    children = children({
+      visible: visible
+    });
+  }
+
+  // delete this block on cleanup of media-perf-uplift-mutation-fix
+  if (!fg('media-perf-uplift-mutation-fix')) {
+    // becuase it is wrapped in a fragment, React.Children.count(children) will always be 1.
+    // That makes this check a source of late mutations that we don't need.
+    if (!element || React.Children.count(children) === 0) {
+      return null;
+    }
+  }
+  return /*#__PURE__*/React.createElement(Box, {
+    as: "div",
+    testId: "media-badges",
+    "data-media-badges": "true",
+    contentEditable: false
+    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
+    ,
+    xcss: [containerStyles, useMinimumZIndex && hackedZIndexStyles, extendedResizeOffset && resizeOffsetStyles]
+  }, children);
+};

package/dist/esm/element-browser/components/ElementList/ElementList.js

@@ -233,7 +233,7 @@ var ElementListSingleColumn = function ElementListSingleColumn(props) {
         focus: focusedItemIndex === index,
         setFocusedItemIndex: setFocusedItemIndex,
         onInsertItem: onInsertItem,
-        role: expValEquals('platform_editor_august_a11y', 'isEnabled', true) ? 'option' : undefined
+        role: "option"
       })));
     };
   },
@@ -417,8 +417,7 @@ export function ElementItem(_ref6) {
       title: title
     }),
     isSelected: selected,
-    "aria-describedby": expValEquals('platform_editor_august_a11y', 'isEnabled', true) ? undefined : title,
-    "aria-label": expValEquals('platform_editor_august_a11y', 'isEnabled', true) ? title : undefined,
+    "aria-label": title,
     ref: ref,
     testId: "element-item-".concat(index),
     id: "searched-item-".concat(index),

package/dist/esm/element-browser/components/StatelessElementBrowser.js

@@ -341,7 +341,7 @@ function MobileBrowser(_ref) {
     searchTerm: searchTerm,
     items: items,
     selectedItemIndex: selectedItemIndex,
-    ariaControlsId: expValEquals('platform_editor_august_a11y', 'isEnabled', true) ? ELEMENT_BROWSER_LIST_ID : undefined
+    ariaControlsId: ELEMENT_BROWSER_LIST_ID
   }), showCategories && jsx("nav", {
     css: mobileCategoryListWrapper,
     tabIndex: -1
@@ -355,7 +355,7 @@ function MobileBrowser(_ref) {
     setFocusOnSearch: setFocusOnSearch
   }))), jsx("div", {
     css: mobileMainContent,
-    id: expValEquals('platform_editor_august_a11y', 'isEnabled', true) ? ELEMENT_BROWSER_LIST_ID : undefined
+    id: ELEMENT_BROWSER_LIST_ID
   }, jsx(ElementList, {
     items: items,
     mode: mode,

package/dist/esm/extensibility/Extension/Extension/index.js

@@ -1,6 +1,7 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 var _excluded = ["type"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -9,7 +10,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
  * @jsx jsx
  */
 
-import React, { Fragment } from 'react';
+import React, { Fragment, useCallback, useState } from 'react';
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
 import { css, jsx } from '@emotion/react';
@@ -22,6 +23,7 @@ import { NodeViewContentHole } from '../../../react-node-view/NodeViewContentHol
 import { overflowShadow } from '../../../ui';
 import { calculateBreakoutStyles } from '../../../utils';
 import { shouldExtensionBreakout } from '../../utils/should-extension-breakout';
+import { ExtensionCommentBadge } from '../ExtensionCommentBadge';
 import ExtensionLozenge from '../Lozenge';
 import { overlay } from '../styles';
 import { isEmptyBodiedMacro } from './extension-utils';
@@ -55,6 +57,16 @@ function ExtensionWithPluginState(props) {
     pluginInjectionApi = props.pluginInjectionApi,
     isLivePageViewMode = props.isLivePageViewMode,
     hideConfigureLabel = props.hideConfigureLabel;
+  var _useState = useState(null),
+    _useState2 = _slicedToArray(_useState, 2),
+    container = _useState2[0],
+    setContainer = _useState2[1];
+  var handleContainerRef = useCallback(function (element) {
+    handleRef === null || handleRef === void 0 || handleRef(element);
+    if (fg('cc_maui_annotations_on_extensions')) {
+      setContainer(element);
+    }
+  }, [handleRef]);
   var _ref = macroInteractionDesignFeatureFlags || {},
     showMacroInteractionDesignUpdates = _ref.showMacroInteractionDesignUpdates;
   var isLegacyContentMacroExtension = function isLegacyContentMacroExtension(extensionNode) {
@@ -149,7 +161,7 @@ function ExtensionWithPluginState(props) {
     hideConfigureLabel: hideConfigureLabel
   }), jsx("div", {
     "data-testid": "extension-container",
-    ref: handleRef,
+    ref: handleContainerRef,
     "data-layout": node.attrs.layout
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     ,
@@ -213,7 +225,13 @@ function ExtensionWithPluginState(props) {
     className: contentClassNames
   }, jsx(NodeViewContentHole, {
     ref: handleContentDOMRef
-  }))))));
+  })))), fg('cc_maui_annotations_on_extensions') && node.type.name === 'extension' && container && (pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.annotation) && jsx(ExtensionCommentBadge, {
+    api: pluginInjectionApi,
+    node: node,
+    getPos: getPos,
+    editorView: view,
+    container: container
+  })));
 }
 var Extension = function Extension(props) {
   var pluginInjectionApi = props.pluginInjectionApi;

package/dist/esm/extensibility/Extension/ExtensionCommentBadge.js

@@ -0,0 +1,101 @@
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import React, { useCallback, useMemo } from 'react';
+import { VIEW_METHOD } from '../../analytics';
+import { BlockNodeBadges } from '../../block-node-badges';
+import { useSharedPluginStateWithSelector } from '../../hooks';
+import { CommentBadgeNext } from '../../media-single/CommentBadgeNext';
+// Owned by the extension node view, like media's badge. Annotation updates only
+// render this sibling of the extension content; they never reparent its iframe.
+export var ExtensionCommentBadge = function ExtensionCommentBadge(_ref) {
+  var _api$annotation4;
+  var api = _ref.api,
+    editorView = _ref.editorView,
+    node = _ref.node,
+    getPos = _ref.getPos,
+    container = _ref.container;
+  var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['annotation'], function (states) {
+      return {
+        annotationState: states.annotationState
+      };
+    }),
+    annotationState = _useSharedPluginState.annotationState;
+  var drafting = Boolean((annotationState === null || annotationState === void 0 ? void 0 : annotationState.isDrafting) && node.attrs.localId && node.attrs.localId === annotationState.targetNodeId);
+  var hasOpenDraft = Boolean(annotationState === null || annotationState === void 0 ? void 0 : annotationState.isDrafting);
+  var unresolvedIds = useMemo(function () {
+    return node.marks.filter(function (mark) {
+      return mark.type.name === 'annotation' && (annotationState === null || annotationState === void 0 ? void 0 : annotationState.annotations[mark.attrs.id]) === false;
+    }).map(function (mark) {
+      return mark.attrs.id;
+    });
+  }, [node.marks, annotationState === null || annotationState === void 0 ? void 0 : annotationState.annotations]);
+  var onClick = useCallback( /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(event) {
+      var _api$annotation, _api$annotation2;
+      var pos, currentNode, _api$annotation3, _t;
+      return _regeneratorRuntime.wrap(function (_context) {
+        while (1) switch (_context.prev = _context.next) {
+          case 0:
+            event.preventDefault();
+            event.stopPropagation();
+            if (!drafting) {
+              _context.next = 1;
+              break;
+            }
+            return _context.abrupt("return");
+          case 1:
+            _t = hasOpenDraft;
+            if (!_t) {
+              _context.next = 3;
+              break;
+            }
+            _context.next = 2;
+            return api === null || api === void 0 || (_api$annotation = api.annotation) === null || _api$annotation === void 0 ? void 0 : _api$annotation.actions.requestCloseInlineComment();
+          case 2:
+            _t = !_context.sent;
+          case 3:
+            if (!_t) {
+              _context.next = 4;
+              break;
+            }
+            return _context.abrupt("return");
+          case 4:
+            // Resolve the current position after the asynchronous discard confirmation.
+            pos = getPos();
+            if (!(typeof pos !== 'number' || !Number.isFinite(pos) || pos < 0 || pos >= editorView.state.doc.content.size)) {
+              _context.next = 5;
+              break;
+            }
+            return _context.abrupt("return");
+          case 5:
+            currentNode = editorView.state.doc.nodeAt(pos);
+            if ((currentNode === null || currentNode === void 0 ? void 0 : currentNode.type) === node.type && currentNode.attrs.localId === node.attrs.localId && api !== null && api !== void 0 && (_api$annotation2 = api.annotation) !== null && _api$annotation2 !== void 0 && _api$annotation2.actions.isBlockNodeSupported(currentNode)) {
+              api === null || api === void 0 || (_api$annotation3 = api.annotation) === null || _api$annotation3 === void 0 || _api$annotation3.actions.showCommentForBlockNode(currentNode, VIEW_METHOD.BADGE)(editorView.state, editorView.dispatch);
+            }
+          case 6:
+          case "end":
+            return _context.stop();
+        }
+      }, _callee);
+    }));
+    return function (_x) {
+      return _ref2.apply(this, arguments);
+    };
+  }(), [api, editorView, node, getPos, drafting, hasOpenDraft]);
+  if (!(annotationState !== null && annotationState !== void 0 && annotationState.isVisible) || node.type.name !== 'extension' || !(api !== null && api !== void 0 && (_api$annotation4 = api.annotation) !== null && _api$annotation4 !== void 0 && _api$annotation4.actions.isBlockNodeSupported(node))) {
+    return null;
+  }
+  if (!drafting && !unresolvedIds.length) {
+    return null;
+  }
+  var active = drafting || !annotationState.isInlineCommentViewClosed && annotationState.selectedAnnotations.some(function (_ref3) {
+    var id = _ref3.id;
+    return unresolvedIds.includes(id);
+  });
+  return /*#__PURE__*/React.createElement(BlockNodeBadges, {
+    element: container
+  }, /*#__PURE__*/React.createElement(CommentBadgeNext, {
+    onClick: onClick,
+    status: active ? 'active' : 'default'
+  }));
+};

package/dist/esm/extensibility/MultiBodiedExtension/index.js

@@ -19,7 +19,6 @@ import classnames from 'classnames';
 import { useIntl } from 'react-intl';
 import EditorFileIcon from '@atlaskit/icon/core/file';
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
-import { fg } from '@atlaskit/platform-feature-flags/fg';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { useSharedPluginStateWithSelector } from '../../hooks';
 import { placeholderTextMessages } from '../../messages/placeholder-text';
@@ -30,23 +29,7 @@ import { ExtensionFloatingLabel } from '../Extension/Lozenge/ExtensionFloatingLa
 import { shouldExtensionBreakout } from '../utils/should-extension-breakout';
 import { useMultiBodiedExtensionActions } from './action-api';
 import { mbeExtensionWrapperCSSStyles, mbeExtensionWrapperCSSStylesOld, overlayStyles, overlayStylesOld } from './styles';
-var getContainerCssExtendedStyles = function getContainerCssExtendedStyles(activeChildIndex, showMacroInteractionDesignUpdates) {
-  if (fg('platform_editor_nested_mbe_frames')) {
-    return sharedMultiBodiedExtensionStyles.mbeExtensionContainer;
-  }
-  var activeFrameSelector = ".multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(".concat(activeChildIndex + 1, ")");
-
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  return css(sharedMultiBodiedExtensionStyles.mbeExtensionContainer, _defineProperty({}, activeFrameSelector, css(
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  sharedMultiBodiedExtensionStyles.extensionFrameContent,
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-  showMacroInteractionDesignUpdates && removeMarginsAndBorder)));
-};
 var getFramesActiveFrameStyles = function getFramesActiveFrameStyles(activeChildIndex, showMacroInteractionDesignUpdates) {
-  if (!fg('platform_editor_nested_mbe_frames')) {
-    return undefined;
-  }
   var activeFrameSelector = "& > .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(".concat(activeChildIndex + 1, ")");
   return css(_defineProperty({}, activeFrameSelector, css(
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
@@ -353,10 +336,10 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref2
     "data-testid": "multiBodiedExtension--overlay"
   }), getWrapperTitleContent(imageData, title, showMacroInteractionDesignUpdates), jsx("div", {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    className: containerClassNames,
-    css: [/* eslint-disable @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766 */
-    getContainerCssExtendedStyles(activeChildIndex, showMacroInteractionDesignUpdates)
-    /* eslint-enable @atlaskit/design-system/consistent-css-prop-usage */],
+    className: containerClassNames
+    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+    ,
+    css: sharedMultiBodiedExtensionStyles.mbeExtensionContainer,
     "data-testid": "multiBodiedExtension--container",
     "data-multiBodiedExtension-container": true,
     "data-active-child-index": activeChildIndex

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

@@ -1,88 +1,18 @@
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import React, { useEffect, useState } from 'react';
-import debounce from 'lodash/debounce';
-import { fg } from '@atlaskit/platform-feature-flags/fg';
-// eslint-disable-next-line @atlaskit/design-system/no-emotion-primitives -- to be migrated to @atlaskit/primitives/compiled – go/akcss
-import { Box, xcss } from '@atlaskit/primitives';
-var MEDIA_BADGE_VISIBILITY_BREAKPOINT = 200;
-var containerStyles = xcss({
-  display: 'flex',
-  position: 'absolute',
-  top: 'space.0',
-  right: 'space.0',
-  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
-  lineHeight: "var(--ds-space-200, 16px)",
-  gap: 'space.025',
-  zIndex: 'card',
-  height: 'fit-content',
-  width: 'fit-content',
-  margin: 'space.075'
-});
-
-// The above styles are used for both editor and renderer, and in renderer the
-// document body is the main scroll area. This means it overscrolls the primary
-// toolbar, where the z-index is "2". We have to hack in our own z-index less
-// than that to ensure our badge appears under the toolbar when scrolled.
-var hackedZIndexStyles = xcss({
-  zIndex: '1'
-});
-var resizeOffsetStyles = xcss({
-  right: 'space.150'
-});
-var getBadgeVisible = function getBadgeVisible(width, height) {
-  return width && width < MEDIA_BADGE_VISIBILITY_BREAKPOINT || height && height < MEDIA_BADGE_VISIBILITY_BREAKPOINT ? false : true;
-};
+import React from 'react';
+import { BlockNodeBadges } from '../block-node-badges';
+/** Compatibility wrapper for existing media consumers of BlockNodeBadges. */
 export var MediaBadges = function MediaBadges(_ref) {
-  var children = _ref.children,
-    mediaElement = _ref.mediaElement,
+  var mediaElement = _ref.mediaElement,
     mediaWidth = _ref.mediaWidth,
     mediaHeight = _ref.mediaHeight,
+    children = _ref.children,
     extendedResizeOffset = _ref.extendedResizeOffset,
-    _ref$useMinimumZIndex = _ref.useMinimumZIndex,
-    useMinimumZIndex = _ref$useMinimumZIndex === void 0 ? false : _ref$useMinimumZIndex;
-  var _useState = useState(getBadgeVisible(mediaWidth, mediaHeight)),
-    _useState2 = _slicedToArray(_useState, 2),
-    visible = _useState2[0],
-    setVisible = _useState2[1];
-  useEffect(function () {
-    var observer = new ResizeObserver(debounce(function (entries) {
-      var _entries = _slicedToArray(entries, 1),
-        entry = _entries[0];
-      var _entry$contentRect = entry.contentRect,
-        width = _entry$contentRect.width,
-        height = _entry$contentRect.height;
-      setVisible(getBadgeVisible(width, height));
-    }));
-    if (mediaElement) {
-      // Ignored via go/ees005
-      // eslint-disable-next-line @atlaskit/editor/no-as-casting
-      observer.observe(mediaElement);
-    }
-    return function () {
-      observer.disconnect();
-    };
-  }, [mediaElement]);
-  if (typeof children === 'function') {
-    children = children({
-      visible: visible
-    });
-  }
-
-  // delete this block on cleanup of media-perf-uplift-mutation-fix
-  if (!fg('media-perf-uplift-mutation-fix')) {
-    // becuase it is wrapped in a fragment, React.Children.count(children) will always be 1.
-    // That makes this check a source of late mutations that we don't need.
-    if (!mediaElement || React.Children.count(children) === 0) {
-      return null;
-    }
-  }
-  return /*#__PURE__*/React.createElement(Box, {
-    as: "div",
-    testId: "media-badges",
-    "data-media-badges": "true",
-    contentEditable: false
-    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
-    ,
-    xcss: [containerStyles, useMinimumZIndex && hackedZIndexStyles, extendedResizeOffset && resizeOffsetStyles]
+    useMinimumZIndex = _ref.useMinimumZIndex;
+  return /*#__PURE__*/React.createElement(BlockNodeBadges, {
+    element: mediaElement,
+    width: mediaWidth,
+    height: mediaHeight,
+    extendedResizeOffset: extendedResizeOffset,
+    useMinimumZIndex: useMinimumZIndex
   }, children);
 };

package/dist/esm/monitoring/error.js

@@ -19,7 +19,7 @@ var NETWORK_FAILURE_REGEX = /^network failure/i;
 var RESIZE_OBSERVER_LOOP_REGEX = /ResizeObserver loop completed with undelivered notifications/;
 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 = "128.3.0";
+var packageVersion = "128.3.2";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/esm/react-node-view/getInlineNodeViewProducer.js

@@ -8,7 +8,7 @@ import { fg } from '@atlaskit/platform-feature-flags/fg';
 import { ACTION_SUBJECT, ACTION_SUBJECT_ID } from '../analytics';
 import { isSSR } from '../core-utils/is-ssr';
 import { ErrorBoundary } from '../ui/ErrorBoundary';
-import { analyticsEventKey, getPerformanceOptions, startMeasureReactNodeViewRendered, stopMeasureReactNodeViewRendered } from '../utils';
+import { analyticsEventKey } from '../utils';
 import { getBrowserInfo } from '../utils/browser';
 import { ZERO_WIDTH_SPACE } from '../whitespace';
 import { generateUniqueNodeKey } from './generateUniqueNodeKey';
@@ -73,22 +73,9 @@ function createNodeView(_ref) {
       extraComponentProps: extraComponentProps
     }), domRef, key);
   }
-  var _getPerformanceOption = getPerformanceOptions(nodeViewParams.view),
-    samplingRate = _getPerformanceOption.samplingRate,
-    slowThreshold = _getPerformanceOption.slowThreshold,
-    trackingEnabled = _getPerformanceOption.trackingEnabled;
-  trackingEnabled && startMeasureReactNodeViewRendered({
-    nodeTypeName: currentNode.type.name
-  });
 
   // We render the component while creating the node view
   renderComponent();
-  trackingEnabled && stopMeasureReactNodeViewRendered({
-    nodeTypeName: currentNode.type.name,
-    dispatchAnalyticsEvent: dispatchAnalyticsEvent,
-    samplingRate: samplingRate,
-    slowThreshold: slowThreshold
-  });
   var extraNodeViewPropsWithStopEvent = _objectSpread({}, extraNodeViewProps);
 
   // https://prosemirror.net/docs/ref/#view.NodeView

package/dist/esm/react-node-view/index.js

@@ -10,7 +10,6 @@ import { ACTION_SUBJECT, ACTION_SUBJECT_ID } from '../analytics';
 import { isSSR } from '../core-utils';
 import { createDispatch } from '../event-dispatcher';
 import { ErrorBoundary } from '../ui/ErrorBoundary';
-import { getPerformanceOptions, startMeasureReactNodeViewRendered, stopMeasureReactNodeViewRendered } from '../utils';
 import { analyticsEventKey } from '../utils/analytics';
 import { generateUniqueNodeKey } from './generateUniqueNodeKey';
 export { getInlineNodeViewProducer, inlineNodeViewClassname } from './getInlineNodeViewProducer';
@@ -88,13 +87,6 @@ var ReactNodeView = /*#__PURE__*/function () {
       // nodeView if DOM structure has nested plain "div"s, it doesn't see the
       // difference between them and it kills the nodeView
       this.domRef.classList.add("".concat(this.node.type.name, "View-content-wrap"));
-      var _getPerformanceOption = getPerformanceOptions(this.view),
-        samplingRate = _getPerformanceOption.samplingRate,
-        slowThreshold = _getPerformanceOption.slowThreshold,
-        trackingEnabled = _getPerformanceOption.trackingEnabled;
-      trackingEnabled && startMeasureReactNodeViewRendered({
-        nodeTypeName: this.node.type.name
-      });
       if (!shouldSkipInitRender) {
         this.renderReactComponent(function () {
           return _this2.render(_this2.reactComponentProps, _this2.handleRef);
@@ -115,12 +107,6 @@ var ReactNodeView = /*#__PURE__*/function () {
           }
         }
       }
-      trackingEnabled && stopMeasureReactNodeViewRendered({
-        nodeTypeName: this.node.type.name,
-        dispatchAnalyticsEvent: this.dispatchAnalyticsEvent,
-        samplingRate: samplingRate,
-        slowThreshold: slowThreshold
-      });
       return this;
     }
 

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/fg';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "128.3.0";
+var packageVersion = "128.3.2";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var fadeIn = keyframes({