@atlaskit/editor-plugin-layout 25.0.2 → 25.1.1

package/CHANGELOG.md

@@ -1,5 +1,30 @@
 # @atlaskit/editor-plugin-layout
 
+## 25.1.1
+
+### Patch Changes
+
+- [`0a81f6fa7cbf8`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/0a81f6fa7cbf8) -
+  Clean up experiment `platform_editor_breakout_resizing`. Behind the
+  `platform_editor_list_join_strip_breakout` experiment, strip the breakout mark from a code block
+  before nesting it into a list item when joining from a gap cursor. Behind the
+  `platform_editor_resizer_selector_jsdom_fix` experiment, make the panel and rule breakout resizer
+  selectors parseable by jsdom (`> *[data-prosemirror-node-name=…]`).
+- Updated dependencies
+
+## 25.1.0
+
+### Minor Changes
+
+- [`1bc9c73990ed2`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1bc9c73990ed2) -
+  Add editor viewmode plugin to layout plugin dependencies
+
+### Patch Changes
+
+- [`76b3320456e72`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/76b3320456e72) -
+  Clean up experiment `platform_editor_layout_column_selection_fix`
+- Updated dependencies
+
 ## 25.0.2
 
 ### Patch Changes

package/dist/cjs/nodeviews/index.js

@@ -12,89 +12,19 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _coreUtils = require("@atlaskit/editor-common/core-utils");
-var _hooks = require("@atlaskit/editor-common/hooks");
 var _reactNodeView = _interopRequireWildcard(require("@atlaskit/editor-common/react-node-view"));
 var _resizer = require("@atlaskit/editor-common/resizer");
-var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
 var _model = require("@atlaskit/editor-prosemirror/model");
 var _fg = require("@atlaskit/platform-feature-flags/fg");
-var _editorExperiment = require("@atlaskit/tmp-editor-statsig/editor-experiment");
-var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
-var _utils = require("../pm-plugins/utils");
 var _LayoutSSRReactContextsProvider = require("../ui/LayoutSSRReactContextsProvider");
-var _utils2 = require("./utils");
+var _utils = require("./utils");
 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); }
 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 ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-var layoutDynamicFullWidthGuidelineOffset = 16;
