@atlaskit/editor-common 99.8.1 → 99.9.1

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/editor-common
 
+## 99.9.1
+
+### Patch Changes
+
+- Updated dependencies
+
+## 99.9.0
+
+### Minor Changes
+
+- [#108912](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/108912)
+  [`4f43a6293679e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/4f43a6293679e) -
+  [ux] Adds logic to hide macro interactions during view mode of live pages
+
 ## 99.8.1
 
 ### Patch Changes

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

@@ -51,7 +51,8 @@ function ExtensionWithPluginState(props) {
     showUpdatedLivePages1PBodiedExtensionUI = props.showUpdatedLivePages1PBodiedExtensionUI,
     showBodiedExtensionRendererView = props.showBodiedExtensionRendererView,
     setShowBodiedExtensionRendererView = props.setShowBodiedExtensionRendererView,
-    pluginInjectionApi = props.pluginInjectionApi;
+    pluginInjectionApi = props.pluginInjectionApi,
+    isLivePageViewMode = props.isLivePageViewMode;
   var _ref = macroInteractionDesignFeatureFlags || {},
     showMacroInteractionDesignUpdates = _ref.showMacroInteractionDesignUpdates;
   var hasBody = ['bodiedExtension', 'multiBodiedExtension'].includes(node.type.name);
@@ -120,7 +121,7 @@ function ExtensionWithPluginState(props) {
       setIsNodeHovered(didHover);
     }
   };
-  return (0, _react2.jsx)(_react.Fragment, null, showMacroInteractionDesignUpdates && (0, _react2.jsx)(_Lozenge.default, {
+  return (0, _react2.jsx)(_react.Fragment, null, showMacroInteractionDesignUpdates && !isLivePageViewMode && (0, _react2.jsx)(_Lozenge.default, {
     isNodeSelected: isNodeSelected,
     isNodeHovered: isNodeHovered,
     isNodeNested: isNodeNested,

package/dist/cjs/extensibility/Extension/InlineExtension/index.js

@@ -31,7 +31,8 @@ var InlineExtension = function InlineExtension(props) {
     isNodeSelected = props.isNodeSelected,
     children = props.children,
     isNodeHovered = props.isNodeHovered,
-    setIsNodeHovered = props.setIsNodeHovered;
+    setIsNodeHovered = props.setIsNodeHovered,
+    isLivePageViewMode = props.isLivePageViewMode;
   var _ref = macroInteractionDesignFeatureFlags || {},
     showMacroInteractionDesignUpdates = _ref.showMacroInteractionDesignUpdates;
   var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['width']),
@@ -49,7 +50,7 @@ var InlineExtension = function InlineExtension(props) {
       setIsNodeHovered(didHover);
     }
   };
-  var inlineExtensionInternal = (0, _react2.jsx)(_react.Fragment, null, showMacroInteractionDesignUpdates && (0, _react2.jsx)(_Lozenge.default, {
+  var inlineExtensionInternal = (0, _react2.jsx)(_react.Fragment, null, showMacroInteractionDesignUpdates && !isLivePageViewMode && (0, _react2.jsx)(_Lozenge.default, {
     node: node,
     isNodeSelected: isNodeSelected,
     isNodeHovered: isNodeHovered,

package/dist/cjs/extensibility/Extension.js

@@ -27,6 +27,7 @@ var Extension = exports.Extension = /*#__PURE__*/function (_Component) {
     (0, _classCallCheck2.default)(this, Extension);
     _this = _callSuper(this, Extension, [props]);
     (0, _defineProperty2.default)(_this, "renderWithProvider", function (_ref) {
+      var _pluginInjectionApi$e;
       var extensionProvider = _ref.extensionProvider;
       var _this$props = _this.props,
         node = _this$props.node,
@@ -42,6 +43,14 @@ var Extension = exports.Extension = /*#__PURE__*/function (_Component) {
         showLivePagesBodiedMacrosRendererView = _this$props.showLivePagesBodiedMacrosRendererView,
         showUpdatedLivePages1PBodiedExtensionUI = _this$props.showUpdatedLivePages1PBodiedExtensionUI,
         rendererExtensionHandlers = _this$props.rendererExtensionHandlers;
+
+      // Extensions are not yet using the new plugin architecture, and the use of the pluginInjectionApi
+      // is not type safe in editor-common.
+      // @ts-ignore
+      var currentState = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$e = pluginInjectionApi.editorViewMode) === null || _pluginInjectionApi$e === void 0 || (_pluginInjectionApi$e = _pluginInjectionApi$e.sharedState) === null || _pluginInjectionApi$e === void 0 ? void 0 : _pluginInjectionApi$e.currentState();
+      var _ref2 = currentState || {},
+        contentMode = _ref2.contentMode;
+      var isLivePageViewMode = contentMode === 'live-view';
       return /*#__PURE__*/_react.default.createElement(_ExtensionComponent.ExtensionComponent, {
         editorView: editorView,
         node: node,
@@ -56,7 +65,8 @@ var Extension = exports.Extension = /*#__PURE__*/function (_Component) {
         macroInteractionDesignFeatureFlags: macroInteractionDesignFeatureFlags,
         showLivePagesBodiedMacrosRendererView: showLivePagesBodiedMacrosRendererView,
         showUpdatedLivePages1PBodiedExtensionUI: showUpdatedLivePages1PBodiedExtensionUI,
-        rendererExtensionHandlers: rendererExtensionHandlers
+        rendererExtensionHandlers: rendererExtensionHandlers,
+        isLivePageViewMode: isLivePageViewMode
       });
     });
     _this.providerFactory = props.providerFactory || new _providerFactory.ProviderFactory();

package/dist/cjs/extensibility/ExtensionComponent.js

@@ -58,9 +58,12 @@ var ExtensionComponentOld = exports.ExtensionComponentOld = /*#__PURE__*/functio
     (0, _defineProperty2.default)(_this, "getNodeRenderer", (0, _memoizeOne.default)(_extensions.getNodeRenderer));
     (0, _defineProperty2.default)(_this, "getExtensionModuleNodePrivateProps", (0, _memoizeOne.default)(_extensions.getExtensionModuleNodePrivateProps));
     (0, _defineProperty2.default)(_this, "setIsNodeHovered", function (isHovered) {
-      _this.setState({
-        isNodeHovered: isHovered
-      });
+      // Don't want to show hover interactions for live page view mode
+      if (!_this.props.isLivePageViewMode) {
+        _this.setState({
+          isNodeHovered: isHovered
+        });
+      }
     });
     (0, _defineProperty2.default)(_this, "setShowBodiedExtensionRendererView", function (showRendererView) {
       _this.setState({
@@ -249,7 +252,8 @@ var ExtensionComponentOld = exports.ExtensionComponentOld = /*#__PURE__*/functio
         eventDispatcher = _this$props3.eventDispatcher,
         macroInteractionDesignFeatureFlags = _this$props3.macroInteractionDesignFeatureFlags,
         showLivePagesBodiedMacrosRendererView = _this$props3.showLivePagesBodiedMacrosRendererView,
-        showUpdatedLivePages1PBodiedExtensionUI = _this$props3.showUpdatedLivePages1PBodiedExtensionUI;
+        showUpdatedLivePages1PBodiedExtensionUI = _this$props3.showUpdatedLivePages1PBodiedExtensionUI,
+        isLivePageViewMode = _this$props3.isLivePageViewMode;
       var selection = editorView.state.selection;
       var selectedNode = selection instanceof _state.NodeSelection && selection.node;
       var position = typeof getPos === 'function' && getPos();
@@ -269,7 +273,8 @@ var ExtensionComponentOld = exports.ExtensionComponentOld = /*#__PURE__*/functio
           isNodeSelected: selectedNode === node,
           isNodeNested: isNodeNested,
           isNodeHovered: this.state.isNodeHovered,
-          setIsNodeHovered: this.setIsNodeHovered
+          setIsNodeHovered: this.setIsNodeHovered,
+          isLivePageViewMode: isLivePageViewMode
         });
       }
       var extensionHandlerResult = this.tryExtensionHandler(undefined);
@@ -294,7 +299,8 @@ var ExtensionComponentOld = exports.ExtensionComponentOld = /*#__PURE__*/functio
             showLivePagesBodiedMacrosRendererView: !!(showLivePagesBodiedMacrosRendererView !== null && showLivePagesBodiedMacrosRendererView !== void 0 && showLivePagesBodiedMacrosRendererView((0, _utils.nodeToJSON)(node))),
             showUpdatedLivePages1PBodiedExtensionUI: !!(showUpdatedLivePages1PBodiedExtensionUI !== null && showUpdatedLivePages1PBodiedExtensionUI !== void 0 && showUpdatedLivePages1PBodiedExtensionUI((0, _utils.nodeToJSON)(node))),
             showBodiedExtensionRendererView: this.state.showBodiedExtensionRendererView,
-            setShowBodiedExtensionRendererView: this.setShowBodiedExtensionRendererView
+            setShowBodiedExtensionRendererView: this.setShowBodiedExtensionRendererView,
+            isLivePageViewMode: isLivePageViewMode
           }, extensionHandlerResult);
         case 'inlineExtension':
           return /*#__PURE__*/_react.default.createElement(_InlineExtension.default, {
@@ -303,7 +309,8 @@ var ExtensionComponentOld = exports.ExtensionComponentOld = /*#__PURE__*/functio
             isNodeSelected: selectedNode === node,
             pluginInjectionApi: pluginInjectionApi,
             isNodeHovered: this.state.isNodeHovered,
-            setIsNodeHovered: this.setIsNodeHovered
+            setIsNodeHovered: this.setIsNodeHovered,
+            isLivePageViewMode: isLivePageViewMode
           }, extensionHandlerResult);
         default:
           return null;
@@ -380,9 +387,12 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component2) {
     (0, _defineProperty2.default)(_this2, "getNodeRenderer", (0, _memoizeOne.default)(_extensions.getNodeRenderer));
     (0, _defineProperty2.default)(_this2, "getExtensionModuleNodePrivateProps", (0, _memoizeOne.default)(_extensions.getExtensionModuleNodePrivateProps));
     (0, _defineProperty2.default)(_this2, "setIsNodeHovered", function (isHovered) {
-      _this2.setState({
-        isNodeHovered: isHovered
-      });
+      // Don't want to show hover interactions for live page view mode
+      if (!_this2.props.isLivePageViewMode) {
+        _this2.setState({
+          isNodeHovered: isHovered
+        });
+      }
     });
     /**
      * Parses any private nodes once an extension provider is available.
@@ -518,7 +528,8 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component2) {
         showLivePagesBodiedMacrosRendererView = _this$props4.showLivePagesBodiedMacrosRendererView,
         showUpdatedLivePages1PBodiedExtensionUI = _this$props4.showUpdatedLivePages1PBodiedExtensionUI,
         showBodiedExtensionRendererView = _this$props4.showBodiedExtensionRendererView,
-        setShowBodiedExtensionRendererView = _this$props4.setShowBodiedExtensionRendererView;
+        setShowBodiedExtensionRendererView = _this$props4.setShowBodiedExtensionRendererView,
+        isLivePageViewMode = _this$props4.isLivePageViewMode;
       var selection = editorView.state.selection;
       var selectedNode = selection instanceof _state.NodeSelection && selection.node;
       var position = typeof getPos === 'function' && getPos();
@@ -538,7 +549,8 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component2) {
           isNodeSelected: selectedNode === node,
           isNodeNested: isNodeNested,
           isNodeHovered: this.state.isNodeHovered,
-          setIsNodeHovered: this.setIsNodeHovered
+          setIsNodeHovered: this.setIsNodeHovered,
+          isLivePageViewMode: isLivePageViewMode
         });
       }
       var extensionHandlerResult = this.tryExtensionHandler(undefined);
@@ -563,7 +575,8 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component2) {
             showLivePagesBodiedMacrosRendererView: !!(showLivePagesBodiedMacrosRendererView !== null && showLivePagesBodiedMacrosRendererView !== void 0 && showLivePagesBodiedMacrosRendererView((0, _utils.nodeToJSON)(node))),
             showUpdatedLivePages1PBodiedExtensionUI: !!(showUpdatedLivePages1PBodiedExtensionUI !== null && showUpdatedLivePages1PBodiedExtensionUI !== void 0 && showUpdatedLivePages1PBodiedExtensionUI((0, _utils.nodeToJSON)(node))),
             showBodiedExtensionRendererView: showBodiedExtensionRendererView,
-            setShowBodiedExtensionRendererView: setShowBodiedExtensionRendererView
+            setShowBodiedExtensionRendererView: setShowBodiedExtensionRendererView,
+            isLivePageViewMode: isLivePageViewMode
           }, extensionHandlerResult);
         case 'inlineExtension':
           return /*#__PURE__*/_react.default.createElement(_InlineExtension.default, {
@@ -572,7 +585,8 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component2) {
             isNodeSelected: selectedNode === node,
             pluginInjectionApi: pluginInjectionApi,
             isNodeHovered: this.state.isNodeHovered,
-            setIsNodeHovered: this.setIsNodeHovered
+            setIsNodeHovered: this.setIsNodeHovered,
+            isLivePageViewMode: isLivePageViewMode
           }, extensionHandlerResult);
         default:
           return null;

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

@@ -90,7 +90,8 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref)
     isNodeHovered = _ref.isNodeHovered,
     isNodeNested = _ref.isNodeNested,
     setIsNodeHovered = _ref.setIsNodeHovered,
-    pluginInjectionApi = _ref.pluginInjectionApi;
+    pluginInjectionApi = _ref.pluginInjectionApi,
+    isLivePageViewMode = _ref.isLivePageViewMode;
   var _ref2 = macroInteractionDesignFeatureFlags || {},
     showMacroInteractionDesignUpdates = _ref2.showMacroInteractionDesignUpdates;
   var _node$attrs = node.attrs,
@@ -164,7 +165,7 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref)
       setIsNodeHovered(didHover);
     }
   };
-  return (0, _react2.jsx)(_react.Fragment, null, showMacroInteractionDesignUpdates && (0, _react2.jsx)(_Lozenge.default, {
+  return (0, _react2.jsx)(_react.Fragment, null, showMacroInteractionDesignUpdates && !isLivePageViewMode && (0, _react2.jsx)(_Lozenge.default, {
     isNodeSelected: isNodeSelected,
     node: node,
     showMacroInteractionDesignUpdates: true,

package/dist/cjs/monitoring/error.js

@@ -17,7 +17,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 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 = "99.8.1";
+var packageVersion = "99.9.1";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

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

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

@@ -38,7 +38,8 @@ function ExtensionWithPluginState(props) {
     showUpdatedLivePages1PBodiedExtensionUI,
     showBodiedExtensionRendererView,
     setShowBodiedExtensionRendererView,
-    pluginInjectionApi
+    pluginInjectionApi,
+    isLivePageViewMode
   } = props;
   const {
     showMacroInteractionDesignUpdates
@@ -118,7 +119,7 @@ function ExtensionWithPluginState(props) {
       setIsNodeHovered(didHover);
     }
   };
-  return jsx(Fragment, null, showMacroInteractionDesignUpdates && jsx(ExtensionLozenge, {
+  return jsx(Fragment, null, showMacroInteractionDesignUpdates && !isLivePageViewMode && jsx(ExtensionLozenge, {
     isNodeSelected: isNodeSelected,
     isNodeHovered: isNodeHovered,
     isNodeNested: isNodeNested,

package/dist/es2019/extensibility/Extension/InlineExtension/index.js

@@ -21,7 +21,8 @@ const InlineExtension = props => {
     isNodeSelected,
     children,
     isNodeHovered,
-    setIsNodeHovered
+    setIsNodeHovered,
+    isLivePageViewMode
   } = props;
   const {
     showMacroInteractionDesignUpdates
@@ -42,7 +43,7 @@ const InlineExtension = props => {
       setIsNodeHovered(didHover);
     }
   };
-  const inlineExtensionInternal = jsx(Fragment, null, showMacroInteractionDesignUpdates && jsx(ExtensionLozenge, {
+  const inlineExtensionInternal = jsx(Fragment, null, showMacroInteractionDesignUpdates && !isLivePageViewMode && jsx(ExtensionLozenge, {
     node: node,
     isNodeSelected: isNodeSelected,
     isNodeHovered: isNodeHovered,

package/dist/es2019/extensibility/Extension.js

@@ -10,6 +10,7 @@ export class Extension extends Component {
     _defineProperty(this, "renderWithProvider", ({
       extensionProvider
     }) => {
+      var _pluginInjectionApi$e, _pluginInjectionApi$e2;
       const {
         node,
         getPos,
@@ -25,6 +26,15 @@ export class Extension extends Component {
         showUpdatedLivePages1PBodiedExtensionUI,
         rendererExtensionHandlers
       } = this.props;
+
+      // Extensions are not yet using the new plugin architecture, and the use of the pluginInjectionApi
+      // is not type safe in editor-common.
+      // @ts-ignore
+      const currentState = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$e = pluginInjectionApi.editorViewMode) === null || _pluginInjectionApi$e === void 0 ? void 0 : (_pluginInjectionApi$e2 = _pluginInjectionApi$e.sharedState) === null || _pluginInjectionApi$e2 === void 0 ? void 0 : _pluginInjectionApi$e2.currentState();
+      const {
+        contentMode
+      } = currentState || {};
+      const isLivePageViewMode = contentMode === 'live-view';
       return /*#__PURE__*/React.createElement(ExtensionComponent, {
         editorView: editorView,
         node: node,
@@ -39,7 +49,8 @@ export class Extension extends Component {
         macroInteractionDesignFeatureFlags: macroInteractionDesignFeatureFlags,
         showLivePagesBodiedMacrosRendererView: showLivePagesBodiedMacrosRendererView,
         showUpdatedLivePages1PBodiedExtensionUI: showUpdatedLivePages1PBodiedExtensionUI,
-        rendererExtensionHandlers: rendererExtensionHandlers
+        rendererExtensionHandlers: rendererExtensionHandlers,
+        isLivePageViewMode: isLivePageViewMode
       });
     });
     this.providerFactory = props.providerFactory || new ProviderFactory();

package/dist/es2019/extensibility/ExtensionComponent.js

@@ -33,9 +33,12 @@ export class ExtensionComponentOld extends Component {
     _defineProperty(this, "getNodeRenderer", memoizeOne(getNodeRenderer));
     _defineProperty(this, "getExtensionModuleNodePrivateProps", memoizeOne(getExtensionModuleNodePrivateProps));
     _defineProperty(this, "setIsNodeHovered", isHovered => {
-      this.setState({
-        isNodeHovered: isHovered
-      });
+      // Don't want to show hover interactions for live page view mode
+      if (!this.props.isLivePageViewMode) {
+        this.setState({
+          isNodeHovered: isHovered
+        });
+      }
     });
     _defineProperty(this, "setShowBodiedExtensionRendererView", showRendererView => {
       this.setState({
@@ -204,7 +207,8 @@ export class ExtensionComponentOld extends Component {
       eventDispatcher,
       macroInteractionDesignFeatureFlags,
       showLivePagesBodiedMacrosRendererView,
-      showUpdatedLivePages1PBodiedExtensionUI
+      showUpdatedLivePages1PBodiedExtensionUI,
+      isLivePageViewMode
     } = this.props;
     const {
       selection
@@ -227,7 +231,8 @@ export class ExtensionComponentOld extends Component {
         isNodeSelected: selectedNode === node,
         isNodeNested: isNodeNested,
         isNodeHovered: this.state.isNodeHovered,
-        setIsNodeHovered: this.setIsNodeHovered
+        setIsNodeHovered: this.setIsNodeHovered,
+        isLivePageViewMode: isLivePageViewMode
       });
     }
     const extensionHandlerResult = this.tryExtensionHandler(undefined);
@@ -252,7 +257,8 @@ export class ExtensionComponentOld extends Component {
           showLivePagesBodiedMacrosRendererView: !!(showLivePagesBodiedMacrosRendererView !== null && showLivePagesBodiedMacrosRendererView !== void 0 && showLivePagesBodiedMacrosRendererView(nodeToJSON(node))),
           showUpdatedLivePages1PBodiedExtensionUI: !!(showUpdatedLivePages1PBodiedExtensionUI !== null && showUpdatedLivePages1PBodiedExtensionUI !== void 0 && showUpdatedLivePages1PBodiedExtensionUI(nodeToJSON(node))),
           showBodiedExtensionRendererView: this.state.showBodiedExtensionRendererView,
-          setShowBodiedExtensionRendererView: this.setShowBodiedExtensionRendererView
+          setShowBodiedExtensionRendererView: this.setShowBodiedExtensionRendererView,
+          isLivePageViewMode: isLivePageViewMode
         }, extensionHandlerResult);
       case 'inlineExtension':
         return /*#__PURE__*/React.createElement(InlineExtension, {
@@ -261,7 +267,8 @@ export class ExtensionComponentOld extends Component {
           isNodeSelected: selectedNode === node,
           pluginInjectionApi: pluginInjectionApi,
           isNodeHovered: this.state.isNodeHovered,
-          setIsNodeHovered: this.setIsNodeHovered
+          setIsNodeHovered: this.setIsNodeHovered,
+          isLivePageViewMode: isLivePageViewMode
         }, extensionHandlerResult);
       default:
         return null;
@@ -328,9 +335,12 @@ class ExtensionComponentInner extends Component {
     _defineProperty(this, "getNodeRenderer", memoizeOne(getNodeRenderer));
     _defineProperty(this, "getExtensionModuleNodePrivateProps", memoizeOne(getExtensionModuleNodePrivateProps));
     _defineProperty(this, "setIsNodeHovered", isHovered => {
-      this.setState({
-        isNodeHovered: isHovered
-      });
+      // Don't want to show hover interactions for live page view mode
+      if (!this.props.isLivePageViewMode) {
+        this.setState({
+          isNodeHovered: isHovered
+        });
+      }
     });
     /**
      * Parses any private nodes once an extension provider is available.
@@ -446,7 +456,8 @@ class ExtensionComponentInner extends Component {
       showLivePagesBodiedMacrosRendererView,
       showUpdatedLivePages1PBodiedExtensionUI,
       showBodiedExtensionRendererView,
-      setShowBodiedExtensionRendererView
+      setShowBodiedExtensionRendererView,
+      isLivePageViewMode
     } = this.props;
     const {
       selection
@@ -469,7 +480,8 @@ class ExtensionComponentInner extends Component {
         isNodeSelected: selectedNode === node,
         isNodeNested: isNodeNested,
         isNodeHovered: this.state.isNodeHovered,
-        setIsNodeHovered: this.setIsNodeHovered
+        setIsNodeHovered: this.setIsNodeHovered,
+        isLivePageViewMode: isLivePageViewMode
       });
     }
     const extensionHandlerResult = this.tryExtensionHandler(undefined);
@@ -494,7 +506,8 @@ class ExtensionComponentInner extends Component {
           showLivePagesBodiedMacrosRendererView: !!(showLivePagesBodiedMacrosRendererView !== null && showLivePagesBodiedMacrosRendererView !== void 0 && showLivePagesBodiedMacrosRendererView(nodeToJSON(node))),
           showUpdatedLivePages1PBodiedExtensionUI: !!(showUpdatedLivePages1PBodiedExtensionUI !== null && showUpdatedLivePages1PBodiedExtensionUI !== void 0 && showUpdatedLivePages1PBodiedExtensionUI(nodeToJSON(node))),
           showBodiedExtensionRendererView: showBodiedExtensionRendererView,
-          setShowBodiedExtensionRendererView: setShowBodiedExtensionRendererView
+          setShowBodiedExtensionRendererView: setShowBodiedExtensionRendererView,
+          isLivePageViewMode: isLivePageViewMode
         }, extensionHandlerResult);
       case 'inlineExtension':
         return /*#__PURE__*/React.createElement(InlineExtension, {
@@ -503,7 +516,8 @@ class ExtensionComponentInner extends Component {
           isNodeSelected: selectedNode === node,
           pluginInjectionApi: pluginInjectionApi,
           isNodeHovered: this.state.isNodeHovered,
-          setIsNodeHovered: this.setIsNodeHovered
+          setIsNodeHovered: this.setIsNodeHovered,
+          isLivePageViewMode: isLivePageViewMode
         }, extensionHandlerResult);
       default:
         return null;

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

@@ -79,7 +79,8 @@ const MultiBodiedExtensionWithWidth = ({
   isNodeHovered,
   isNodeNested,
   setIsNodeHovered,
-  pluginInjectionApi
+  pluginInjectionApi,
+  isLivePageViewMode
 }) => {
   const {
     showMacroInteractionDesignUpdates
@@ -154,7 +155,7 @@ const MultiBodiedExtensionWithWidth = ({
       setIsNodeHovered(didHover);
     }
   };
-  return jsx(Fragment, null, showMacroInteractionDesignUpdates && jsx(ExtensionLozenge, {
+  return jsx(Fragment, null, showMacroInteractionDesignUpdates && !isLivePageViewMode && jsx(ExtensionLozenge, {
     isNodeSelected: isNodeSelected,
     node: node,
     showMacroInteractionDesignUpdates: true,

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 = "99.8.1";
+const packageVersion = "99.9.1";
 const sanitiseSentryEvents = (data, _hint) => {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

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 = "99.8.1";
+const packageVersion = "99.9.1";
 const halfFocusRing = 1;
 const dropOffset = '0, 8';
 // Ignored via go/ees005

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

@@ -43,7 +43,8 @@ function ExtensionWithPluginState(props) {
     showUpdatedLivePages1PBodiedExtensionUI = props.showUpdatedLivePages1PBodiedExtensionUI,
     showBodiedExtensionRendererView = props.showBodiedExtensionRendererView,
     setShowBodiedExtensionRendererView = props.setShowBodiedExtensionRendererView,
-    pluginInjectionApi = props.pluginInjectionApi;
+    pluginInjectionApi = props.pluginInjectionApi,
+    isLivePageViewMode = props.isLivePageViewMode;
   var _ref = macroInteractionDesignFeatureFlags || {},
     showMacroInteractionDesignUpdates = _ref.showMacroInteractionDesignUpdates;
   var hasBody = ['bodiedExtension', 'multiBodiedExtension'].includes(node.type.name);
@@ -112,7 +113,7 @@ function ExtensionWithPluginState(props) {
       setIsNodeHovered(didHover);
     }
   };
-  return jsx(Fragment, null, showMacroInteractionDesignUpdates && jsx(ExtensionLozenge, {
+  return jsx(Fragment, null, showMacroInteractionDesignUpdates && !isLivePageViewMode && jsx(ExtensionLozenge, {
     isNodeSelected: isNodeSelected,
     isNodeHovered: isNodeHovered,
     isNodeNested: isNodeNested,

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

@@ -20,7 +20,8 @@ var InlineExtension = function InlineExtension(props) {
     isNodeSelected = props.isNodeSelected,
     children = props.children,
     isNodeHovered = props.isNodeHovered,
-    setIsNodeHovered = props.setIsNodeHovered;
+    setIsNodeHovered = props.setIsNodeHovered,
+    isLivePageViewMode = props.isLivePageViewMode;
   var _ref = macroInteractionDesignFeatureFlags || {},
     showMacroInteractionDesignUpdates = _ref.showMacroInteractionDesignUpdates;
   var _useSharedPluginState = useSharedPluginState(pluginInjectionApi, ['width']),
@@ -38,7 +39,7 @@ var InlineExtension = function InlineExtension(props) {
       setIsNodeHovered(didHover);
     }
   };
-  var inlineExtensionInternal = jsx(Fragment, null, showMacroInteractionDesignUpdates && jsx(ExtensionLozenge, {
+  var inlineExtensionInternal = jsx(Fragment, null, showMacroInteractionDesignUpdates && !isLivePageViewMode && jsx(ExtensionLozenge, {
     node: node,
     isNodeSelected: isNodeSelected,
     isNodeHovered: isNodeHovered,

package/dist/esm/extensibility/Extension.js

@@ -17,6 +17,7 @@ export var Extension = /*#__PURE__*/function (_Component) {
     _classCallCheck(this, Extension);
     _this = _callSuper(this, Extension, [props]);
     _defineProperty(_this, "renderWithProvider", function (_ref) {
+      var _pluginInjectionApi$e;
       var extensionProvider = _ref.extensionProvider;
       var _this$props = _this.props,
         node = _this$props.node,
@@ -32,6 +33,14 @@ export var Extension = /*#__PURE__*/function (_Component) {
         showLivePagesBodiedMacrosRendererView = _this$props.showLivePagesBodiedMacrosRendererView,
         showUpdatedLivePages1PBodiedExtensionUI = _this$props.showUpdatedLivePages1PBodiedExtensionUI,
         rendererExtensionHandlers = _this$props.rendererExtensionHandlers;
+
+      // Extensions are not yet using the new plugin architecture, and the use of the pluginInjectionApi
+      // is not type safe in editor-common.
+      // @ts-ignore
+      var currentState = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$e = pluginInjectionApi.editorViewMode) === null || _pluginInjectionApi$e === void 0 || (_pluginInjectionApi$e = _pluginInjectionApi$e.sharedState) === null || _pluginInjectionApi$e === void 0 ? void 0 : _pluginInjectionApi$e.currentState();
+      var _ref2 = currentState || {},
+        contentMode = _ref2.contentMode;
+      var isLivePageViewMode = contentMode === 'live-view';
       return /*#__PURE__*/React.createElement(ExtensionComponent, {
         editorView: editorView,
         node: node,
@@ -46,7 +55,8 @@ export var Extension = /*#__PURE__*/function (_Component) {
         macroInteractionDesignFeatureFlags: macroInteractionDesignFeatureFlags,
         showLivePagesBodiedMacrosRendererView: showLivePagesBodiedMacrosRendererView,
         showUpdatedLivePages1PBodiedExtensionUI: showUpdatedLivePages1PBodiedExtensionUI,
-        rendererExtensionHandlers: rendererExtensionHandlers
+        rendererExtensionHandlers: rendererExtensionHandlers,
+        isLivePageViewMode: isLivePageViewMode
       });
     });
     _this.providerFactory = props.providerFactory || new ProviderFactory();

package/dist/esm/extensibility/ExtensionComponent.js

@@ -50,9 +50,12 @@ export var ExtensionComponentOld = /*#__PURE__*/function (_Component) {
     _defineProperty(_this, "getNodeRenderer", memoizeOne(getNodeRenderer));
     _defineProperty(_this, "getExtensionModuleNodePrivateProps", memoizeOne(getExtensionModuleNodePrivateProps));
     _defineProperty(_this, "setIsNodeHovered", function (isHovered) {
-      _this.setState({
-        isNodeHovered: isHovered
-      });
+      // Don't want to show hover interactions for live page view mode
+      if (!_this.props.isLivePageViewMode) {
+        _this.setState({
+          isNodeHovered: isHovered
+        });
+      }
     });
     _defineProperty(_this, "setShowBodiedExtensionRendererView", function (showRendererView) {
       _this.setState({
@@ -241,7 +244,8 @@ export var ExtensionComponentOld = /*#__PURE__*/function (_Component) {
         eventDispatcher = _this$props3.eventDispatcher,
         macroInteractionDesignFeatureFlags = _this$props3.macroInteractionDesignFeatureFlags,
         showLivePagesBodiedMacrosRendererView = _this$props3.showLivePagesBodiedMacrosRendererView,
-        showUpdatedLivePages1PBodiedExtensionUI = _this$props3.showUpdatedLivePages1PBodiedExtensionUI;
+        showUpdatedLivePages1PBodiedExtensionUI = _this$props3.showUpdatedLivePages1PBodiedExtensionUI,
+        isLivePageViewMode = _this$props3.isLivePageViewMode;
       var selection = editorView.state.selection;
       var selectedNode = selection instanceof NodeSelection && selection.node;
       var position = typeof getPos === 'function' && getPos();
@@ -261,7 +265,8 @@ export var ExtensionComponentOld = /*#__PURE__*/function (_Component) {
           isNodeSelected: selectedNode === node,
           isNodeNested: isNodeNested,
           isNodeHovered: this.state.isNodeHovered,
-          setIsNodeHovered: this.setIsNodeHovered
+          setIsNodeHovered: this.setIsNodeHovered,
+          isLivePageViewMode: isLivePageViewMode
         });
       }
       var extensionHandlerResult = this.tryExtensionHandler(undefined);
@@ -286,7 +291,8 @@ export var ExtensionComponentOld = /*#__PURE__*/function (_Component) {
             showLivePagesBodiedMacrosRendererView: !!(showLivePagesBodiedMacrosRendererView !== null && showLivePagesBodiedMacrosRendererView !== void 0 && showLivePagesBodiedMacrosRendererView(nodeToJSON(node))),
             showUpdatedLivePages1PBodiedExtensionUI: !!(showUpdatedLivePages1PBodiedExtensionUI !== null && showUpdatedLivePages1PBodiedExtensionUI !== void 0 && showUpdatedLivePages1PBodiedExtensionUI(nodeToJSON(node))),
             showBodiedExtensionRendererView: this.state.showBodiedExtensionRendererView,
-            setShowBodiedExtensionRendererView: this.setShowBodiedExtensionRendererView
+            setShowBodiedExtensionRendererView: this.setShowBodiedExtensionRendererView,
+            isLivePageViewMode: isLivePageViewMode
           }, extensionHandlerResult);
         case 'inlineExtension':
           return /*#__PURE__*/React.createElement(InlineExtension, {
@@ -295,7 +301,8 @@ export var ExtensionComponentOld = /*#__PURE__*/function (_Component) {
             isNodeSelected: selectedNode === node,
             pluginInjectionApi: pluginInjectionApi,
             isNodeHovered: this.state.isNodeHovered,
-            setIsNodeHovered: this.setIsNodeHovered
+            setIsNodeHovered: this.setIsNodeHovered,
+            isLivePageViewMode: isLivePageViewMode
           }, extensionHandlerResult);
         default:
           return null;
@@ -372,9 +379,12 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component2) {
     _defineProperty(_this2, "getNodeRenderer", memoizeOne(getNodeRenderer));
     _defineProperty(_this2, "getExtensionModuleNodePrivateProps", memoizeOne(getExtensionModuleNodePrivateProps));
     _defineProperty(_this2, "setIsNodeHovered", function (isHovered) {
-      _this2.setState({
-        isNodeHovered: isHovered
-      });
+      // Don't want to show hover interactions for live page view mode
+      if (!_this2.props.isLivePageViewMode) {
+        _this2.setState({
+          isNodeHovered: isHovered
+        });
+      }
     });
     /**
      * Parses any private nodes once an extension provider is available.
@@ -510,7 +520,8 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component2) {
         showLivePagesBodiedMacrosRendererView = _this$props4.showLivePagesBodiedMacrosRendererView,
         showUpdatedLivePages1PBodiedExtensionUI = _this$props4.showUpdatedLivePages1PBodiedExtensionUI,
         showBodiedExtensionRendererView = _this$props4.showBodiedExtensionRendererView,
-        setShowBodiedExtensionRendererView = _this$props4.setShowBodiedExtensionRendererView;
+        setShowBodiedExtensionRendererView = _this$props4.setShowBodiedExtensionRendererView,
+        isLivePageViewMode = _this$props4.isLivePageViewMode;
       var selection = editorView.state.selection;
       var selectedNode = selection instanceof NodeSelection && selection.node;
       var position = typeof getPos === 'function' && getPos();
@@ -530,7 +541,8 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component2) {
           isNodeSelected: selectedNode === node,
           isNodeNested: isNodeNested,
           isNodeHovered: this.state.isNodeHovered,
-          setIsNodeHovered: this.setIsNodeHovered
+          setIsNodeHovered: this.setIsNodeHovered,
+          isLivePageViewMode: isLivePageViewMode
         });
       }
       var extensionHandlerResult = this.tryExtensionHandler(undefined);
@@ -555,7 +567,8 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component2) {
             showLivePagesBodiedMacrosRendererView: !!(showLivePagesBodiedMacrosRendererView !== null && showLivePagesBodiedMacrosRendererView !== void 0 && showLivePagesBodiedMacrosRendererView(nodeToJSON(node))),
             showUpdatedLivePages1PBodiedExtensionUI: !!(showUpdatedLivePages1PBodiedExtensionUI !== null && showUpdatedLivePages1PBodiedExtensionUI !== void 0 && showUpdatedLivePages1PBodiedExtensionUI(nodeToJSON(node))),
             showBodiedExtensionRendererView: showBodiedExtensionRendererView,
-            setShowBodiedExtensionRendererView: setShowBodiedExtensionRendererView
+            setShowBodiedExtensionRendererView: setShowBodiedExtensionRendererView,
+            isLivePageViewMode: isLivePageViewMode
           }, extensionHandlerResult);
         case 'inlineExtension':
           return /*#__PURE__*/React.createElement(InlineExtension, {
@@ -564,7 +577,8 @@ var ExtensionComponentInner = /*#__PURE__*/function (_Component2) {
             isNodeSelected: selectedNode === node,
             pluginInjectionApi: pluginInjectionApi,
             isNodeHovered: this.state.isNodeHovered,
-            setIsNodeHovered: this.setIsNodeHovered
+            setIsNodeHovered: this.setIsNodeHovered,
+            isLivePageViewMode: isLivePageViewMode
           }, extensionHandlerResult);
         default:
           return null;

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

@@ -82,7 +82,8 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref)
     isNodeHovered = _ref.isNodeHovered,
     isNodeNested = _ref.isNodeNested,
     setIsNodeHovered = _ref.setIsNodeHovered,
-    pluginInjectionApi = _ref.pluginInjectionApi;
+    pluginInjectionApi = _ref.pluginInjectionApi,
+    isLivePageViewMode = _ref.isLivePageViewMode;
   var _ref2 = macroInteractionDesignFeatureFlags || {},
     showMacroInteractionDesignUpdates = _ref2.showMacroInteractionDesignUpdates;
   var _node$attrs = node.attrs,
@@ -156,7 +157,7 @@ var MultiBodiedExtensionWithWidth = function MultiBodiedExtensionWithWidth(_ref)
       setIsNodeHovered(didHover);
     }
   };
-  return jsx(Fragment, null, showMacroInteractionDesignUpdates && jsx(ExtensionLozenge, {
+  return jsx(Fragment, null, showMacroInteractionDesignUpdates && !isLivePageViewMode && jsx(ExtensionLozenge, {
     isNodeSelected: isNodeSelected,
     node: node,
     showMacroInteractionDesignUpdates: true,

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 = "99.8.1";
+var packageVersion = "99.9.1";
 var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
   // Remove URL as it has UGC
   // TODO: Sanitise the URL instead of just removing it

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

package/dist/types/extensibility/Extension/Extension/index.d.ts

@@ -25,6 +25,7 @@ export interface Props {
     showUpdatedLivePages1PBodiedExtensionUI?: boolean;
     showBodiedExtensionRendererView?: boolean;
     setShowBodiedExtensionRendererView?: (showBodiedExtensionRendererView: boolean) => void;
+    isLivePageViewMode?: boolean;
 }
 declare const _default: {
     new (props: Props | Readonly<Props>): {

package/dist/types/extensibility/Extension/InlineExtension/index.d.ts

@@ -14,6 +14,7 @@ export interface Props {
     isNodeSelected?: boolean;
     isNodeHovered?: boolean;
     setIsNodeHovered?: (isHovered: boolean) => void;
+    isLivePageViewMode?: boolean;
 }
 declare const InlineExtension: (props: Props) => jsx.JSX.Element;
 export default InlineExtension;

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

@@ -23,6 +23,7 @@ export interface Props {
     showLivePagesBodiedMacrosRendererView?: (node: ADFEntity) => boolean;
     showUpdatedLivePages1PBodiedExtensionUI?: (node: ADFEntity) => boolean;
     rendererExtensionHandlers?: ExtensionHandlers;
+    isLivePageViewMode?: boolean;
 }
 export interface State {
     extensionProvider?: ExtensionProvider;

package/dist/types/extensibility/MultiBodiedExtension/index.d.ts

@@ -26,6 +26,7 @@ type Props = {
     isNodeHovered?: boolean;
     isNodeNested?: boolean;
     setIsNodeHovered?: (isHovered: boolean) => void;
+    isLivePageViewMode?: boolean;
 };
 declare const MultiBodiedExtension: (props: Props & OverflowShadowProps) => jsx.JSX.Element;
 export default MultiBodiedExtension;

package/dist/types-ts4.5/extensibility/Extension/Extension/index.d.ts

@@ -25,6 +25,7 @@ export interface Props {
     showUpdatedLivePages1PBodiedExtensionUI?: boolean;
     showBodiedExtensionRendererView?: boolean;
     setShowBodiedExtensionRendererView?: (showBodiedExtensionRendererView: boolean) => void;
+    isLivePageViewMode?: boolean;
 }
 declare const _default: {
     new (props: Props | Readonly<Props>): {

package/dist/types-ts4.5/extensibility/Extension/InlineExtension/index.d.ts

@@ -14,6 +14,7 @@ export interface Props {
     isNodeSelected?: boolean;
     isNodeHovered?: boolean;
     setIsNodeHovered?: (isHovered: boolean) => void;
+    isLivePageViewMode?: boolean;
 }
 declare const InlineExtension: (props: Props) => jsx.JSX.Element;
 export default InlineExtension;

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

@@ -23,6 +23,7 @@ export interface Props {
     showLivePagesBodiedMacrosRendererView?: (node: ADFEntity) => boolean;
     showUpdatedLivePages1PBodiedExtensionUI?: (node: ADFEntity) => boolean;
     rendererExtensionHandlers?: ExtensionHandlers;
+    isLivePageViewMode?: boolean;
 }
 export interface State {
     extensionProvider?: ExtensionProvider;

package/dist/types-ts4.5/extensibility/MultiBodiedExtension/index.d.ts

@@ -26,6 +26,7 @@ type Props = {
     isNodeHovered?: boolean;
     isNodeNested?: boolean;
     setIsNodeHovered?: (isHovered: boolean) => void;
+    isLivePageViewMode?: boolean;
 };
 declare const MultiBodiedExtension: (props: Props & OverflowShadowProps) => jsx.JSX.Element;
 export default MultiBodiedExtension;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-common",
-	"version": "99.8.1",
+	"version": "99.9.1",
 	"description": "A package that contains common classes and components for editor and renderer",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -130,7 +130,7 @@
 		"@atlaskit/editor-shared-styles": "^3.2.0",
 		"@atlaskit/editor-tables": "^2.8.0",
 		"@atlaskit/emoji": "^67.13.0",
-		"@atlaskit/icon": "^23.6.0",
+		"@atlaskit/icon": "^23.7.0",
 		"@atlaskit/icon-object": "^6.10.0",
 		"@atlaskit/link-datasource": "^3.18.0",
 		"@atlaskit/link-picker": "^1.48.0",
@@ -141,7 +141,7 @@
 		"@atlaskit/media-file-preview": "^0.10.0",
 		"@atlaskit/media-picker": "^67.1.0",
 		"@atlaskit/media-ui": "^27.4.0",
-		"@atlaskit/media-viewer": "50.1.2",
+		"@atlaskit/media-viewer": "50.1.3",
 		"@atlaskit/mention": "^23.11.0",
 		"@atlaskit/menu": "^2.14.0",
 		"@atlaskit/onboarding": "^12.3.0",
@@ -155,7 +155,7 @@
 		"@atlaskit/spinner": "^17.1.0",
 		"@atlaskit/task-decision": "^17.12.0",
 		"@atlaskit/textfield": "^6.8.0",
-		"@atlaskit/tmp-editor-statsig": "^2.42.0",
+		"@atlaskit/tmp-editor-statsig": "^2.43.0",
 		"@atlaskit/tokens": "^3.3.0",
 		"@atlaskit/tooltip": "^19.1.0",
 		"@atlaskit/width-detector": "^4.4.0",