@atlaskit/editor-common 106.9.2 → 106.10.0

package/CHANGELOG.md

@@ -1,5 +1,31 @@
 # @atlaskit/editor-common
 
+## 106.10.0
+
+### Minor Changes
+
+- [#173259](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/173259)
+  [`8c7a6909826be`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8c7a6909826be) -
+  Add new Changed Breakout Mode event and hook it up to breakout button
+
+### Patch Changes
+
+- [#172707](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/172707)
+  [`52f6fc286190c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/52f6fc286190c) -
+  [ux] Reserve minimum height for extension nodes behind a feature gate.
+- [#171695](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/171695)
+  [`665ba0151dbd5`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/665ba0151dbd5) -
+  Fixed copy "new editor" -> "cloud editor"
+- Updated dependencies
+
+## 106.9.3
+
+### Patch Changes
+
+- [#171657](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/171657)
+  [`cb6c865095af1`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/cb6c865095af1) -
+  Clean-up platform_editor_lcm_nested_panel_icon_fix
+
 ## 106.9.2
 
 ### Patch Changes

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

@@ -25,6 +25,7 @@ var ACTION = exports.ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["CHANGED_ICON"] = "changedIcon";
   ACTION["CHANGED_FULL_WIDTH_MODE"] = "changedFullWidthMode";
   ACTION["CHANGED_LAYOUT"] = "changedLayout";
+  ACTION["CHANGED_BREAKOUT_MODE"] = "changedBreakoutMode";
   ACTION["CHANGED_REPLACEMENT_TEXT"] = "changedReplacementText";
   ACTION["CHANGED_TYPE"] = "changedType";
   ACTION["CHANGED_URL"] = "changedUrl";

package/dist/cjs/extensibility/extensionNodeView.js

@@ -10,6 +10,7 @@ var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/cl
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _get2 = _interopRequireDefault(require("@babel/runtime/helpers/get"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _react = _interopRequireDefault(require("react"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
@@ -18,6 +19,7 @@ var _Extension = require("./Extension");
 var _ExtensionNodeWrapper = require("./ExtensionNodeWrapper");
 function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function _superPropGet(t, o, e, r) { var p = (0, _get2.default)((0, _getPrototypeOf2.default)(1 & r ? t.prototype : t), o, e); return 2 & r && "function" == typeof p ? function (t) { return p.apply(e, t); } : p; }
 // getInlineNodeViewProducer is a new api to use instead of ReactNodeView
 // when creating inline node views, however, it is difficult to test the impact
 // on selections when migrating inlineExtension to use the new api.
@@ -39,6 +41,26 @@ var ExtensionNode = exports.ExtensionNode = /*#__PURE__*/function (_ReactNodeVie
       return this.node.type.isAtom || mutation.type !== 'selection' && mutation.attributeName !== 'data-layout';
     }
 
+    // Reserve height by setting a minimum height for the extension node view element
+  }, {
+    key: "createDomRef",
+    value: function createDomRef() {
+      if (!(0, _platformFeatureFlags.fg)('confluence_connect_macro_preset_height')) {
+        return _superPropGet(ExtensionNode, "createDomRef", this, 3)([]);
+      }
+      if (!this.node.isInline) {
+        var _this$reactComponentP, _this$reactComponentP2;
+        var _htmlElement = document.createElement('div');
+        var extensionHeight = (_this$reactComponentP = this.reactComponentProps) === null || _this$reactComponentP === void 0 || (_this$reactComponentP = _this$reactComponentP.extensionNodeViewOptions) === null || _this$reactComponentP === void 0 || (_this$reactComponentP2 = _this$reactComponentP.getExtensionHeight) === null || _this$reactComponentP2 === void 0 ? void 0 : _this$reactComponentP2.call(_this$reactComponentP, this.node);
+        if (extensionHeight) {
+          _htmlElement.style.setProperty('min-height', "".concat(extensionHeight, "px"));
+        }
+        return _htmlElement;
+      }
+      var htmlElement = document.createElement('span');
+      return htmlElement;
+    }
+
     /**
      * When interacting with input elements inside an extension's body, the events
      * bubble up to the editor and get handled by it. This almost always gets in the way

package/dist/cjs/messages/insert-block.js

@@ -133,7 +133,7 @@ var toolbarInsertBlockMessages = exports.toolbarInsertBlockMessages = (0, _react
   },
   feedbackDialogDescription: {
     id: 'fabric.editor.feedbackDialog.description',
-    defaultMessage: 'Tell us about your experience using the new editor',
+    defaultMessage: 'Tell us about your experience using the cloud editor',
     description: 'Description for feedback option under quick insert dropdown'
   },
   horizontalRule: {

package/dist/cjs/monitoring/error.js

@@ -16,7 +16,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 = "106.9.2";
+var packageVersion = "106.10.0";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/cjs/styles/shared/panel.js

@@ -136,11 +136,7 @@ var PanelSharedSelectors = exports.PanelSharedSelectors = {
   copyButton: "button[aria-label=\"Copy\"]"
 };
 var getIconStyles = function getIconStyles(panelType) {
-  if ((0, _platformFeatureFlags.fg)('platform_editor_lcm_nested_panel_icon_fix')) {
-    return "\n\t\t\t.".concat(PanelSharedCssClassName.icon, "[data-panel-type='").concat(panelType, "'] {\n\t\t\t\tcolor: ").concat(lightIconColor[panelType], ";\n\t\t\t}\n\t\t");
-  } else {
-    return "\n\t\t\t.".concat(PanelSharedCssClassName.icon, " {\n\t\t\t\tcolor: ").concat(lightIconColor[panelType], ";\n\t\t\t}\n\t\t");
-  }
+  return "\n\t\t.".concat(PanelSharedCssClassName.icon, "[data-panel-type='").concat(panelType, "'] {\n\t\t\tcolor: ").concat(lightIconColor[panelType], ";\n\t\t}\n\t");
 };
 
 // Provides the color without tokens, used when converting to a custom panel

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

@@ -23,7 +23,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 = "106.9.2";
+var packageVersion = "106.10.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 // Ignored via go/ees005

package/dist/cjs/ui-menu/Dropdown/index.js

@@ -137,7 +137,7 @@ var Dropdown = exports.Dropdown = /*#__PURE__*/function (_PureComponent) {
         isOpen: true,
         onOpenChange: onOpenChange,
         position: popupPlacement.join(' '),
-        shouldFitContainer: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_6') ? shouldFitContainer : true,
+        shouldFitContainer: shouldFitContainer,
         id: dropdownListId
       }, children))));
     }

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

@@ -19,6 +19,7 @@ export let ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["CHANGED_ICON"] = "changedIcon";
   ACTION["CHANGED_FULL_WIDTH_MODE"] = "changedFullWidthMode";
   ACTION["CHANGED_LAYOUT"] = "changedLayout";
+  ACTION["CHANGED_BREAKOUT_MODE"] = "changedBreakoutMode";
   ACTION["CHANGED_REPLACEMENT_TEXT"] = "changedReplacementText";
   ACTION["CHANGED_TYPE"] = "changedType";
   ACTION["CHANGED_URL"] = "changedUrl";

package/dist/es2019/extensibility/extensionNodeView.js

@@ -17,6 +17,24 @@ export class ExtensionNode extends ReactNodeView {
     return this.node.type.isAtom || mutation.type !== 'selection' && mutation.attributeName !== 'data-layout';
   }
 
+  // Reserve height by setting a minimum height for the extension node view element
+  createDomRef() {
+    if (!fg('confluence_connect_macro_preset_height')) {
+      return super.createDomRef();
+    }
+    if (!this.node.isInline) {
+      var _this$reactComponentP, _this$reactComponentP2, _this$reactComponentP3;
+      const htmlElement = document.createElement('div');
+      const extensionHeight = (_this$reactComponentP = this.reactComponentProps) === null || _this$reactComponentP === void 0 ? void 0 : (_this$reactComponentP2 = _this$reactComponentP.extensionNodeViewOptions) === null || _this$reactComponentP2 === void 0 ? void 0 : (_this$reactComponentP3 = _this$reactComponentP2.getExtensionHeight) === null || _this$reactComponentP3 === void 0 ? void 0 : _this$reactComponentP3.call(_this$reactComponentP2, this.node);
+      if (extensionHeight) {
+        htmlElement.style.setProperty('min-height', `${extensionHeight}px`);
+      }
+      return htmlElement;
+    }
+    const htmlElement = document.createElement('span');
+    return htmlElement;
+  }
+
   /**
    * When interacting with input elements inside an extension's body, the events
    * bubble up to the editor and get handled by it. This almost always gets in the way

package/dist/es2019/messages/insert-block.js

@@ -127,7 +127,7 @@ export const toolbarInsertBlockMessages = defineMessages({
   },
   feedbackDialogDescription: {
     id: 'fabric.editor.feedbackDialog.description',
-    defaultMessage: 'Tell us about your experience using the new editor',
+    defaultMessage: 'Tell us about your experience using the cloud editor',
     description: 'Description for feedback option under quick insert dropdown'
   },
   horizontalRule: {

package/dist/es2019/monitoring/error.js

@@ -1,7 +1,7 @@
 import { isFedRamp } from './environment';
 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 = "106.9.2";
+const packageVersion = "106.10.0";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/es2019/styles/shared/panel.js

@@ -129,19 +129,11 @@ export const PanelSharedSelectors = {
   copyButton: `button[aria-label="Copy"]`
 };
 const getIconStyles = panelType => {
-  if (fg('platform_editor_lcm_nested_panel_icon_fix')) {
-    return `
-			.${PanelSharedCssClassName.icon}[data-panel-type='${panelType}'] {
-				color: ${lightIconColor[panelType]};
-			}
-		`;
-  } else {
-    return `
-			.${PanelSharedCssClassName.icon} {
-				color: ${lightIconColor[panelType]};
-			}
-		`;
-  }
+  return `
+		.${PanelSharedCssClassName.icon}[data-panel-type='${panelType}'] {
+			color: ${lightIconColor[panelType]};
+		}
+	`;
 };
 
 // Provides the color without tokens, used when converting to a custom panel

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

@@ -13,7 +13,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
 import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
 import Layer from '../Layer';
 const packageName = "@atlaskit/editor-common";
-const packageVersion = "106.9.2";
+const packageVersion = "106.10.0";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 // Ignored via go/ees005

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

@@ -112,7 +112,7 @@ export class Dropdown extends PureComponent {
       isOpen: true,
       onOpenChange: onOpenChange,
       position: popupPlacement.join(' '),
-      shouldFitContainer: fg('platform_editor_controls_patch_6') ? shouldFitContainer : true,
+      shouldFitContainer: shouldFitContainer,
       id: dropdownListId
     }, children))));
   }

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

@@ -19,6 +19,7 @@ export var ACTION = /*#__PURE__*/function (ACTION) {
   ACTION["CHANGED_ICON"] = "changedIcon";
   ACTION["CHANGED_FULL_WIDTH_MODE"] = "changedFullWidthMode";
   ACTION["CHANGED_LAYOUT"] = "changedLayout";
+  ACTION["CHANGED_BREAKOUT_MODE"] = "changedBreakoutMode";
   ACTION["CHANGED_REPLACEMENT_TEXT"] = "changedReplacementText";
   ACTION["CHANGED_TYPE"] = "changedType";
   ACTION["CHANGED_URL"] = "changedUrl";

package/dist/esm/extensibility/extensionNodeView.js

@@ -2,9 +2,11 @@ import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _get from "@babel/runtime/helpers/get";
 import _inherits from "@babel/runtime/helpers/inherits";
 function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function _superPropGet(t, o, e, r) { var p = _get(_getPrototypeOf(1 & r ? t.prototype : t), o, e); return 2 & r && "function" == typeof p ? function (t) { return p.apply(e, t); } : p; }
 import React from 'react';
 import { fg } from '@atlaskit/platform-feature-flags';
 import ReactNodeView from '../react-node-view';
@@ -31,6 +33,26 @@ export var ExtensionNode = /*#__PURE__*/function (_ReactNodeView) {
       return this.node.type.isAtom || mutation.type !== 'selection' && mutation.attributeName !== 'data-layout';
     }
 
+    // Reserve height by setting a minimum height for the extension node view element
+  }, {
+    key: "createDomRef",
+    value: function createDomRef() {
+      if (!fg('confluence_connect_macro_preset_height')) {
+        return _superPropGet(ExtensionNode, "createDomRef", this, 3)([]);
+      }
+      if (!this.node.isInline) {
+        var _this$reactComponentP, _this$reactComponentP2;
+        var _htmlElement = document.createElement('div');
+        var extensionHeight = (_this$reactComponentP = this.reactComponentProps) === null || _this$reactComponentP === void 0 || (_this$reactComponentP = _this$reactComponentP.extensionNodeViewOptions) === null || _this$reactComponentP === void 0 || (_this$reactComponentP2 = _this$reactComponentP.getExtensionHeight) === null || _this$reactComponentP2 === void 0 ? void 0 : _this$reactComponentP2.call(_this$reactComponentP, this.node);
+        if (extensionHeight) {
+          _htmlElement.style.setProperty('min-height', "".concat(extensionHeight, "px"));
+        }
+        return _htmlElement;
+      }
+      var htmlElement = document.createElement('span');
+      return htmlElement;
+    }
+
     /**
      * When interacting with input elements inside an extension's body, the events
      * bubble up to the editor and get handled by it. This almost always gets in the way

package/dist/esm/messages/insert-block.js

@@ -127,7 +127,7 @@ export var toolbarInsertBlockMessages = defineMessages({
   },
   feedbackDialogDescription: {
     id: 'fabric.editor.feedbackDialog.description',
-    defaultMessage: 'Tell us about your experience using the new editor',
+    defaultMessage: 'Tell us about your experience using the cloud editor',
     description: 'Description for feedback option under quick insert dropdown'
   },
   horizontalRule: {

package/dist/esm/monitoring/error.js

@@ -7,7 +7,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { isFedRamp } from './environment';
 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 = "106.9.2";
+var packageVersion = "106.10.0";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // Ignored via go/ees007

package/dist/esm/styles/shared/panel.js

@@ -127,11 +127,7 @@ export var PanelSharedSelectors = {
   copyButton: "button[aria-label=\"Copy\"]"
 };
 var getIconStyles = function getIconStyles(panelType) {
-  if (fg('platform_editor_lcm_nested_panel_icon_fix')) {
-    return "\n\t\t\t.".concat(PanelSharedCssClassName.icon, "[data-panel-type='").concat(panelType, "'] {\n\t\t\t\tcolor: ").concat(lightIconColor[panelType], ";\n\t\t\t}\n\t\t");
-  } else {
-    return "\n\t\t\t.".concat(PanelSharedCssClassName.icon, " {\n\t\t\t\tcolor: ").concat(lightIconColor[panelType], ";\n\t\t\t}\n\t\t");
-  }
+  return "\n\t\t.".concat(PanelSharedCssClassName.icon, "[data-panel-type='").concat(panelType, "'] {\n\t\t\tcolor: ").concat(lightIconColor[panelType], ";\n\t\t}\n\t");
 };
 
 // Provides the color without tokens, used when converting to a custom panel

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

@@ -20,7 +20,7 @@ import withAnalyticsContext from '@atlaskit/analytics-next/withAnalyticsContext'
 import withAnalyticsEvents from '@atlaskit/analytics-next/withAnalyticsEvents';
 import Layer from '../Layer';
 var packageName = "@atlaskit/editor-common";
-var packageVersion = "106.9.2";
+var packageVersion = "106.10.0";
 var halfFocusRing = 1;
 var dropOffset = '0, 8';
 // Ignored via go/ees005

package/dist/esm/ui-menu/Dropdown/index.js

@@ -128,7 +128,7 @@ export var Dropdown = /*#__PURE__*/function (_PureComponent) {
         isOpen: true,
         onOpenChange: onOpenChange,
         position: popupPlacement.join(' '),
-        shouldFitContainer: fg('platform_editor_controls_patch_6') ? shouldFitContainer : true,
+        shouldFitContainer: shouldFitContainer,
         id: dropdownListId
       }, children))));
     }

package/dist/types/analytics/types/breakout-events.d.ts

@@ -13,4 +13,8 @@ export type BreakoutResizedPerfSamplingAEP = OperationalAEP<ACTION.RESIZED_PERF_
     docSize: number;
     isInitialSample: boolean;
 }>;
-export type BreakoutEventPayload = BreakoutResizedAEP | BreakoutResizedPerfSamplingAEP;
+export type ChangedBreakoutModeAEP = TrackAEP<ACTION.CHANGED_BREAKOUT_MODE, ACTION_SUBJECT.ELEMENT, undefined, {
+    mode: 'center' | 'wide' | 'full-width';
+    nodeType: BreakoutSupportedNodes;
+}, undefined>;
+export type BreakoutEventPayload = BreakoutResizedAEP | BreakoutResizedPerfSamplingAEP | ChangedBreakoutModeAEP;

package/dist/types/analytics/types/enums.d.ts

@@ -18,6 +18,7 @@ export declare enum ACTION {
     CHANGED_ICON = "changedIcon",
     CHANGED_FULL_WIDTH_MODE = "changedFullWidthMode",
     CHANGED_LAYOUT = "changedLayout",
+    CHANGED_BREAKOUT_MODE = "changedBreakoutMode",
     CHANGED_REPLACEMENT_TEXT = "changedReplacementText",
     CHANGED_TYPE = "changedType",
     CHANGED_URL = "changedUrl",

package/dist/types/extensibility/extensionNodeView.d.ts

@@ -14,11 +14,22 @@ interface ExtensionNodeViewOptions {
     appearance?: EditorAppearance;
     getExtensionHeight?: GetPMNodeHeight;
 }
-export declare class ExtensionNode extends ReactNodeView {
+interface ReactExtensionNodeProps {
+    extensionNodeViewOptions?: ExtensionNodeViewOptions;
+    providerFactory: ProviderFactory;
+    extensionHandlers: ExtensionHandlers;
+    pluginInjectionApi: ExtensionsPluginInjectionAPI;
+    macroInteractionDesignFeatureFlags?: MacroInteractionDesignFeatureFlags;
+    showLivePagesBodiedMacrosRendererView?: (node: ADFEntity) => boolean;
+    showUpdatedLivePages1PBodiedExtensionUI?: (node: ADFEntity) => boolean;
+    rendererExtensionHandlers?: ExtensionHandlers;
+}
+export declare class ExtensionNode<AdditionalParams = unknown> extends ReactNodeView<ReactExtensionNodeProps & AdditionalParams> {
     ignoreMutation(mutation: MutationRecord | {
         type: 'selection';
         target: Node;
     }): boolean;
+    createDomRef(): HTMLElement;
     /**
      * When interacting with input elements inside an extension's body, the events
      * bubble up to the editor and get handled by it. This almost always gets in the way

package/dist/types-ts4.5/analytics/types/breakout-events.d.ts

@@ -13,4 +13,8 @@ export type BreakoutResizedPerfSamplingAEP = OperationalAEP<ACTION.RESIZED_PERF_
     docSize: number;
     isInitialSample: boolean;
 }>;
-export type BreakoutEventPayload = BreakoutResizedAEP | BreakoutResizedPerfSamplingAEP;
+export type ChangedBreakoutModeAEP = TrackAEP<ACTION.CHANGED_BREAKOUT_MODE, ACTION_SUBJECT.ELEMENT, undefined, {
+    mode: 'center' | 'wide' | 'full-width';
+    nodeType: BreakoutSupportedNodes;
+}, undefined>;
+export type BreakoutEventPayload = BreakoutResizedAEP | BreakoutResizedPerfSamplingAEP | ChangedBreakoutModeAEP;

package/dist/types-ts4.5/analytics/types/enums.d.ts

@@ -18,6 +18,7 @@ export declare enum ACTION {
     CHANGED_ICON = "changedIcon",
     CHANGED_FULL_WIDTH_MODE = "changedFullWidthMode",
     CHANGED_LAYOUT = "changedLayout",
+    CHANGED_BREAKOUT_MODE = "changedBreakoutMode",
     CHANGED_REPLACEMENT_TEXT = "changedReplacementText",
     CHANGED_TYPE = "changedType",
     CHANGED_URL = "changedUrl",

package/dist/types-ts4.5/extensibility/extensionNodeView.d.ts

@@ -14,11 +14,22 @@ interface ExtensionNodeViewOptions {
     appearance?: EditorAppearance;
     getExtensionHeight?: GetPMNodeHeight;
 }
-export declare class ExtensionNode extends ReactNodeView {
+interface ReactExtensionNodeProps {
+    extensionNodeViewOptions?: ExtensionNodeViewOptions;
+    providerFactory: ProviderFactory;
+    extensionHandlers: ExtensionHandlers;
+    pluginInjectionApi: ExtensionsPluginInjectionAPI;
+    macroInteractionDesignFeatureFlags?: MacroInteractionDesignFeatureFlags;
+    showLivePagesBodiedMacrosRendererView?: (node: ADFEntity) => boolean;
+    showUpdatedLivePages1PBodiedExtensionUI?: (node: ADFEntity) => boolean;
+    rendererExtensionHandlers?: ExtensionHandlers;
+}
+export declare class ExtensionNode<AdditionalParams = unknown> extends ReactNodeView<ReactExtensionNodeProps & AdditionalParams> {
     ignoreMutation(mutation: MutationRecord | {
         type: 'selection';
         target: Node;
     }): boolean;
+    createDomRef(): HTMLElement;
     /**
      * When interacting with input elements inside an extension's body, the events
      * bubble up to the editor and get handled by it. This almost always gets in the way

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "106.9.2",
+	"version": "106.10.0",
 	"description": "A package that contains common classes and components for editor and renderer",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -134,7 +134,7 @@
 		"@atlaskit/codemod-utils": "^4.2.0",
 		"@atlaskit/css": "^0.10.0",
 		"@atlaskit/custom-steps": "^0.11.0",
-		"@atlaskit/dropdown-menu": "^16.0.0",
+		"@atlaskit/dropdown-menu": "^16.1.0",
 		"@atlaskit/editor-json-transformer": "^8.24.0",
 		"@atlaskit/editor-palette": "^2.1.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
@@ -147,13 +147,13 @@
 		"@atlaskit/link-datasource": "^4.11.0",
 		"@atlaskit/link-picker": "^3.5.0",
 		"@atlaskit/media-card": "^79.3.0",
-		"@atlaskit/media-client": "^33.4.0",
+		"@atlaskit/media-client": "^33.5.0",
 		"@atlaskit/media-client-react": "^4.1.0",
 		"@atlaskit/media-common": "^12.2.0",
 		"@atlaskit/media-file-preview": "^0.11.0",
 		"@atlaskit/media-picker": "^69.0.0",
 		"@atlaskit/media-ui": "^28.3.0",
-		"@atlaskit/media-viewer": "^52.2.0",
+		"@atlaskit/media-viewer": "^52.3.0",
 		"@atlaskit/mention": "^24.2.0",
 		"@atlaskit/menu": "^8.0.0",
 		"@atlaskit/onboarding": "^14.2.0",
@@ -164,7 +164,7 @@
 		"@atlaskit/profilecard": "^23.19.0",
 		"@atlaskit/react-ufo": "^3.13.0",
 		"@atlaskit/section-message": "^8.2.0",
-		"@atlaskit/smart-card": "^38.9.0",
+		"@atlaskit/smart-card": "^38.10.0",
 		"@atlaskit/smart-user-picker": "^8.0.0",
 		"@atlaskit/spinner": "^18.0.0",
 		"@atlaskit/task-decision": "^19.2.0",
@@ -320,9 +320,6 @@
 		"platform_editor_controls_patch_3": {
 			"type": "boolean"
 		},
-		"platform_editor_controls_patch_6": {
-			"type": "boolean"
-		},
 		"platform_editor_lcm_nested_panel_icon_fix": {
 			"type": "boolean"
 		},
@@ -389,6 +386,9 @@
 		"platform_editor_fix_floating_toolbar_focus": {
 			"type": "boolean"
 		},
+		"confluence_connect_macro_preset_height": {
+			"type": "boolean"
+		},
 		"platform_editor_breakout_resizing_hello_release": {
 			"type": "boolean"
 		},