@atlaskit/editor-common 111.7.2 → 111.7.4

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # @atlaskit/editor-common
 
+## 111.7.4
+
+### Patch Changes
+
+- [`db121516e200b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/db121516e200b) -
+  [ux] Update hub extention titles and radius slider style
+- [`ba05557f777bf`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ba05557f777bf) -
+  Add support to render selection toolbar in editors which have an ancestor elemenent which has
+  position fixed, most common use case is for the chromeless appearance when rendered inside modals,
+  popups etc.
+- Updated dependencies
+
+## 111.7.3
+
+### Patch Changes
+
+- [`38c83ce57623b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/38c83ce57623b) -
+  [ux] [EDITOR-3853] Update copy for sync block placeholder and copy flag
+- [`11bd6ea9cb0ba`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/11bd6ea9cb0ba) -
+  [ux] Clean up platform_editor_refactor_view_more
+- Updated dependencies
+
 ## 111.7.2
 
 ### Patch Changes

package/afm-cc/tsconfig.json

@@ -1,5 +1,5 @@
 {
-	"extends": "../../../../tsconfig.entry-points.confluence.json",
+	"extends": "../../../../tsconfig.local-consumption.json",
 	"compilerOptions": {
 		"declaration": true,
 		"target": "es5",

package/dist/cjs/element-browser/ElementBrowser.js

@@ -119,7 +119,6 @@ var ElementBrowser = exports.default = /*#__PURE__*/function (_PureComponent) {
         showCategories = _this$props.showCategories,
         mode = _this$props.mode,
         emptyStateHandler = _this$props.emptyStateHandler,
-        viewMoreItem = _this$props.viewMoreItem,
         onViewMore = _this$props.onViewMore,
         cache = _this$props.cache,
         autoFocusSearch = _this$props.autoFocusSearch;
@@ -141,7 +140,6 @@ var ElementBrowser = exports.default = /*#__PURE__*/function (_PureComponent) {
         mode: mode,
         searchTerm: searchTerm,
         emptyStateHandler: emptyStateHandler,
-        viewMoreItem: viewMoreItem,
         cache: cache,
         onViewMore: onViewMore,
         autoFocusSearch: autoFocusSearch

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

@@ -13,7 +13,6 @@ var _react2 = require("@emotion/react");
 var _reactIntlNext = require("react-intl-next");
 var _withAnalyticsContext = _interopRequireDefault(require("@atlaskit/analytics-next/withAnalyticsContext"));
 var _withAnalyticsEvents = _interopRequireDefault(require("@atlaskit/analytics-next/withAnalyticsEvents"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _analytics = require("../../analytics");
 var _getEditorUgcToken = _interopRequireDefault(require("../../ugc-tokens/get-editor-ugc-token"));
@@ -21,7 +20,6 @@ var _ViewMore = require("../components/ViewMore");
 var _constants = require("../constants");
 var _useContainerWidth2 = _interopRequireDefault(require("../hooks/use-container-width"));
 var _useSelectAndFocusOnArrowNavigation = _interopRequireDefault(require("../hooks/use-select-and-focus-on-arrow-navigation"));
-var _ViewMore2 = require("../ViewMore");
 var _CategoryList = _interopRequireDefault(require("./CategoryList"));
 var _ElementList = _interopRequireDefault(require("./ElementList/ElementList"));
 var _ElementSearch = _interopRequireDefault(require("./ElementSearch"));
@@ -130,7 +128,6 @@ function StatelessElementBrowser(props) {
   var items = props.items,
     onSelectItem = props.onSelectItem,
     onInsertItem = props.onInsertItem,
-    viewMoreItem = props.viewMoreItem,
     onViewMore = props.onViewMore,
     selectedCategory = props.selectedCategory,
     onSelectCategory = props.onSelectCategory,
@@ -170,7 +167,7 @@ function StatelessElementBrowser(props) {
     var _items$index$isDisabl, _items$index;
     return (_items$index$isDisabl = (_items$index = items[index]) === null || _items$index === void 0 ? void 0 : _items$index.isDisabled) !== null && _items$index$isDisabl !== void 0 ? _items$index$isDisabl : false;
   }, [items]);
-  var _useSelectAndFocusOnA = (0, _useSelectAndFocusOnArrowNavigation.default)(items.length - 1, columnCount, (0, _platformFeatureFlags.fg)('platform_editor_refactor_view_more') ? !!onViewMore : !!viewMoreItem, itemIsDisabled, isFocusSearch, autoFocusSearch),
+  var _useSelectAndFocusOnA = (0, _useSelectAndFocusOnArrowNavigation.default)(items.length - 1, columnCount, !!onViewMore, itemIsDisabled, isFocusSearch, autoFocusSearch),
     selectedItemIndex = _useSelectAndFocusOnA.selectedItemIndex,
     focusedItemIndex = _useSelectAndFocusOnA.focusedItemIndex,
     setFocusedItemIndex = _useSelectAndFocusOnA.setFocusedItemIndex,
@@ -272,7 +269,6 @@ function StatelessElementBrowser(props) {
       setFocusOnSearch: setFocusOnSearch,
       onKeyPress: onItemsEnterTabKeyPress,
       onKeyDown: onKeyDown,
-      viewMoreItem: viewMoreItem,
       onViewMore: onViewMore,
       focusOnViewMore: focusOnViewMore,
       cache: cache
@@ -323,7 +319,6 @@ function MobileBrowser(_ref) {
     searchTerm = _ref.searchTerm,
     createAnalyticsEvent = _ref.createAnalyticsEvent,
     emptyStateHandler = _ref.emptyStateHandler,
-    viewMoreItem = _ref.viewMoreItem,
     onViewMore = _ref.onViewMore,
     cache = _ref.cache,
     _ref$focusOnEmptyStat = _ref.focusOnEmptyStateButton,
@@ -375,12 +370,9 @@ function MobileBrowser(_ref) {
       selectedCategory: selectedCategory,
       searchTerm: searchTerm,
       cache: cache
-    })), onViewMore && (0, _platformFeatureFlags.fg)('platform_editor_refactor_view_more') && (0, _react2.jsx)(_ViewMore.ViewMore, {
+    })), onViewMore && (0, _react2.jsx)(_ViewMore.ViewMore, {
       onViewMore: onViewMore,
       focus: focusOnViewMore
-    }), viewMoreItem && !(0, _platformFeatureFlags.fg)('platform_editor_refactor_view_more') && (0, _react2.jsx)(_ViewMore2.ViewMore, {
-      item: viewMoreItem,
-      focus: focusOnViewMore
     }))
   );
 }

package/dist/cjs/messages/placeholder-text.js

@@ -46,9 +46,9 @@ var placeholderTextMessages = exports.placeholderTextMessages = (0, _reactIntlNe
     defaultMessage: ' to insert elements',
     description: 'Text after slash in long empty node placeholder'
   },
-  syncBlockPlaceholderText: {
-    id: 'fabric.editor.syncBlockPlaceholderText',
-    defaultMessage: 'Add content then copy this synced block to access it across spaces',
-    description: 'Placeholder text for sync block'
+  sourceSyncBlockPlaceholderText: {
+    id: 'fabric.editor.sourceSyncBlockPlaceholderText',
+    defaultMessage: 'Add content you want to reuse. Copy and paste this block to sync in other locations.',
+    description: 'Placeholder text for source sync block'
   }
 });

package/dist/cjs/messages/text-color.js

@@ -18,7 +18,7 @@ var textColorMessages = exports.textColorMessages = (0, _reactIntlNext.defineMes
   },
   textColorHighlightTooltip: {
     id: 'fabric.editor.textColorHighlightTooltip',
-    defaultMessage: 'Text and Highlight color',
+    defaultMessage: 'Text and highlight color',
     description: 'Tooltip of menu that provides access to various colors of highlight.'
   }
 });

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.7.1";
+var packageVersion = "111.7.3";
 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.7.1";
