@atlaskit/editor-common 120.3.0 → 120.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,27 @@
1
1
  # @atlaskit/editor-common
2
2
 
3
+ ## 120.3.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [`1d44842106f7b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1d44842106f7b) -
8
+ Revert the AI entry-point relabel that was gated behind the
9
+ `platform_editor_ai_new_aifc_editor_experience` experiment. The editor AI entry points now always
10
+ show the "Ask Rovo" label and "Ask Rovo" tooltip instead of "Edit" / "Edit with Rovo". This covers
11
+ the floating/selection toolbar button, the main and inline toolbar Rovo button (label, tooltip,
12
+ and icon label), and the free-generate modal title. The now-unused
13
+ `aiNewAifcEntryPointCallToAction` and `askRovoToolbarIconTooltipQuickCommandNewAifc` messages have
14
+ been removed.
15
+ - Updated dependencies
16
+
17
+ ## 120.3.1
18
+
19
+ ### Patch Changes
20
+
21
+ - [`6f34a5002d9ed`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6f34a5002d9ed) -
22
+ [ux] Fix nested multi-bodied extensions so a parent active tab does not force a nested extension's
23
+ first frame to render behind the `platform_editor_nested_mbe_frames` feature gate.
24
+
3
25
  ## 120.3.0
4
26
 
5
27
  ### Minor Changes
@@ -78,11 +78,6 @@ var aiMessages = exports.aiMessages = (0, _reactIntl.defineMessages)({
78
78
  defaultMessage: "Ask Rovo {key}+'",
79
79
  description: 'Tooltip text for an option to use Rovo AI with quick command'
80
80
  },
81
- askRovoToolbarIconTooltipQuickCommandNewAifc: {
82
- id: 'fabric.editor.ai.toolbar.askRovo.tooltip.quickCommand.newAifc',
83
- defaultMessage: "Edit with Rovo {key}+'",
84
- description: 'Tooltip text for the Rovo AI entry-point button in the new AIFC editor experience, where the button is labelled "Edit", with quick command'
85
- },
86
81
  askRovoToolbarRemixAppTooltipQuickCommand: {
87
82
  id: 'fabric.editor.ai.toolbar.askRovo.remixApp.tooltip.quickCommand',
88
83
  defaultMessage: "Edit {key}+'",
@@ -18,6 +18,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
18
18
  var _reactIntl = require("react-intl");
19
19
  var _file = _interopRequireDefault(require("@atlaskit/icon/core/file"));
20
20
  var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
21
+ var _fg = require("@atlaskit/platform-feature-flags/fg");
21
22
  var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
22
23
  var _hooks = require("../../hooks");
23
24
  var _placeholderText = require("../../messages/placeholder-text");
@@ -36,24 +37,21 @@ var _excluded = ["url"];
36
37
  */
37
38
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled, @typescript-eslint/consistent-type-imports -- Ignored via go/DSP-18766; jsx required at runtime for @jsxRuntime classic
38
39
  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); }