-var isBreakoutAvailable = function isBreakoutAvailable(schema) {
-  return Boolean(schema.marks.breakout);
-};
-var selector = function selector(states) {
-  var _states$editorDisable;
-  return {
-    editorDisabled: (_states$editorDisable = states.editorDisabledState) === null || _states$editorDisable === void 0 ? void 0 : _states$editorDisable.editorDisabled
-  };
-};
-var LayoutBreakoutResizer = function LayoutBreakoutResizer(_ref) {
-  var _pluginInjectionApi$a;
-  var pluginInjectionApi = _ref.pluginInjectionApi,
-    forwardRef = _ref.forwardRef,
-    getPos = _ref.getPos,
-    view = _ref.view,
-    parentRef = _ref.parentRef;
-  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(pluginInjectionApi, ['editorDisabled'], selector),
-    editorDisabled = _useSharedPluginState.editorDisabled;
-  var interactionState = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'interaction.interactionState');
-  var getEditorWidth = function getEditorWidth() {
-    var _pluginInjectionApi$w;
-    return pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$w = pluginInjectionApi.width) === null || _pluginInjectionApi$w === void 0 ? void 0 : _pluginInjectionApi$w.sharedState.currentState();
-  };
-  var displayGapCursor = (0, _react.useCallback)(function (toggle) {
-    var _pluginInjectionApi$c, _pluginInjectionApi$c2, _pluginInjectionApi$s;
-    return (_pluginInjectionApi$c = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c2 = pluginInjectionApi.core) === null || _pluginInjectionApi$c2 === void 0 ? void 0 : _pluginInjectionApi$c2.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$s = pluginInjectionApi.selection) === null || _pluginInjectionApi$s === void 0 ? void 0 : _pluginInjectionApi$s.commands.displayGapCursor(toggle))) !== null && _pluginInjectionApi$c !== void 0 ? _pluginInjectionApi$c : false;
-  }, [pluginInjectionApi]);
-  var displayGuidelines = (0, _react.useCallback)(function (guidelines) {
-    var _pluginInjectionApi$g;
-    pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$g = pluginInjectionApi.guideline) === null || _pluginInjectionApi$g === void 0 || (_pluginInjectionApi$g = _pluginInjectionApi$g.actions) === null || _pluginInjectionApi$g === void 0 || _pluginInjectionApi$g.displayGuideline(view)({
-      guidelines: guidelines
-    });
-  }, [pluginInjectionApi, view]);
-
-  // we want to hide the floating toolbar for other nodes.
-  // e.g. info panel inside the current layout section
-  var selectIntoCurrentLayout = (0, _react.useCallback)(function () {
-    var pos = getPos();
-    if (pos === undefined) {
-      return;
-    }
-    // put the selection into the first column of the layout
-    (0, _utils.selectIntoLayout)(view, pos, 0);
-  }, [getPos, view]);
-  return /*#__PURE__*/_react.default.createElement(_resizer.BreakoutResizer, {
-    getRef: forwardRef,
-    getPos: getPos,
-    editorView: view,
-    nodeType: "layoutSection",
-    getEditorWidth: getEditorWidth,
-    disabled: (0, _editorExperiment.editorExperiment)('platform_editor_breakout_resizing', true) ? true : editorDisabled === true || !isBreakoutAvailable(view.state.schema),
-    hidden: interactionState === 'hasNotHadInteraction',
-    parentRef: parentRef,
-    editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions,
-    displayGuidelines: (0, _editorExperiment.editorExperiment)('single_column_layouts', true) ? displayGuidelines : undefined,
-    displayGapCursor: displayGapCursor
-    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
-    ,
-    onResizeStart: function onResizeStart() {
-      selectIntoCurrentLayout();
-    },
-    dynamicFullWidthGuidelineOffset: layoutDynamicFullWidthGuidelineOffset
-  });
-};
 var toDOM = function toDOM(node) {
   return ['div', {
     class: 'layout-section-container'
@@ -126,7 +56,7 @@ var LayoutSectionView = exports.LayoutSectionView = /*#__PURE__*/function (_Reac
     var _this;
     (0, _classCallCheck2.default)(this, LayoutSectionView);
     _this = _callSuper(this, LayoutSectionView, [props.node, props.view, props.getPos, props.portalProviderAPI, props.eventDispatcher, props]);
-    _this.isEmpty = (0, _utils2.isEmptyLayout)(_this.node);
+    _this.isEmpty = (0, _utils.isEmptyLayout)(_this.node);
     _this.options = props.options;
     _this.intl = props.intl;
     return _this;
@@ -148,9 +78,9 @@ var LayoutSectionView = exports.LayoutSectionView = /*#__PURE__*/function (_Reac
       // it. We handle that by stamping `data-ssr-content-dom-ref` on the
       // outer container so `ReactNodeView.init()` can find a re-attach
       // target inside `domRef` after the portal write.
-      var _ref2 = _model.DOMSerializer.renderSpec(document, toDOM(this.node)),
-        container = _ref2.dom,
-        contentDOM = _ref2.contentDOM;
+      var _ref = _model.DOMSerializer.renderSpec(document, toDOM(this.node)),
+        container = _ref.dom,
+        contentDOM = _ref.contentDOM;
 
       // Ignored via go/ees005
       // eslint-disable-next-line @atlaskit/editor/no-as-casting
@@ -204,7 +134,7 @@ var LayoutSectionView = exports.LayoutSectionView = /*#__PURE__*/function (_Reac
   }, {
     key: "render",
     value: function render(props, forwardRef) {
-      this.isEmpty = (0, _utils2.isEmptyLayout)(this.node);
+      this.isEmpty = (0, _utils.isEmptyLayout)(this.node);
       if (this.layoutDOM) {
         this.layoutDOM.setAttribute('data-empty-layout', Boolean(this.isEmpty).toString());
       }
@@ -231,16 +161,7 @@ var LayoutSectionView = exports.LayoutSectionView = /*#__PURE__*/function (_Reac
           ref: forwardRef
         }));
       }
-      if ((0, _expValEquals.expValEquals)('platform_editor_breakout_resizing', 'isEnabled', true)) {
-        return null;
-      }
-      return /*#__PURE__*/_react.default.createElement(LayoutBreakoutResizer, {
-        pluginInjectionApi: props.pluginInjectionApi,
-        forwardRef: forwardRef,
-        getPos: props.getPos,
-        view: props.view,
-        parentRef: this.layoutDOM
-      });
+      return null;
     }
 
     /**

package/dist/cjs/nodeviews/layoutSectionView.js

@@ -33,9 +33,7 @@ var toDOM = function toDOM(node, isEmpty) {
 };
 
 /**
- * Requires `platform_editor_breakout_resizing` as well as
- * `platform_editor_vanilla_node_views_phase1`, because it cannot render the
- * React `<BreakoutResizer>` the old view mounts when that experiment is off.
+ * Requires `platform_editor_vanilla_node_views_phase1`.
  *
  * Also used for SSR, where it needs no `NodeViewContentHole` /
  * `data-ssr-content-dom-ref` handling — that exists only because the React

package/dist/cjs/pm-plugins/resizing.js

@@ -13,7 +13,6 @@ var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _model = require("@atlaskit/editor-prosemirror/model");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
-var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _nodeviews = require("../nodeviews");
 var _layoutSectionView = require("../nodeviews/layoutSectionView");
 var pluginKey = exports.pluginKey = new _state.PluginKey('layoutResizingPlugin');
@@ -99,14 +98,11 @@ var _default = exports.default = function _default(options, pluginInjectionApi,
     props: {
       nodeViews: {
         layoutSection: function layoutSection(node, view, getPos) {
-          // Both experiments are required: the vanilla view renders no React, so it
-          // cannot mount the <LayoutBreakoutResizer> that LayoutSectionView.render()
-          // returns. That resizer is only redundant once
-          // `platform_editor_breakout_resizing` is on (render() returns null and
-          // breakout resizing is handled by the pragmatic resizer in
-          // editor-plugin-breakout). Taking the vanilla path while that experiment is
-          // off would silently remove the breakout drag handles.
-          if ((0, _expValEquals.expValEquals)('platform_editor_breakout_resizing', 'isEnabled', true) && (0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_vanilla_node_views_phase1')) {
+          // The vanilla view renders no React, so it cannot mount the
+          // <LayoutBreakoutResizer> that LayoutSectionView.render() used to return.
+          // That resizer is redundant now that breakout resizing is handled by the
+          // pragmatic resizer in editor-plugin-breakout.
+          if ((0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_vanilla_node_views_phase1')) {
             return new _layoutSectionView.LayoutSectionView(node);
           }
           return new _nodeviews.LayoutSectionView({

package/dist/cjs/pm-plugins/utils/index.js

@@ -9,7 +9,6 @@ var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils = require("@atlaskit/editor-prosemirror/utils");
 var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
 var _editorExperiment = require("@atlaskit/tmp-editor-statsig/editor-experiment");
-var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 // eslint-disable-next-line @typescript-eslint/consistent-type-imports
 
 var getMaybeLayoutSection = exports.getMaybeLayoutSection = function getMaybeLayoutSection(state) {
@@ -155,7 +154,7 @@ var getGapCursorTargetForBlankSpaceClick = exports.getGapCursorTargetForBlankSpa
   // so the above/below checks never fired.
   if (columnNode.childCount === 1) {
     var onlyChild = columnNode.firstChild;
-    var shouldHandleAtomicChild = (0, _expValEquals.expValEquals)('platform_editor_layout_column_selection_fix', 'isEnabled', true) ? supportsBlankSpaceGapCursorFallback(onlyChild) : (onlyChild === null || onlyChild === void 0 ? void 0 : onlyChild.type.name) !== 'paragraph' && (onlyChild === null || onlyChild === void 0 ? void 0 : onlyChild.type.name) !== 'panel';
+    var shouldHandleAtomicChild = supportsBlankSpaceGapCursorFallback(onlyChild);
     if (onlyChild && shouldHandleAtomicChild) {
       // A caption is editable content inside a mediaSingle, not blank layout space. The
       // image bounds below intentionally exclude the caption so clicks beside the image

package/dist/es2019/nodeviews/index.js

@@ -1,83 +1,11 @@
-import React, { useCallback } from 'react';
+import React from 'react';
 import { isSSR } from '@atlaskit/editor-common/core-utils';
-import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import ReactNodeView, { NodeViewContentHole } from '@atlaskit/editor-common/react-node-view';
-import { BreakoutResizer, ignoreResizerMutations } from '@atlaskit/editor-common/resizer';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+import { ignoreResizerMutations } from '@atlaskit/editor-common/resizer';
 import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
 import { fg } from '@atlaskit/platform-feature-flags/fg';
-import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
-import { selectIntoLayout } from '../pm-plugins/utils';
 import { LayoutSSRReactContextsProvider } from '../ui/LayoutSSRReactContextsProvider';
 import { isEmptyLayout } from './utils';
-const layoutDynamicFullWidthGuidelineOffset = 16;
-const isBreakoutAvailable = schema => {
-  return Boolean(schema.marks.breakout);
-};
-const selector = states => {
-  var _states$editorDisable;
-  return {
-    editorDisabled: (_states$editorDisable = states.editorDisabledState) === null || _states$editorDisable === void 0 ? void 0 : _states$editorDisable.editorDisabled
-  };
-};
-const LayoutBreakoutResizer = ({
-  pluginInjectionApi,
-  forwardRef,
-  getPos,
-  view,
-  parentRef
-}) => {
-  var _pluginInjectionApi$a;
-  const {
-    editorDisabled
-  } = useSharedPluginStateWithSelector(pluginInjectionApi, ['editorDisabled'], selector);
-  const interactionState = useSharedPluginStateSelector(pluginInjectionApi, 'interaction.interactionState');
-  const getEditorWidth = () => {
-    var _pluginInjectionApi$w;
-    return pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$w = pluginInjectionApi.width) === null || _pluginInjectionApi$w === void 0 ? void 0 : _pluginInjectionApi$w.sharedState.currentState();
-  };
-  const displayGapCursor = useCallback(toggle => {
-    var _pluginInjectionApi$c, _pluginInjectionApi$c2, _pluginInjectionApi$s;
-    return (_pluginInjectionApi$c = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$c2 = pluginInjectionApi.core) === null || _pluginInjectionApi$c2 === void 0 ? void 0 : _pluginInjectionApi$c2.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$s = pluginInjectionApi.selection) === null || _pluginInjectionApi$s === void 0 ? void 0 : _pluginInjectionApi$s.commands.displayGapCursor(toggle))) !== null && _pluginInjectionApi$c !== void 0 ? _pluginInjectionApi$c : false;
-  }, [pluginInjectionApi]);
-  const displayGuidelines = useCallback(guidelines => {
-    var _pluginInjectionApi$g, _pluginInjectionApi$g2;
-    pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$g = pluginInjectionApi.guideline) === null || _pluginInjectionApi$g === void 0 ? void 0 : (_pluginInjectionApi$g2 = _pluginInjectionApi$g.actions) === null || _pluginInjectionApi$g2 === void 0 ? void 0 : _pluginInjectionApi$g2.displayGuideline(view)({
-      guidelines
-    });
-  }, [pluginInjectionApi, view]);
-
-  // we want to hide the floating toolbar for other nodes.
-  // e.g. info panel inside the current layout section
-  const selectIntoCurrentLayout = useCallback(() => {
-    const pos = getPos();
-    if (pos === undefined) {
-      return;
-    }
-    // put the selection into the first column of the layout
-    selectIntoLayout(view, pos, 0);
-  }, [getPos, view]);
-  return /*#__PURE__*/React.createElement(BreakoutResizer, {
-    getRef: forwardRef,
-    getPos: getPos,
-    editorView: view,
-    nodeType: "layoutSection",
-    getEditorWidth: getEditorWidth,
-    disabled: editorExperiment('platform_editor_breakout_resizing', true) ? true : editorDisabled === true || !isBreakoutAvailable(view.state.schema),
-    hidden: interactionState === 'hasNotHadInteraction',
-    parentRef: parentRef,
-    editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions,
-    displayGuidelines: editorExperiment('single_column_layouts', true) ? displayGuidelines : undefined,
-    displayGapCursor: displayGapCursor
-    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
-    ,
-    onResizeStart: () => {
-      selectIntoCurrentLayout();
-    },
-    dynamicFullWidthGuidelineOffset: layoutDynamicFullWidthGuidelineOffset
-  });
-};
 const toDOM = node => ['div', {
   class: 'layout-section-container'
 }, ['div', {
@@ -204,16 +132,7 @@ export class LayoutSectionView extends ReactNodeView {
         ref: forwardRef
       }));
     }
-    if (expValEquals('platform_editor_breakout_resizing', 'isEnabled', true)) {
-      return null;
-    }
-    return /*#__PURE__*/React.createElement(LayoutBreakoutResizer, {
-      pluginInjectionApi: props.pluginInjectionApi,
-      forwardRef: forwardRef,
-      getPos: props.getPos,
-      view: props.view,
-      parentRef: this.layoutDOM
-    });
+    return null;
   }
 
   /**

package/dist/es2019/nodeviews/layoutSectionView.js

@@ -22,9 +22,7 @@ const toDOM = (node, isEmpty) => {
 };
 
 /**
- * Requires `platform_editor_breakout_resizing` as well as
- * `platform_editor_vanilla_node_views_phase1`, because it cannot render the
- * React `<BreakoutResizer>` the old view mounts when that experiment is off.
+ * Requires `platform_editor_vanilla_node_views_phase1`.
  *
  * Also used for SSR, where it needs no `NodeViewContentHole` /
  * `data-ssr-content-dom-ref` handling — that exists only because the React

package/dist/es2019/pm-plugins/resizing.js

@@ -3,7 +3,6 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { LayoutSectionView } from '../nodeviews';
 import { LayoutSectionView as LayoutSectionViewVanilla } from '../nodeviews/layoutSectionView';
 export const pluginKey = new PluginKey('layoutResizingPlugin');
@@ -85,14 +84,11 @@ export default ((options, pluginInjectionApi, portalProviderAPI, eventDispatcher
   props: {
     nodeViews: {
       layoutSection: (node, view, getPos) => {
-        // Both experiments are required: the vanilla view renders no React, so it
-        // cannot mount the <LayoutBreakoutResizer> that LayoutSectionView.render()
-        // returns. That resizer is only redundant once
-        // `platform_editor_breakout_resizing` is on (render() returns null and
-        // breakout resizing is handled by the pragmatic resizer in
-        // editor-plugin-breakout). Taking the vanilla path while that experiment is
-        // off would silently remove the breakout drag handles.
-        if (expValEquals('platform_editor_breakout_resizing', 'isEnabled', true) && isExperimentEnabled('platform_editor_vanilla_node_views_phase1')) {
+        // The vanilla view renders no React, so it cannot mount the
+        // <LayoutBreakoutResizer> that LayoutSectionView.render() used to return.
+        // That resizer is redundant now that breakout resizing is handled by the
+        // pragmatic resizer in editor-plugin-breakout.
+        if (isExperimentEnabled('platform_editor_vanilla_node_views_phase1')) {
           return new LayoutSectionViewVanilla(node);
         }
         return new LayoutSectionView({

package/dist/es2019/pm-plugins/utils/index.js

@@ -4,7 +4,6 @@ import { TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { findParentNodeOfType, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 export const getMaybeLayoutSection = state => {
   const {
     schema: {
@@ -150,7 +149,7 @@ export const getGapCursorTargetForBlankSpaceClick = (view, event) => {
   // so the above/below checks never fired.
   if (columnNode.childCount === 1) {
     const onlyChild = columnNode.firstChild;
-    const shouldHandleAtomicChild = expValEquals('platform_editor_layout_column_selection_fix', 'isEnabled', true) ? supportsBlankSpaceGapCursorFallback(onlyChild) : (onlyChild === null || onlyChild === void 0 ? void 0 : onlyChild.type.name) !== 'paragraph' && (onlyChild === null || onlyChild === void 0 ? void 0 : onlyChild.type.name) !== 'panel';
+    const shouldHandleAtomicChild = supportsBlankSpaceGapCursorFallback(onlyChild);
     if (onlyChild && shouldHandleAtomicChild) {
       // A caption is editable content inside a mediaSingle, not blank layout space. The
       // image bounds below intentionally exclude the caption so clicks beside the image

package/dist/esm/nodeviews/index.js

@@ -8,84 +8,14 @@ function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstruct
 function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-import React, { useCallback } from 'react';
+import React from 'react';
 import { isSSR } from '@atlaskit/editor-common/core-utils';
-import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
 import ReactNodeView, { NodeViewContentHole } from '@atlaskit/editor-common/react-node-view';
-import { BreakoutResizer, ignoreResizerMutations } from '@atlaskit/editor-common/resizer';
-import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+import { ignoreResizerMutations } from '@atlaskit/editor-common/resizer';
 import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
 import { fg } from '@atlaskit/platform-feature-flags/fg';
-import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
-import { selectIntoLayout } from '../pm-plugins/utils';
 import { LayoutSSRReactContextsProvider } from '../ui/LayoutSSRReactContextsProvider';
 import { isEmptyLayout } from './utils';
-var layoutDynamicFullWidthGuidelineOffset = 16;
-var isBreakoutAvailable = function isBreakoutAvailable(schema) {
-  return Boolean(schema.marks.breakout);
-};
-var selector = function selector(states) {
-  var _states$editorDisable;
-  return {
-    editorDisabled: (_states$editorDisable = states.editorDisabledState) === null || _states$editorDisable === void 0 ? void 0 : _states$editorDisable.editorDisabled
-  };
-};
-var LayoutBreakoutResizer = function LayoutBreakoutResizer(_ref) {
-  var _pluginInjectionApi$a;
-  var pluginInjectionApi = _ref.pluginInjectionApi,
-    forwardRef = _ref.forwardRef,
-    getPos = _ref.getPos,
-    view = _ref.view,
-    parentRef = _ref.parentRef;
-  var _useSharedPluginState = useSharedPluginStateWithSelector(pluginInjectionApi, ['editorDisabled'], selector),
-    editorDisabled = _useSharedPluginState.editorDisabled;
-  var interactionState = useSharedPluginStateSelector(pluginInjectionApi, 'interaction.interactionState');
-  var getEditorWidth = function getEditorWidth() {
-    var _pluginInjectionApi$w;
-    return pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$w = pluginInjectionApi.width) === null || _pluginInjectionApi$w === void 0 ? void 0 : _pluginInjectionApi$w.sharedState.currentState();
-  };
-  var displayGapCursor = useCallback(function (toggle) {
-    var _pluginInjectionApi$c, _pluginInjectionApi$c2, _pluginInjectionApi$s;
-    return (_pluginInjectionApi$c = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c2 = pluginInjectionApi.core) === null || _pluginInjectionApi$c2 === void 0 ? void 0 : _pluginInjectionApi$c2.actions.execute(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$s = pluginInjectionApi.selection) === null || _pluginInjectionApi$s === void 0 ? void 0 : _pluginInjectionApi$s.commands.displayGapCursor(toggle))) !== null && _pluginInjectionApi$c !== void 0 ? _pluginInjectionApi$c : false;
-  }, [pluginInjectionApi]);
-  var displayGuidelines = useCallback(function (guidelines) {
-    var _pluginInjectionApi$g;
-    pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$g = pluginInjectionApi.guideline) === null || _pluginInjectionApi$g === void 0 || (_pluginInjectionApi$g = _pluginInjectionApi$g.actions) === null || _pluginInjectionApi$g === void 0 || _pluginInjectionApi$g.displayGuideline(view)({
-      guidelines: guidelines
-    });
-  }, [pluginInjectionApi, view]);
-
-  // we want to hide the floating toolbar for other nodes.
-  // e.g. info panel inside the current layout section
-  var selectIntoCurrentLayout = useCallback(function () {
-    var pos = getPos();
-    if (pos === undefined) {
-      return;
-    }
-    // put the selection into the first column of the layout
-    selectIntoLayout(view, pos, 0);
-  }, [getPos, view]);
-  return /*#__PURE__*/React.createElement(BreakoutResizer, {
-    getRef: forwardRef,
-    getPos: getPos,
-    editorView: view,
-    nodeType: "layoutSection",
-    getEditorWidth: getEditorWidth,
-    disabled: editorExperiment('platform_editor_breakout_resizing', true) ? true : editorDisabled === true || !isBreakoutAvailable(view.state.schema),
-    hidden: interactionState === 'hasNotHadInteraction',
-    parentRef: parentRef,
-    editorAnalyticsApi: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a === void 0 ? void 0 : _pluginInjectionApi$a.actions,
-    displayGuidelines: editorExperiment('single_column_layouts', true) ? displayGuidelines : undefined,
-    displayGapCursor: displayGapCursor
-    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
-    ,
-    onResizeStart: function onResizeStart() {
-      selectIntoCurrentLayout();
-    },
-    dynamicFullWidthGuidelineOffset: layoutDynamicFullWidthGuidelineOffset
-  });
-};
 var toDOM = function toDOM(node) {
   return ['div', {
     class: 'layout-section-container'
@@ -139,9 +69,9 @@ export var LayoutSectionView = /*#__PURE__*/function (_ReactNodeView) {
       // it. We handle that by stamping `data-ssr-content-dom-ref` on the
       // outer container so `ReactNodeView.init()` can find a re-attach
       // target inside `domRef` after the portal write.
-      var _ref2 = DOMSerializer.renderSpec(document, toDOM(this.node)),
-        container = _ref2.dom,
-        contentDOM = _ref2.contentDOM;
+      var _ref = DOMSerializer.renderSpec(document, toDOM(this.node)),
+        container = _ref.dom,
+        contentDOM = _ref.contentDOM;
 
       // Ignored via go/ees005
       // eslint-disable-next-line @atlaskit/editor/no-as-casting
@@ -222,16 +152,7 @@ export var LayoutSectionView = /*#__PURE__*/function (_ReactNodeView) {
           ref: forwardRef
         }));
       }
-      if (expValEquals('platform_editor_breakout_resizing', 'isEnabled', true)) {
-        return null;
-      }
-      return /*#__PURE__*/React.createElement(LayoutBreakoutResizer, {
-        pluginInjectionApi: props.pluginInjectionApi,
-        forwardRef: forwardRef,
-        getPos: props.getPos,
-        view: props.view,
-        parentRef: this.layoutDOM
-      });
+      return null;
     }
 
     /**

package/dist/esm/nodeviews/layoutSectionView.js

@@ -26,9 +26,7 @@ var toDOM = function toDOM(node, isEmpty) {
 };
 
 /**
- * Requires `platform_editor_breakout_resizing` as well as
- * `platform_editor_vanilla_node_views_phase1`, because it cannot render the
- * React `<BreakoutResizer>` the old view mounts when that experiment is off.
+ * Requires `platform_editor_vanilla_node_views_phase1`.
  *
  * Also used for SSR, where it needs no `NodeViewContentHole` /
  * `data-ssr-content-dom-ref` handling — that exists only because the React

package/dist/esm/pm-plugins/resizing.js

@@ -6,7 +6,6 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { LayoutSectionView } from '../nodeviews';
 import { LayoutSectionView as LayoutSectionViewVanilla } from '../nodeviews/layoutSectionView';
 export var pluginKey = new PluginKey('layoutResizingPlugin');
@@ -92,14 +91,11 @@ export default (function (options, pluginInjectionApi, portalProviderAPI, eventD
     props: {
       nodeViews: {
         layoutSection: function layoutSection(node, view, getPos) {
-          // Both experiments are required: the vanilla view renders no React, so it
-          // cannot mount the <LayoutBreakoutResizer> that LayoutSectionView.render()
-          // returns. That resizer is only redundant once
-          // `platform_editor_breakout_resizing` is on (render() returns null and
-          // breakout resizing is handled by the pragmatic resizer in
-          // editor-plugin-breakout). Taking the vanilla path while that experiment is
-          // off would silently remove the breakout drag handles.
-          if (expValEquals('platform_editor_breakout_resizing', 'isEnabled', true) && isExperimentEnabled('platform_editor_vanilla_node_views_phase1')) {
+          // The vanilla view renders no React, so it cannot mount the
+          // <LayoutBreakoutResizer> that LayoutSectionView.render() used to return.
+          // That resizer is redundant now that breakout resizing is handled by the
+          // pragmatic resizer in editor-plugin-breakout.
+          if (isExperimentEnabled('platform_editor_vanilla_node_views_phase1')) {
             return new LayoutSectionViewVanilla(node);
           }
           return new LayoutSectionView({

package/dist/esm/pm-plugins/utils/index.js

@@ -4,7 +4,6 @@ import { TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { findParentNodeOfType, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/editor-experiment';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 export var getMaybeLayoutSection = function getMaybeLayoutSection(state) {
   var _state$schema$nodes = state.schema.nodes,
     layoutSection = _state$schema$nodes.layoutSection,
@@ -148,7 +147,7 @@ export var getGapCursorTargetForBlankSpaceClick = function getGapCursorTargetFor
   // so the above/below checks never fired.
   if (columnNode.childCount === 1) {
     var onlyChild = columnNode.firstChild;
-    var shouldHandleAtomicChild = expValEquals('platform_editor_layout_column_selection_fix', 'isEnabled', true) ? supportsBlankSpaceGapCursorFallback(onlyChild) : (onlyChild === null || onlyChild === void 0 ? void 0 : onlyChild.type.name) !== 'paragraph' && (onlyChild === null || onlyChild === void 0 ? void 0 : onlyChild.type.name) !== 'panel';
+    var shouldHandleAtomicChild = supportsBlankSpaceGapCursorFallback(onlyChild);
     if (onlyChild && shouldHandleAtomicChild) {
       // A caption is editable content inside a mediaSingle, not blank layout space. The
       // image bounds below intentionally exclude the caption so clicks beside the image

package/dist/types/nodeviews/layoutSectionView.d.ts

@@ -1,9 +1,7 @@
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import type { NodeView } from '@atlaskit/editor-prosemirror/view';
 /**
- * Requires `platform_editor_breakout_resizing` as well as
- * `platform_editor_vanilla_node_views_phase1`, because it cannot render the
- * React `<BreakoutResizer>` the old view mounts when that experiment is off.
+ * Requires `platform_editor_vanilla_node_views_phase1`.
  *
  * Also used for SSR, where it needs no `NodeViewContentHole` /
  * `data-ssr-content-dom-ref` handling — that exists only because the React

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-layout",
-	"version": "25.0.2",
+	"version": "25.1.1",
 	"description": "Layout plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -28,6 +28,7 @@
 		"@atlaskit/editor-plugin-block-menu": "^23.0.0",
 		"@atlaskit/editor-plugin-decorations": "^24.0.0",
 		"@atlaskit/editor-plugin-editor-disabled": "^24.0.0",
+		"@atlaskit/editor-plugin-editor-viewmode": "^26.0.0",
 		"@atlaskit/editor-plugin-guideline": "^24.0.0",
 		"@atlaskit/editor-plugin-interaction": "^38.0.0",
 		"@atlaskit/editor-plugin-selection": "^24.0.0",
@@ -43,7 +44,7 @@
 		"@atlaskit/icon-lab": "^7.11.0",
 		"@atlaskit/platform-feature-experiments": "^0.3.0",
 		"@atlaskit/platform-feature-flags": "^2.2.0",
-		"@atlaskit/tmp-editor-statsig": "^222.0.0",
+		"@atlaskit/tmp-editor-statsig": "^224.0.0",
 		"@atlaskit/tokens": "^20.3.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",