+var packageVersion = "111.7.3";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 var fadeIn = (0, _react2.keyframes)({

package/dist/cjs/utils/calculate-toolbar-position.js

@@ -3,10 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.calculateToolbarPositionTrackHead = exports.calculateToolbarPositionOnCellSelection = exports.calculateToolbarPositionAboveSelection = void 0;
+exports.calculateToolbarPositionTrackHeadOld = exports.calculateToolbarPositionTrackHeadNew = exports.calculateToolbarPositionTrackHead = exports.calculateToolbarPositionOnCellSelection = exports.calculateToolbarPositionAboveSelection = void 0;
 var _utils = require("@atlaskit/editor-prosemirror/utils");
 var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var MAXIMUM_BROWSER_SCROLLBAR_WIDTH = 20;
 
 /*
@@ -85,19 +86,36 @@ var calculateToolbarPositionAboveSelection = exports.calculateToolbarPositionAbo
     };
   };
 };
-/*
-  Calculates the position of the floating toolbar relative to the selection.
-  This is a re-implementation which closely matches the behaviour on Confluence renderer.
-  The main difference is the popup is always above the selection.
-  Things to consider:
-  - stick as close to the head X release coordinates as possible
-  - coordinates of head X and getBoundingClientRect() are absolute in client viewport (not including scroll offsets)
-  - popup may appear in '.fabric-editor-popup-scroll-parent' (or body)
-  - we use the toolbarRect to center align toolbar
-  - use wrapperBounds to clamp values
-  - editorView.dom bounds differ to wrapperBounds, convert at the end
-*/
-var calculateToolbarPositionTrackHead = exports.calculateToolbarPositionTrackHead = function calculateToolbarPositionTrackHead(toolbarTitle) {
+var findContainingElement = function findContainingElement(editorView) {
+  // First, try to find .fabric-editor-popup-scroll-parent
+  var scrollParent = editorView.dom.closest('.fabric-editor-popup-scroll-parent');
+  if (scrollParent) {
+    return {
+      container: scrollParent,
+      isFixed: false
+    };
+  } else {
+    // If no scroll parent, look for a fixed positioned parent
+    var fixedParent = editorView.dom.parentElement;
+    while (fixedParent && fixedParent !== document.body) {
+      var computedStyle = window.getComputedStyle(fixedParent);
+      if (computedStyle.position === 'fixed') {
+        return {
+          container: fixedParent,
+          isFixed: true
+        };
+      }
+      fixedParent = fixedParent.parentElement;
+    }
+  }
+
+  // Fall back to document.body if no fixed parent found
+  return {
+    container: document.body,
+    isFixed: false
+  };
+};
+var calculateToolbarPositionTrackHeadOld = exports.calculateToolbarPositionTrackHeadOld = function calculateToolbarPositionTrackHeadOld(toolbarTitle) {
   return function (editorView, nextPos) {
     var toolbar = document.querySelector("div[aria-label=\"".concat(toolbarTitle, "\"]"));
     if (!toolbar) {
@@ -167,6 +185,121 @@ var calculateToolbarPositionTrackHead = exports.calculateToolbarPositionTrackHea
   };
 };
 
+/**
+ * Same logic as calculateToolbarPositionTrackHeadOld, but with the following changes:
+ * - Uses a cached container to avoid repeated DOM traversal and getComputedStyle calls
+ * - Works when editor is nested within a fixed positioned parent, such as within a modal or sidebar
+ */
+var calculateToolbarPositionTrackHeadNew = exports.calculateToolbarPositionTrackHeadNew = function calculateToolbarPositionTrackHeadNew(toolbarTitle) {
+  // Cache the container to avoid repeated DOM traversal and getComputedStyle calls
+  var cachedContainer = null;
+  var isFixedContainer = false;
+  var cachedEditorDom = null;
+  return function (editorView, nextPos) {
+    var toolbar = document.querySelector("div[aria-label=\"".concat(toolbarTitle, "\"]"));
+    if (!toolbar) {
+      return nextPos;
+    }
+
+    // Find and cache the container (only recalculates if editor DOM changed)
+    if (cachedEditorDom !== editorView.dom) {
+      cachedEditorDom = editorView.dom;
+      var _findContainingElemen = findContainingElement(editorView),
+        _container = _findContainingElemen.container,
+        isFixed = _findContainingElemen.isFixed;
+      cachedContainer = _container;
+      isFixedContainer = isFixed;
+    }
+    if (!cachedContainer) {
+      return nextPos;
+    }
+    var container = cachedContainer;
+    var containerBounds = container.getBoundingClientRect();
+    var selection = window && window.getSelection();
+    var moreRovoOptionsButton = document.querySelector('button[aria-label="More Rovo options"], [aria-label="More Rovo options"]');
+    var isMoreRovoOptionsButtonVisible = !!moreRovoOptionsButton && moreRovoOptionsButton instanceof HTMLElement && !!moreRovoOptionsButton.offsetParent;
+    var range = null;
+    if (isMoreRovoOptionsButtonVisible && (0, _platformFeatureFlags.fg)('platform_editor_ai_generic_prep_for_aifc')) {
+      if (selection && selection.getRangeAt && selection.rangeCount > 0) {
+        var maybeRange = selection.getRangeAt(0);
+        if (maybeRange instanceof Range) {
+          range = maybeRange;
+        }
+      }
+    } else {
+      if (selection && !selection.isCollapsed && selection.getRangeAt && selection.rangeCount > 0) {
+        var _maybeRange2 = selection.getRangeAt(0);
+        if (_maybeRange2 instanceof Range) {
+          range = _maybeRange2;
+        }
+      }
+    }
+    if (!range) {
+      return nextPos;
+    }
+    var toolbarRect = toolbar.getBoundingClientRect();
+    var _editorView$state$sel3 = editorView.state.selection,
+      head = _editorView$state$sel3.head,
+      anchor = _editorView$state$sel3.anchor;
+    var topCoords = editorView.coordsAtPos(Math.min(head, anchor));
+    var bottomCoords = editorView.coordsAtPos(Math.max(head, anchor) - Math.min(range.endOffset, 1));
+    var top;
+    // If not the same line AND we are selecting downwards, display toolbar below.
+    if (head > anchor && topCoords.top !== bottomCoords.top) {
+      // We are taking the previous pos to the maxium, so avoid end of line positions
+      // returning the next line's rect.
+      top = (bottomCoords.top || 0) + toolbarRect.height / 1.15;
+    } else {
+      top = (topCoords.top || 0) - toolbarRect.height * 1.5;
+    }
+    var left = (head > anchor ? bottomCoords.right : topCoords.left) - toolbarRect.width / 2;
+
+    // Place toolbar below selection if not sufficient space above
+    if (top < containerBounds.top) {
+      var _getCoordsBelowSelect3 = getCoordsBelowSelection(bottomCoords, toolbarRect);
+      top = _getCoordsBelowSelect3.top;
+      left = _getCoordsBelowSelect3.left;
+    }
+    var leftCoord = Math.max(0, left - containerBounds.left);
+    if (leftCoord + toolbarRect.width > containerBounds.width) {
+      var _scrollbarWidth2 = MAXIMUM_BROWSER_SCROLLBAR_WIDTH;
+      leftCoord = Math.max(0, containerBounds.width - (toolbarRect.width + _scrollbarWidth2));
+    }
+
+    // Apply scroll offset only for non-fixed containers
+    // Fixed positioned elements don't scroll with the page
+    var scrollOffset = isFixedContainer ? 0 : container.scrollTop;
+    return {
+      top: top - containerBounds.top + scrollOffset,
+      left: leftCoord
+    };
+  };
+};
+
+/*
+  Calculates the position of the floating toolbar relative to the selection.
+  This implementation works in multiple scenarios:
+  - Standard scrollable containers with .fabric-editor-popup-scroll-parent
+  - Fixed positioned parent containers
+  - Falls back to document.body
+
+  The function automatically detects the container type and applies the appropriate
+  positioning logic and scroll offset handling.
+
+  Things to consider:
+  - stick as close to the head X release coordinates as possible
+  - coordinates of head X and getBoundingClientRect() are absolute in client viewport
+  - popup may appear in '.fabric-editor-popup-scroll-parent', fixed parent, or body
+  - we use the toolbarRect to center align toolbar
+  - use container bounds to clamp values
+  - for fixed positioning, no scroll offsets are applied
+  - for scrollable containers, scroll offsets are included
+*/
+var calculateToolbarPositionTrackHead = exports.calculateToolbarPositionTrackHead = function calculateToolbarPositionTrackHead(toolbarTitle) {
+  var isSelToolbarFixEnabled = (0, _expValEquals.expValEquals)('platform_editor_sel_toolbar_fix', 'isEnabled', true);
+  return isSelToolbarFixEnabled ? calculateToolbarPositionTrackHeadNew(toolbarTitle) : calculateToolbarPositionTrackHeadOld(toolbarTitle);
+};
+
 /**
  * Returns the coordintes at the bottom the selection.
  */

package/dist/es2019/element-browser/ElementBrowser.js

@@ -88,7 +88,6 @@ export default class ElementBrowser extends PureComponent {
       showCategories,
       mode,
       emptyStateHandler,
-      viewMoreItem,
       onViewMore,
       cache,
       autoFocusSearch
@@ -112,7 +111,6 @@ export default class ElementBrowser extends PureComponent {
       mode: mode,
       searchTerm: searchTerm,
       emptyStateHandler: emptyStateHandler,
-      viewMoreItem: viewMoreItem,
       cache: cache,
       onViewMore: onViewMore,
       autoFocusSearch: autoFocusSearch

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

@@ -10,15 +10,13 @@ import { css, jsx } from '@emotion/react';
 import { FormattedMessage } from 'react-intl-next';
 import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext';
 import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
-import { fg } from '@atlaskit/platform-feature-flags';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { ACTION, ACTION_SUBJECT, EVENT_TYPE, fireAnalyticsEvent } from '../../analytics';
 import editorUGCToken from '../../ugc-tokens/get-editor-ugc-token';
-import { ViewMore as ViewMoreNext } from '../components/ViewMore';
+import { ViewMore } from '../components/ViewMore';
 import { DEVICE_BREAKPOINT_NUMBERS, ELEMENT_BROWSER_ID, ELEMENT_BROWSER_LIST_ID, GRID_SIZE, INLINE_SIDEBAR_HEIGHT, SIDEBAR_HEADING_WRAPPER_HEIGHT, SIDEBAR_WIDTH } from '../constants';
 import useContainerWidth from '../hooks/use-container-width';
 import useSelectAndFocusOnArrowNavigation from '../hooks/use-select-and-focus-on-arrow-navigation';
-import { ViewMore } from '../ViewMore';
 import CategoryList from './CategoryList';
 import ElementList from './ElementList/ElementList';
 import ElementSearch from './ElementSearch';
@@ -120,7 +118,6 @@ function StatelessElementBrowser(props) {
     items,
     onSelectItem,
     onInsertItem,
-    viewMoreItem,
     onViewMore,
     selectedCategory,
     onSelectCategory,
@@ -166,7 +163,7 @@ function StatelessElementBrowser(props) {
     focusOnViewMore,
     onKeyDown,
     setFocusOnSearch
-  } = useSelectAndFocusOnArrowNavigation(items.length - 1, columnCount, fg('platform_editor_refactor_view_more') ? !!onViewMore : !!viewMoreItem, itemIsDisabled, isFocusSearch, autoFocusSearch);
+  } = useSelectAndFocusOnArrowNavigation(items.length - 1, columnCount, !!onViewMore, itemIsDisabled, isFocusSearch, autoFocusSearch);
   useEffect(() => {
     fireAnalyticsEvent(props.createAnalyticsEvent)({
       payload: {
@@ -258,7 +255,6 @@ function StatelessElementBrowser(props) {
       setFocusOnSearch: setFocusOnSearch,
       onKeyPress: onItemsEnterTabKeyPress,
       onKeyDown: onKeyDown,
-      viewMoreItem: viewMoreItem,
       onViewMore: onViewMore,
       focusOnViewMore: focusOnViewMore,
       cache: cache
@@ -309,7 +305,6 @@ function MobileBrowser({
   searchTerm,
   createAnalyticsEvent,
   emptyStateHandler,
-  viewMoreItem,
   onViewMore,
   cache,
   focusOnEmptyStateButton = false
@@ -361,12 +356,9 @@ function MobileBrowser({
       selectedCategory: selectedCategory,
       searchTerm: searchTerm,
       cache: cache
-    })), onViewMore && fg('platform_editor_refactor_view_more') && jsx(ViewMoreNext, {
+    })), onViewMore && jsx(ViewMore, {
       onViewMore: onViewMore,
       focus: focusOnViewMore
-    }), viewMoreItem && !fg('platform_editor_refactor_view_more') && jsx(ViewMore, {
-      item: viewMoreItem,
-      focus: focusOnViewMore
     }))
   );
 }

package/dist/es2019/messages/placeholder-text.js

@@ -40,9 +40,9 @@ export const placeholderTextMessages = defineMessages({
     defaultMessage: ' to insert elements',
     description: 'Text after slash in long empty node placeholder'
   },
-  syncBlockPlaceholderText: {
-    id: 'fabric.editor.syncBlockPlaceholderText',
-    defaultMessage: 'Add content then copy this synced block to access it across spaces',
-    description: 'Placeholder text for sync block'
+  sourceSyncBlockPlaceholderText: {
+    id: 'fabric.editor.sourceSyncBlockPlaceholderText',
+    defaultMessage: 'Add content you want to reuse. Copy and paste this block to sync in other locations.',
+    description: 'Placeholder text for source sync block'
   }
 });

package/dist/es2019/messages/text-color.js

@@ -12,7 +12,7 @@ export const textColorMessages = defineMessages({
   },
   textColorHighlightTooltip: {
     id: 'fabric.editor.textColorHighlightTooltip',
-    defaultMessage: 'Text and Highlight color',
+    defaultMessage: 'Text and highlight color',
     description: 'Tooltip of menu that provides access to various colors of highlight.'
   }
 });

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.7.1";
+const packageVersion = "111.7.3";
 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.7.1";
+const packageVersion = "111.7.3";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 const fadeIn = keyframes({

package/dist/es2019/utils/calculate-toolbar-position.js

@@ -1,6 +1,7 @@
 import { findDomRefAtPos } from '@atlaskit/editor-prosemirror/utils';
 import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
 import { fg } from '@atlaskit/platform-feature-flags';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 const MAXIMUM_BROWSER_SCROLLBAR_WIDTH = 20;
 
 /*
@@ -79,19 +80,36 @@ export const calculateToolbarPositionAboveSelection = toolbarTitle => (editorVie
     left: Math.max(0, left - wrapperBounds.left)
   };
 };
-/*
-  Calculates the position of the floating toolbar relative to the selection.
-  This is a re-implementation which closely matches the behaviour on Confluence renderer.
-  The main difference is the popup is always above the selection.
-  Things to consider:
-  - stick as close to the head X release coordinates as possible
-  - coordinates of head X and getBoundingClientRect() are absolute in client viewport (not including scroll offsets)
-  - popup may appear in '.fabric-editor-popup-scroll-parent' (or body)
-  - we use the toolbarRect to center align toolbar
-  - use wrapperBounds to clamp values
-  - editorView.dom bounds differ to wrapperBounds, convert at the end
-*/
-export const calculateToolbarPositionTrackHead = toolbarTitle => (editorView, nextPos) => {
+const findContainingElement = editorView => {
+  // First, try to find .fabric-editor-popup-scroll-parent
+  const scrollParent = editorView.dom.closest('.fabric-editor-popup-scroll-parent');
+  if (scrollParent) {
+    return {
+      container: scrollParent,
+      isFixed: false
+    };
+  } else {
+    // If no scroll parent, look for a fixed positioned parent
+    let fixedParent = editorView.dom.parentElement;
+    while (fixedParent && fixedParent !== document.body) {
+      const computedStyle = window.getComputedStyle(fixedParent);
+      if (computedStyle.position === 'fixed') {
+        return {
+          container: fixedParent,
+          isFixed: true
+        };
+      }
+      fixedParent = fixedParent.parentElement;
+    }
+  }
+
+  // Fall back to document.body if no fixed parent found
+  return {
+    container: document.body,
+    isFixed: false
+  };
+};
+export const calculateToolbarPositionTrackHeadOld = toolbarTitle => (editorView, nextPos) => {
   const toolbar = document.querySelector(`div[aria-label="${toolbarTitle}"]`);
   if (!toolbar) {
     return nextPos;
@@ -161,6 +179,124 @@ export const calculateToolbarPositionTrackHead = toolbarTitle => (editorView, ne
   };
 };
 
+/**
+ * Same logic as calculateToolbarPositionTrackHeadOld, but with the following changes:
+ * - Uses a cached container to avoid repeated DOM traversal and getComputedStyle calls
+ * - Works when editor is nested within a fixed positioned parent, such as within a modal or sidebar
+ */
+export const calculateToolbarPositionTrackHeadNew = toolbarTitle => {
+  // Cache the container to avoid repeated DOM traversal and getComputedStyle calls
+  let cachedContainer = null;
+  let isFixedContainer = false;
+  let cachedEditorDom = null;
+  return (editorView, nextPos) => {
+    const toolbar = document.querySelector(`div[aria-label="${toolbarTitle}"]`);
+    if (!toolbar) {
+      return nextPos;
+    }
+
+    // Find and cache the container (only recalculates if editor DOM changed)
+    if (cachedEditorDom !== editorView.dom) {
+      cachedEditorDom = editorView.dom;
+      const {
+        container,
+        isFixed
+      } = findContainingElement(editorView);
+      cachedContainer = container;
+      isFixedContainer = isFixed;
+    }
+    if (!cachedContainer) {
+      return nextPos;
+    }
+    const container = cachedContainer;
+    const containerBounds = container.getBoundingClientRect();
+    const selection = window && window.getSelection();
+    const moreRovoOptionsButton = document.querySelector('button[aria-label="More Rovo options"], [aria-label="More Rovo options"]');
+    const isMoreRovoOptionsButtonVisible = !!moreRovoOptionsButton && moreRovoOptionsButton instanceof HTMLElement && !!moreRovoOptionsButton.offsetParent;
+    let range = null;
+    if (isMoreRovoOptionsButtonVisible && fg('platform_editor_ai_generic_prep_for_aifc')) {
+      if (selection && selection.getRangeAt && selection.rangeCount > 0) {
+        const maybeRange = selection.getRangeAt(0);
+        if (maybeRange instanceof Range) {
+          range = maybeRange;
+        }
+      }
+    } else {
+      if (selection && !selection.isCollapsed && selection.getRangeAt && selection.rangeCount > 0) {
+        const maybeRange = selection.getRangeAt(0);
+        if (maybeRange instanceof Range) {
+          range = maybeRange;
+        }
+      }
+    }
+    if (!range) {
+      return nextPos;
+    }
+    const toolbarRect = toolbar.getBoundingClientRect();
+    const {
+      head,
+      anchor
+    } = editorView.state.selection;
+    const topCoords = editorView.coordsAtPos(Math.min(head, anchor));
+    const bottomCoords = editorView.coordsAtPos(Math.max(head, anchor) - Math.min(range.endOffset, 1));
+    let top;
+    // If not the same line AND we are selecting downwards, display toolbar below.
+    if (head > anchor && topCoords.top !== bottomCoords.top) {
+      // We are taking the previous pos to the maxium, so avoid end of line positions
+      // returning the next line's rect.
+      top = (bottomCoords.top || 0) + toolbarRect.height / 1.15;
+    } else {
+      top = (topCoords.top || 0) - toolbarRect.height * 1.5;
+    }
+    let left = (head > anchor ? bottomCoords.right : topCoords.left) - toolbarRect.width / 2;
+
+    // Place toolbar below selection if not sufficient space above
+    if (top < containerBounds.top) {
+      ({
+        top,
+        left
+      } = getCoordsBelowSelection(bottomCoords, toolbarRect));
+    }
+    let leftCoord = Math.max(0, left - containerBounds.left);
+    if (leftCoord + toolbarRect.width > containerBounds.width) {
+      const scrollbarWidth = MAXIMUM_BROWSER_SCROLLBAR_WIDTH;
+      leftCoord = Math.max(0, containerBounds.width - (toolbarRect.width + scrollbarWidth));
+    }
+
+    // Apply scroll offset only for non-fixed containers
+    // Fixed positioned elements don't scroll with the page
+    const scrollOffset = isFixedContainer ? 0 : container.scrollTop;
+    return {
+      top: top - containerBounds.top + scrollOffset,
+      left: leftCoord
+    };
+  };
+};
+
+/*
+  Calculates the position of the floating toolbar relative to the selection.
+  This implementation works in multiple scenarios:
+  - Standard scrollable containers with .fabric-editor-popup-scroll-parent
+  - Fixed positioned parent containers
+  - Falls back to document.body
+
+  The function automatically detects the container type and applies the appropriate
+  positioning logic and scroll offset handling.
+
+  Things to consider:
+  - stick as close to the head X release coordinates as possible
+  - coordinates of head X and getBoundingClientRect() are absolute in client viewport
+  - popup may appear in '.fabric-editor-popup-scroll-parent', fixed parent, or body
+  - we use the toolbarRect to center align toolbar
+  - use container bounds to clamp values
+  - for fixed positioning, no scroll offsets are applied
+  - for scrollable containers, scroll offsets are included
+*/
+export const calculateToolbarPositionTrackHead = toolbarTitle => {
+  const isSelToolbarFixEnabled = expValEquals('platform_editor_sel_toolbar_fix', 'isEnabled', true);
+  return isSelToolbarFixEnabled ? calculateToolbarPositionTrackHeadNew(toolbarTitle) : calculateToolbarPositionTrackHeadOld(toolbarTitle);
+};
+
 /**
  * Returns the coordintes at the bottom the selection.
  */