39
- var getContainerCssExtendedStyles = function getContainerCssExtendedStyles(activeChildIndex, showMacroInteractionDesignUpdates) {
40
- return (
41
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
42
- (0, _react2.css)(_MultiBodiedExtension.sharedMultiBodiedExtensionStyles.mbeExtensionContainer, (0, _defineProperty2.default)({}, ".multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(".concat(activeChildIndex + 1
43
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
44
- , ")"), (0, _react2.css)(
45
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
46
- _MultiBodiedExtension.sharedMultiBodiedExtensionStyles.extensionFrameContent,
47
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
48
- showMacroInteractionDesignUpdates && _MultiBodiedExtension.removeMarginsAndBorder)))
49
- );
40
+ var getContainerCssExtendedStyles = function getContainerCssExtendedStyles(activeChildIndex, frameId, showMacroInteractionDesignUpdates) {
41
+ var activeFrameSelector = (0, _fg.fg)('platform_editor_nested_mbe_frames') ? "[data-multibodiedextension-frames-id='".concat(frameId, "'] > .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(").concat(activeChildIndex + 1, ")") : ".multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(".concat(activeChildIndex + 1, ")");
42
+
43
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
44
+ return (0, _react2.css)(_MultiBodiedExtension.sharedMultiBodiedExtensionStyles.mbeExtensionContainer, (0, _defineProperty2.default)({}, activeFrameSelector, (0, _react2.css)(
45
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
46
+ _MultiBodiedExtension.sharedMultiBodiedExtensionStyles.extensionFrameContent,
47
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
48
+ showMacroInteractionDesignUpdates && _MultiBodiedExtension.removeMarginsAndBorder)));
50
49
  };
51
50
 
52
51
  // Renders a visual placeholder when the active frame contains a single empty paragraph.
53
- var getEmptyFramePlaceholderStyles = function getEmptyFramePlaceholderStyles(activeChildIndex, placeholderText) {
54
- return (0, _react2.css)((0, _defineProperty2.default)({}, "& .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(".concat(activeChildIndex + 1
55
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
56
- , ") > p:only-child:has(> .ProseMirror-trailingBreak):not(:has(> :not(.ProseMirror-widget):not(.ProseMirror-separator):not(.ProseMirror-trailingBreak)))::before"), {
52
+ var getEmptyFramePlaceholderStyles = function getEmptyFramePlaceholderStyles(activeChildIndex, frameId, placeholderText) {
53
+ var activeFramePlaceholderSelector = (0, _fg.fg)('platform_editor_nested_mbe_frames') ? "& [data-multibodiedextension-frames-id='".concat(frameId, "'] > .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(").concat(activeChildIndex + 1, ") > p:only-child:has(> .ProseMirror-trailingBreak):not(:has(> :not(.ProseMirror-widget):not(.ProseMirror-separator):not(.ProseMirror-trailingBreak)))::before") : "& .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(".concat(activeChildIndex + 1, ") > p:only-child:has(> .ProseMirror-trailingBreak):not(:has(> :not(.ProseMirror-widget):not(.ProseMirror-separator):not(.ProseMirror-trailingBreak)))::before");
54
+ return (0, _react2.css)((0, _defineProperty2.default)({}, activeFramePlaceholderSelector, {
57
55
  color: "var(--ds-text-subtlest, #6B6E76)",
58
56
  // JSON.stringify produces a quoted and escaped CSS string.
59
57
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
@@ -77,12 +75,14 @@ var hoverStylesOld = (0, _react2.css)({
77
75
  }
78
76
  });
79
77
  var MultiBodiedExtensionFrames = function MultiBodiedExtensionFrames(_ref) {
80
- var articleRef = _ref.articleRef;
78
+ var articleRef = _ref.articleRef,
79
+ frameId = _ref.frameId;
81
80
  return (0, _react2.jsx)("article", {
82
81
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
83
82
  className: "multiBodiedExtension--frames",
84
83
  "data-testid": "multiBodiedExtension--frames",
85
84
  "data-multibodiedextension-frames": true,
85
+ "data-multibodiedextension-frames-id": frameId,
86
86
  ref: articleRef
87
87
  });
88
88
  };
@@ -212,6 +212,10 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref2
212
212
  _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
213
213
  activeChildIndex = _useState4[0],
214
214
  setActiveChildIndex = _useState4[1];
215
+ // Used by the gated active-frame styles to scope selection to this MBE instance.
216
+ // Editor frames sit under ProseMirror's contentDOM wrapper, so the id anchors the
217
+ // selector at the owning MBE before it reaches that wrapper and its direct frames.
218
+ var frameId = _react.default.useId();
215
219
  // Adding to avoid aliasing `this` for the callbacks
216
220
  var updateActiveChild = _react.default.useCallback(function (index) {
217
221
  if (typeof index !== 'number') {
@@ -226,9 +230,10 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref2
226
230
  }, [handleContentDOMRef]);
227
231
  var childrenContainer = _react.default.useMemo(function () {
228
232
  return (0, _react2.jsx)(MultiBodiedExtensionFrames, {
229
- articleRef: articleRef
233
+ articleRef: articleRef,
234
+ frameId: frameId
230
235
  });
231
- }, [articleRef]);
236
+ }, [articleRef, frameId]);
232
237
  var actions = (0, _actionApi.useMultiBodiedExtensionActions)({
233
238
  updateActiveChild: updateActiveChild,
234
239
  editorView: editorView,
@@ -340,7 +345,7 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref2
340
345
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
341
346
  className: containerClassNames,
342
347
  css: [/* eslint-disable @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766 */
343
- getContainerCssExtendedStyles(activeChildIndex, showMacroInteractionDesignUpdates), shouldShowEmptyFramePlaceholder && getEmptyFramePlaceholderStyles(activeChildIndex, emptyFramePlaceholderText)
348
+ getContainerCssExtendedStyles(activeChildIndex, frameId, showMacroInteractionDesignUpdates), shouldShowEmptyFramePlaceholder && getEmptyFramePlaceholderStyles(activeChildIndex, frameId, emptyFramePlaceholderText)
344
349
  /* eslint-enable @atlaskit/design-system/consistent-css-prop-usage */],
345
350
  "data-testid": "multiBodiedExtension--container",
346
351
  "data-multiBodiedExtension-container": true,
@@ -28,7 +28,7 @@ var NETWORK_FAILURE_REGEX = /^network failure/i;
28
28
  var RESIZE_OBSERVER_LOOP_REGEX = /ResizeObserver loop completed with undelivered notifications/;
29
29
  var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
30
30
  var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
31
- var packageVersion = "120.2.0";
31
+ var packageVersion = "120.3.1";
32
32
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
33
33
  // Remove URL as it has UGC
34
34
  // Ignored via go/ees007
@@ -24,7 +24,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
24
24
  * @jsx jsx
25
25
  */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
26
26
  var packageName = "@atlaskit/editor-common";
27
- var packageVersion = "120.2.0";
27
+ var packageVersion = "120.3.1";
28
28
  var halfFocusRing = 1;
29
29
  var dropOffset = '0, 8';
30
30
  var fadeIn = (0, _react2.keyframes)({
@@ -72,11 +72,6 @@ export const aiMessages = defineMessages({
72
72
  defaultMessage: "Ask Rovo {key}+'",
73
73
  description: 'Tooltip text for an option to use Rovo AI with quick command'
74
74
  },
75
- askRovoToolbarIconTooltipQuickCommandNewAifc: {
76
- id: 'fabric.editor.ai.toolbar.askRovo.tooltip.quickCommand.newAifc',
77
- defaultMessage: "Edit with Rovo {key}+'",
78
- description: 'Tooltip text for the Rovo AI entry-point button in the new AIFC editor experience, where the button is labelled "Edit", with quick command'
79
- },
80
75
  askRovoToolbarRemixAppTooltipQuickCommand: {
81
76
  id: 'fabric.editor.ai.toolbar.askRovo.remixApp.tooltip.quickCommand',
82
77
  defaultMessage: "Edit {key}+'",
@@ -14,6 +14,7 @@ import classnames from 'classnames';
14
14
  import { useIntl } from 'react-intl';
15
15
  import EditorFileIcon from '@atlaskit/icon/core/file';
16
16
  import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
17
+ import { fg } from '@atlaskit/platform-feature-flags/fg';
17
18
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
18
19
  import { useSharedPluginStateWithSelector } from '../../hooks';
19
20
  import { placeholderTextMessages } from '../../messages/placeholder-text';
@@ -24,33 +25,35 @@ import { ExtensionFloatingLabel } from '../Extension/Lozenge/ExtensionFloatingLa
24
25
  import { shouldExtensionBreakout } from '../utils/should-extension-breakout';
25
26
  import { useMultiBodiedExtensionActions } from './action-api';
26
27
  import { mbeExtensionWrapperCSSStyles, mbeExtensionWrapperCSSStylesOld, overlayStyles, overlayStylesOld } from './styles';
27
- const getContainerCssExtendedStyles = (activeChildIndex, showMacroInteractionDesignUpdates) =>
28
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
29
- css(sharedMultiBodiedExtensionStyles.mbeExtensionContainer, {
30
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
31
- [`.multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(${activeChildIndex + 1
32
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
33
- })`]: css(
28
+ const getContainerCssExtendedStyles = (activeChildIndex, frameId, showMacroInteractionDesignUpdates) => {
29
+ const activeFrameSelector = fg('platform_editor_nested_mbe_frames') ? `[data-multibodiedextension-frames-id='${frameId}'] > .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(${activeChildIndex + 1})` : `.multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(${activeChildIndex + 1})`;
30
+
34
31
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
35
- sharedMultiBodiedExtensionStyles.extensionFrameContent,
36
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
37
- showMacroInteractionDesignUpdates && removeMarginsAndBorder)
38
- });
32
+ return css(sharedMultiBodiedExtensionStyles.mbeExtensionContainer, {
33
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
34
+ [activeFrameSelector]: css(
35
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
36
+ sharedMultiBodiedExtensionStyles.extensionFrameContent,
37
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
38
+ showMacroInteractionDesignUpdates && removeMarginsAndBorder)
39
+ });
40
+ };
39
41
 
40
42
  // Renders a visual placeholder when the active frame contains a single empty paragraph.
41
- const getEmptyFramePlaceholderStyles = (activeChildIndex, placeholderText) => css({
42
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
43
- [`& .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(${activeChildIndex + 1
44
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
45
- }) > p:only-child:has(> .ProseMirror-trailingBreak):not(:has(> :not(.ProseMirror-widget):not(.ProseMirror-separator):not(.ProseMirror-trailingBreak)))::before`]: {
46
- color: "var(--ds-text-subtlest, #6B6E76)",
47
- // JSON.stringify produces a quoted and escaped CSS string.
48
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
49
- content: placeholderText,
50
- pointerEvents: 'none',
51
- position: 'absolute'
52
- }
53
- });
43
+ const getEmptyFramePlaceholderStyles = (activeChildIndex, frameId, placeholderText) => {
44
+ const activeFramePlaceholderSelector = fg('platform_editor_nested_mbe_frames') ? `& [data-multibodiedextension-frames-id='${frameId}'] > .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(${activeChildIndex + 1}) > p:only-child:has(> .ProseMirror-trailingBreak):not(:has(> :not(.ProseMirror-widget):not(.ProseMirror-separator):not(.ProseMirror-trailingBreak)))::before` : `& .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(${activeChildIndex + 1}) > p:only-child:has(> .ProseMirror-trailingBreak):not(:has(> :not(.ProseMirror-widget):not(.ProseMirror-separator):not(.ProseMirror-trailingBreak)))::before`;
45
+ return css({
46
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
47
+ [activeFramePlaceholderSelector]: {
48
+ color: "var(--ds-text-subtlest, #6B6E76)",
49
+ // JSON.stringify produces a quoted and escaped CSS string.
50
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
51
+ content: placeholderText,
52
+ pointerEvents: 'none',
53
+ position: 'absolute'
54
+ }
55
+ });
56
+ };
54
57
  const imageStyles = css({
55
58
  maxHeight: '24px',
56
59
  maxWidth: '24px'
@@ -66,13 +69,15 @@ const hoverStylesOld = css({
66
69
  }
67
70
  });
68
71
  const MultiBodiedExtensionFrames = ({
69
- articleRef
72
+ articleRef,
73
+ frameId
70
74
  }) => {
71
75
  return jsx("article", {
72
76
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
73
77
  className: "multiBodiedExtension--frames",
74
78
  "data-testid": "multiBodiedExtension--frames",
75
79
  "data-multibodiedextension-frames": true,
80
+ "data-multibodiedextension-frames-id": frameId,
76
81
  ref: articleRef
77
82
  });
78
83
  };
@@ -199,6 +204,10 @@ const MultiBodiedExtensionWithWidth = ({
199
204
  formatMessage
200
205
  } = useIntl();
201
206
  const [activeChildIndex, setActiveChildIndex] = useState(0);
207
+ // Used by the gated active-frame styles to scope selection to this MBE instance.
208
+ // Editor frames sit under ProseMirror's contentDOM wrapper, so the id anchors the
209
+ // selector at the owning MBE before it reaches that wrapper and its direct frames.
210
+ const frameId = React.useId();
202
211
  // Adding to avoid aliasing `this` for the callbacks
203
212
  const updateActiveChild = React.useCallback(index => {
204
213
  if (typeof index !== 'number') {
@@ -213,9 +222,10 @@ const MultiBodiedExtensionWithWidth = ({
213
222
  }, [handleContentDOMRef]);
214
223
  const childrenContainer = React.useMemo(() => {
215
224
  return jsx(MultiBodiedExtensionFrames, {
216
- articleRef: articleRef
225
+ articleRef: articleRef,
226
+ frameId: frameId
217
227
  });
218
- }, [articleRef]);
228
+ }, [articleRef, frameId]);
219
229
  const actions = useMultiBodiedExtensionActions({
220
230
  updateActiveChild,
221
231
  editorView,
@@ -322,7 +332,7 @@ const MultiBodiedExtensionWithWidth = ({
322
332
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
323
333
  className: containerClassNames,
324
334
  css: [/* eslint-disable @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766 */
325
- getContainerCssExtendedStyles(activeChildIndex, showMacroInteractionDesignUpdates), shouldShowEmptyFramePlaceholder && getEmptyFramePlaceholderStyles(activeChildIndex, emptyFramePlaceholderText)
335
+ getContainerCssExtendedStyles(activeChildIndex, frameId, showMacroInteractionDesignUpdates), shouldShowEmptyFramePlaceholder && getEmptyFramePlaceholderStyles(activeChildIndex, frameId, emptyFramePlaceholderText)
326
336
  /* eslint-enable @atlaskit/design-system/consistent-css-prop-usage */],
327
337
  "data-testid": "multiBodiedExtension--container",
328
338
  "data-multiBodiedExtension-container": true,
@@ -14,7 +14,7 @@ const NETWORK_FAILURE_REGEX = /^network failure/i;
14
14
  const RESIZE_OBSERVER_LOOP_REGEX = /ResizeObserver loop completed with undelivered notifications/;
15
15
  const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
16
16
  const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
17
- const packageVersion = "120.2.0";
17
+ const packageVersion = "120.3.1";
18
18
  const sanitiseSentryEvents = (data, _hint) => {
19
19
  // Remove URL as it has UGC
20
20
  // Ignored via go/ees007
@@ -14,7 +14,7 @@ import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
14
14
  import { fg } from '@atlaskit/platform-feature-flags/fg';
15
15
  import Layer from '../Layer';
16
16
  const packageName = "@atlaskit/editor-common";
17
- const packageVersion = "120.2.0";
17
+ const packageVersion = "120.3.1";
18
18
  const halfFocusRing = 1;
19
19
  const dropOffset = '0, 8';
20
20
  const fadeIn = keyframes({
@@ -72,11 +72,6 @@ export var aiMessages = defineMessages({
72
72
  defaultMessage: "Ask Rovo {key}+'",
73
73
  description: 'Tooltip text for an option to use Rovo AI with quick command'
74
74
  },
75
- askRovoToolbarIconTooltipQuickCommandNewAifc: {
76
- id: 'fabric.editor.ai.toolbar.askRovo.tooltip.quickCommand.newAifc',
77
- defaultMessage: "Edit with Rovo {key}+'",
78
- description: 'Tooltip text for the Rovo AI entry-point button in the new AIFC editor experience, where the button is labelled "Edit", with quick command'
79
- },
80
75
  askRovoToolbarRemixAppTooltipQuickCommand: {
81
76
  id: 'fabric.editor.ai.toolbar.askRovo.remixApp.tooltip.quickCommand',
82
77
  defaultMessage: "Edit {key}+'",
@@ -19,6 +19,7 @@ import classnames from 'classnames';
19
19
  import { useIntl } from 'react-intl';
20
20
  import EditorFileIcon from '@atlaskit/icon/core/file';
21
21
  import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
22
+ import { fg } from '@atlaskit/platform-feature-flags/fg';
22
23
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
23
24
  import { useSharedPluginStateWithSelector } from '../../hooks';
24
25
  import { placeholderTextMessages } from '../../messages/placeholder-text';
@@ -29,24 +30,21 @@ import { ExtensionFloatingLabel } from '../Extension/Lozenge/ExtensionFloatingLa
29
30
  import { shouldExtensionBreakout } from '../utils/should-extension-breakout';
30
31
  import { useMultiBodiedExtensionActions } from './action-api';
31
32
  import { mbeExtensionWrapperCSSStyles, mbeExtensionWrapperCSSStylesOld, overlayStyles, overlayStylesOld } from './styles';
32
- var getContainerCssExtendedStyles = function getContainerCssExtendedStyles(activeChildIndex, showMacroInteractionDesignUpdates) {
33
- return (
34
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
35
- css(sharedMultiBodiedExtensionStyles.mbeExtensionContainer, _defineProperty({}, ".multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(".concat(activeChildIndex + 1
36
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
37
- , ")"), css(
38
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
39
- sharedMultiBodiedExtensionStyles.extensionFrameContent,
40
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
41
- showMacroInteractionDesignUpdates && removeMarginsAndBorder)))
42
- );
33
+ var getContainerCssExtendedStyles = function getContainerCssExtendedStyles(activeChildIndex, frameId, showMacroInteractionDesignUpdates) {
34
+ var activeFrameSelector = fg('platform_editor_nested_mbe_frames') ? "[data-multibodiedextension-frames-id='".concat(frameId, "'] > .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(").concat(activeChildIndex + 1, ")") : ".multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(".concat(activeChildIndex + 1, ")");
35
+
36
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
37
+ return css(sharedMultiBodiedExtensionStyles.mbeExtensionContainer, _defineProperty({}, activeFrameSelector, css(
38
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
39
+ sharedMultiBodiedExtensionStyles.extensionFrameContent,
40
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
41
+ showMacroInteractionDesignUpdates && removeMarginsAndBorder)));
43
42
  };
44
43
 
45
44
  // Renders a visual placeholder when the active frame contains a single empty paragraph.
46
- var getEmptyFramePlaceholderStyles = function getEmptyFramePlaceholderStyles(activeChildIndex, placeholderText) {
47
- return css(_defineProperty({}, "& .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(".concat(activeChildIndex + 1
48
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
49
- , ") > p:only-child:has(> .ProseMirror-trailingBreak):not(:has(> :not(.ProseMirror-widget):not(.ProseMirror-separator):not(.ProseMirror-trailingBreak)))::before"), {
45
+ var getEmptyFramePlaceholderStyles = function getEmptyFramePlaceholderStyles(activeChildIndex, frameId, placeholderText) {
46
+ var activeFramePlaceholderSelector = fg('platform_editor_nested_mbe_frames') ? "& [data-multibodiedextension-frames-id='".concat(frameId, "'] > .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(").concat(activeChildIndex + 1, ") > p:only-child:has(> .ProseMirror-trailingBreak):not(:has(> :not(.ProseMirror-widget):not(.ProseMirror-separator):not(.ProseMirror-trailingBreak)))::before") : "& .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true']:nth-of-type(".concat(activeChildIndex + 1, ") > p:only-child:has(> .ProseMirror-trailingBreak):not(:has(> :not(.ProseMirror-widget):not(.ProseMirror-separator):not(.ProseMirror-trailingBreak)))::before");
47
+ return css(_defineProperty({}, activeFramePlaceholderSelector, {
50
48
  color: "var(--ds-text-subtlest, #6B6E76)",
51
49
  // JSON.stringify produces a quoted and escaped CSS string.
52
50
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
@@ -70,12 +68,14 @@ var hoverStylesOld = css({
70
68
  }
71
69
  });
72
70
  var MultiBodiedExtensionFrames = function MultiBodiedExtensionFrames(_ref) {
73
- var articleRef = _ref.articleRef;
71
+ var articleRef = _ref.articleRef,
72
+ frameId = _ref.frameId;
74
73
  return jsx("article", {
75
74
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
76
75
  className: "multiBodiedExtension--frames",
77
76
  "data-testid": "multiBodiedExtension--frames",
78
77
  "data-multibodiedextension-frames": true,
78
+ "data-multibodiedextension-frames-id": frameId,
79
79
  ref: articleRef
80
80
  });
81
81
  };
@@ -205,6 +205,10 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref2
205
205
  _useState4 = _slicedToArray(_useState3, 2),
206
206
  activeChildIndex = _useState4[0],
207
207
  setActiveChildIndex = _useState4[1];
208
+ // Used by the gated active-frame styles to scope selection to this MBE instance.
209
+ // Editor frames sit under ProseMirror's contentDOM wrapper, so the id anchors the
210
+ // selector at the owning MBE before it reaches that wrapper and its direct frames.
211
+ var frameId = React.useId();
208
212
  // Adding to avoid aliasing `this` for the callbacks
209
213
  var updateActiveChild = React.useCallback(function (index) {
210
214
  if (typeof index !== 'number') {
@@ -219,9 +223,10 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref2
219
223
  }, [handleContentDOMRef]);
220
224
  var childrenContainer = React.useMemo(function () {
221
225
  return jsx(MultiBodiedExtensionFrames, {
222
- articleRef: articleRef
226
+ articleRef: articleRef,
227
+ frameId: frameId
223
228
  });
224
- }, [articleRef]);
229
+ }, [articleRef, frameId]);
225
230
  var actions = useMultiBodiedExtensionActions({
226
231
  updateActiveChild: updateActiveChild,
227
232
  editorView: editorView,
@@ -333,7 +338,7 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref2
333
338
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
334
339
  className: containerClassNames,
335
340
  css: [/* eslint-disable @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766 */
336
- getContainerCssExtendedStyles(activeChildIndex, showMacroInteractionDesignUpdates), shouldShowEmptyFramePlaceholder && getEmptyFramePlaceholderStyles(activeChildIndex, emptyFramePlaceholderText)
341
+ getContainerCssExtendedStyles(activeChildIndex, frameId, showMacroInteractionDesignUpdates), shouldShowEmptyFramePlaceholder && getEmptyFramePlaceholderStyles(activeChildIndex, frameId, emptyFramePlaceholderText)
337
342
  /* eslint-enable @atlaskit/design-system/consistent-css-prop-usage */],
338
343
  "data-testid": "multiBodiedExtension--container",
339
344
  "data-multiBodiedExtension-container": true,
@@ -20,7 +20,7 @@ var NETWORK_FAILURE_REGEX = /^network failure/i;
20
20
  var RESIZE_OBSERVER_LOOP_REGEX = /ResizeObserver loop completed with undelivered notifications/;
21
21
  var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
22
22
  var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
23
- var packageVersion = "120.2.0";
23
+ var packageVersion = "120.3.1";
24
24
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
25
25
  // Remove URL as it has UGC
26
26
  // Ignored via go/ees007
@@ -21,7 +21,7 @@ import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
21
21
  import { fg } from '@atlaskit/platform-feature-flags/fg';
22
22
  import Layer from '../Layer';
23
23
  var packageName = "@atlaskit/editor-common";
24
- var packageVersion = "120.2.0";
24
+ var packageVersion = "120.3.1";
25
25
  var halfFocusRing = 1;
26
26
  var dropOffset = '0, 8';
27
27
  var fadeIn = keyframes({
@@ -74,11 +74,6 @@ export declare const aiMessages: {
74
74
  description: string;
75
75
  id: string;
76
76
  };
77
- askRovoToolbarIconTooltipQuickCommandNewAifc: {
78
- defaultMessage: string;
79
- description: string;
80
- id: string;
81
- };
82
77
  askRovoToolbarImageTitle: {
83
78
  defaultMessage: string;
84
79
  description: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-common",
3
- "version": "120.3.0",
3
+ "version": "120.3.2",
4
4
  "description": "A package that contains common classes and components for editor and renderer",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -29,7 +29,7 @@
29
29
  },
30
30
  "dependencies": {
31
31
  "@atlaskit/activity-provider": "^3.0.0",
32
- "@atlaskit/adf-schema": "^57.1.0",
32
+ "@atlaskit/adf-schema": "^57.2.0",
33
33
  "@atlaskit/adf-utils": "^20.7.0",
34
34
  "@atlaskit/afm-i18n-platform-editor-editor-common": "2.200.0",
35
35
  "@atlaskit/analytics-listeners": "^11.1.0",
@@ -39,7 +39,7 @@
39
39
  "@atlaskit/browser-apis": "^1.2.0",
40
40
  "@atlaskit/button": "^25.2.0",
41
41
  "@atlaskit/codemod-utils": "^5.0.0",
42
- "@atlaskit/css": "^1.0.0",
42
+ "@atlaskit/css": "^1.1.0",
43
43
  "@atlaskit/custom-steps": "^1.0.0",
44
44
  "@atlaskit/dropdown-menu": "^18.2.0",
45
45
  "@atlaskit/editor-json-transformer": "^9.6.0",
@@ -84,7 +84,7 @@
84
84
  "@atlaskit/task-decision": "^21.8.0",
85
85
  "@atlaskit/teams-app-config": "^3.0.0",
86
86
  "@atlaskit/textfield": "^10.1.0",
87
- "@atlaskit/tmp-editor-statsig": "^162.0.0",
87
+ "@atlaskit/tmp-editor-statsig": "^163.0.0",
88
88
  "@atlaskit/tokens": "^16.8.0",
89
89
  "@atlaskit/tooltip": "^24.2.0",
90
90
  "@atlaskit/width-detector": "^7.1.0",
@@ -138,7 +138,6 @@
138
138
  "@types/markdown-it": "^14.1.2",
139
139
  "@types/raf-schd": "^4.0.1",
140
140
  "@types/react-virtualized": "^9.18.12",
141
- "enzyme": "^3.10.0",
142
141
  "raf-stub": "^2.0.1",
143
142
  "react": "^19.2.0",
144
143
  "react-dom": "^19.2.0",
@@ -173,6 +172,9 @@
173
172
  "type": "boolean",
174
173
  "referenceOnly": true
175
174
  },
175
+ "platform_editor_nested_mbe_frames": {
176
+ "type": "boolean"
177
+ },
176
178
  "platform_editor_adf_validator_stage0": {
177
179
  "type": "boolean",
178
180
  "referenceOnly": true