@atlaskit/editor-plugin-layout 1.13.1 → 1.15.0

package/CHANGELOG.md

@@ -1,5 +1,29 @@
 # @atlaskit/editor-plugin-layout
 
+## 1.15.0
+
+### Minor Changes
+
+- [#105322](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/105322)
+  [`8876083532adc`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/8876083532adc) -
+  Bumped editor-prosemirror version to 7.0.0
+
+### Patch Changes
+
+- Updated dependencies
+
+## 1.14.0
+
+### Minor Changes
+
+- [#109549](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/109549)
+  [`d6907dac2c08d`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/d6907dac2c08d) -
+  ED-26300 Delete a layout section by delete the 2nd last column from the layout
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 1.13.1
 
 ### Patch Changes

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

@@ -392,9 +392,12 @@ function layoutNeedChanges(node) {
 var getDefaultPresetLayout = function getDefaultPresetLayout(layoutNode) {
   var layoutColumnCount = layoutNode.childCount;
   if (layoutColumnCount <= 1) {
+    if ((0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_dnd_remove_layout')) {
+      return 'single';
+    }
+
     // This prevents the creation of a single column layout
     // once we support single column layout, we can return 'single'
-
     return (0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_post_fix_patch_1') ? 'two_equal' : 'single';
   }
   switch (layoutColumnCount) {

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

@@ -10,11 +10,14 @@ var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _selection = require("@atlaskit/editor-common/selection");
 var _utils = require("@atlaskit/editor-common/utils");
 var _keymap = require("@atlaskit/editor-prosemirror/keymap");
+var _model = require("@atlaskit/editor-prosemirror/model");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils2 = require("@atlaskit/editor-prosemirror/utils");
 var _view = require("@atlaskit/editor-prosemirror/view");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _actions = require("./actions");
+var _consts = require("./consts");
 var _pluginKey = require("./plugin-key");
 var _utils3 = require("./utils");
 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; }
@@ -80,7 +83,23 @@ var getInitialPluginState = function getInitialPluginState(options, state) {
 var handleDeleteLayoutColumn = function handleDeleteLayoutColumn(state, dispatch) {
   var sel = state.selection;
   if (sel instanceof _state.NodeSelection && sel.node.type.name === 'layoutColumn' && sel.$from.parent.type.name === 'layoutSection' && sel.$from.parent.childCount === 2 && dispatch && (0, _experiments.editorExperiment)('advanced_layouts', true)) {
-    dispatch(state.tr.deleteRange(sel.from + 1, sel.from + sel.node.content.size));
+    if ((0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_dnd_remove_layout')) {
+      var _sel$$from$parent$las, _sel$$from$parent$fir;
+      var tr = state.tr;
+      var layoutContentFragment = sel.$from.parentOffset === 0 ? _model.Fragment.from((_sel$$from$parent$las = sel.$from.parent.lastChild) === null || _sel$$from$parent$las === void 0 ? void 0 : _sel$$from$parent$las.content) : _model.Fragment.from((_sel$$from$parent$fir = sel.$from.parent.firstChild) === null || _sel$$from$parent$fir === void 0 ? void 0 : _sel$$from$parent$fir.content);
+      var parent = (0, _utils2.findParentNodeClosestToPos)(sel.$from, function (node) {
+        return node.type.name === 'layoutSection';
+      });
+      if (parent) {
+        var layoutSectionPos = tr.mapping.map(parent.pos);
+        var layoutSectionNodeSize = parent.node.nodeSize;
+        dispatch(state.tr.replaceWith(layoutSectionPos, layoutSectionPos + layoutSectionNodeSize, layoutContentFragment));
+        return true;
+      }
+      return false;
+    } else {
+      dispatch(state.tr.deleteRange(sel.from + 1, sel.from + sel.node.content.size));
+    }
     return true;
   }
   return false;
@@ -152,19 +171,34 @@ var _default = exports.default = function _default(options) {
           changes.push(change);
         }
       });
+      if ((0, _experiments.editorExperiment)('advanced_layouts', true) && changes.length === 1 && (0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_dnd_remove_layout')) {
+        var _change$slice$content, _change$slice$content2;
+        var change = changes[0];
+        // when need to update a layoutColumn with width 100
+        // meaning a single column layout has been create,
+        // We replace the layout with its content
+        // This is to prevent a single column layout from being created
+        // when a user deletes a layoutColumn
+        if (change.slice.content.childCount === 1 && ((_change$slice$content = change.slice.content.firstChild) === null || _change$slice$content === void 0 ? void 0 : _change$slice$content.type.name) === 'layoutColumn' && ((_change$slice$content2 = change.slice.content.firstChild) === null || _change$slice$content2 === void 0 ? void 0 : _change$slice$content2.attrs.width) === _consts.EVEN_DISTRIBUTED_COL_WIDTHS[1]) {
+          var tr = newState.tr;
+          var content = change.slice.content.firstChild.content;
+          tr.replaceWith(change.from - 1, change.to, content);
+          return tr;
+        }
+      }
       if (changes.length) {
-        var tr = newState.tr;
+        var _tr = newState.tr;
         var selection = newState.selection.toJSON();
         changes.forEach(function (change) {
-          tr.replaceRange(change.from, change.to, change.slice);
+          _tr.replaceRange(change.from, change.to, change.slice);
         });
 
         // selecting and deleting across columns in 3 col layouts can remove
         // a layoutColumn so we fix the structure here
-        tr = (0, _actions.fixColumnStructure)(newState) || tr;
-        if (tr.docChanged) {
-          tr.setSelection(_state.Selection.fromJSON(tr.doc, selection));
-          return tr;
+        _tr = (0, _actions.fixColumnStructure)(newState) || _tr;
+        if (_tr.docChanged) {
+          _tr.setSelection(_state.Selection.fromJSON(_tr.doc, selection));
+          return _tr;
         }
       }
       return;

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

@@ -367,9 +367,12 @@ function layoutNeedChanges(node) {
 const getDefaultPresetLayout = layoutNode => {
   const layoutColumnCount = layoutNode.childCount;
   if (layoutColumnCount <= 1) {
+    if (fg('platform_editor_advanced_layouts_dnd_remove_layout')) {
+      return 'single';
+    }
+
     // This prevents the creation of a single column layout
     // once we support single column layout, we can return 'single'
-
     return fg('platform_editor_advanced_layouts_post_fix_patch_1') ? 'two_equal' : 'single';
   }
   switch (layoutColumnCount) {

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

@@ -2,11 +2,14 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { createSelectionClickHandler } from '@atlaskit/editor-common/selection';
 import { filterCommand as filter } from '@atlaskit/editor-common/utils';
 import { keydownHandler } from '@atlaskit/editor-prosemirror/keymap';
+import { Fragment } from '@atlaskit/editor-prosemirror/model';
 import { NodeSelection, Selection, TextSelection } from '@atlaskit/editor-prosemirror/state';
-import { findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
+import { findParentNodeClosestToPos, findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
 import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { fixColumnSizes, fixColumnStructure, getSelectedLayout } from './actions';
+import { EVEN_DISTRIBUTED_COL_WIDTHS } from './consts';
 import { pluginKey } from './plugin-key';
 import { getMaybeLayoutSection } from './utils';
 export const DEFAULT_LAYOUT = 'two_equal';
@@ -75,7 +78,23 @@ const getInitialPluginState = (options, state) => {
 const handleDeleteLayoutColumn = (state, dispatch) => {
   const sel = state.selection;
   if (sel instanceof NodeSelection && sel.node.type.name === 'layoutColumn' && sel.$from.parent.type.name === 'layoutSection' && sel.$from.parent.childCount === 2 && dispatch && editorExperiment('advanced_layouts', true)) {
-    dispatch(state.tr.deleteRange(sel.from + 1, sel.from + sel.node.content.size));
+    if (fg('platform_editor_advanced_layouts_dnd_remove_layout')) {
+      var _sel$$from$parent$las, _sel$$from$parent$fir;
+      const tr = state.tr;
+      const layoutContentFragment = sel.$from.parentOffset === 0 ? Fragment.from((_sel$$from$parent$las = sel.$from.parent.lastChild) === null || _sel$$from$parent$las === void 0 ? void 0 : _sel$$from$parent$las.content) : Fragment.from((_sel$$from$parent$fir = sel.$from.parent.firstChild) === null || _sel$$from$parent$fir === void 0 ? void 0 : _sel$$from$parent$fir.content);
+      const parent = findParentNodeClosestToPos(sel.$from, node => {
+        return node.type.name === 'layoutSection';
+      });
+      if (parent) {
+        const layoutSectionPos = tr.mapping.map(parent.pos);
+        const layoutSectionNodeSize = parent.node.nodeSize;
+        dispatch(state.tr.replaceWith(layoutSectionPos, layoutSectionPos + layoutSectionNodeSize, layoutContentFragment));
+        return true;
+      }
+      return false;
+    } else {
+      dispatch(state.tr.deleteRange(sel.from + 1, sel.from + sel.node.content.size));
+    }
     return true;
   }
   return false;
@@ -141,6 +160,23 @@ export default (options => new SafePlugin({
         changes.push(change);
       }
     });
+    if (editorExperiment('advanced_layouts', true) && changes.length === 1 && fg('platform_editor_advanced_layouts_dnd_remove_layout')) {
+      var _change$slice$content, _change$slice$content2;
+      const change = changes[0];
+      // when need to update a layoutColumn with width 100
+      // meaning a single column layout has been create,
+      // We replace the layout with its content
+      // This is to prevent a single column layout from being created
+      // when a user deletes a layoutColumn
+      if (change.slice.content.childCount === 1 && ((_change$slice$content = change.slice.content.firstChild) === null || _change$slice$content === void 0 ? void 0 : _change$slice$content.type.name) === 'layoutColumn' && ((_change$slice$content2 = change.slice.content.firstChild) === null || _change$slice$content2 === void 0 ? void 0 : _change$slice$content2.attrs.width) === EVEN_DISTRIBUTED_COL_WIDTHS[1]) {
+        const tr = newState.tr;
+        const {
+          content
+        } = change.slice.content.firstChild;
+        tr.replaceWith(change.from - 1, change.to, content);
+        return tr;
+      }
+    }
     if (changes.length) {
       let tr = newState.tr;
       const selection = newState.selection.toJSON();

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

@@ -383,9 +383,12 @@ function layoutNeedChanges(node) {
 var getDefaultPresetLayout = function getDefaultPresetLayout(layoutNode) {
   var layoutColumnCount = layoutNode.childCount;
   if (layoutColumnCount <= 1) {
+    if (fg('platform_editor_advanced_layouts_dnd_remove_layout')) {
+      return 'single';
+    }
+
     // This prevents the creation of a single column layout
     // once we support single column layout, we can return 'single'
-
     return fg('platform_editor_advanced_layouts_post_fix_patch_1') ? 'two_equal' : 'single';
   }
   switch (layoutColumnCount) {

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

@@ -5,11 +5,14 @@ import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { createSelectionClickHandler } from '@atlaskit/editor-common/selection';
 import { filterCommand as filter } from '@atlaskit/editor-common/utils';
 import { keydownHandler } from '@atlaskit/editor-prosemirror/keymap';
+import { Fragment } from '@atlaskit/editor-prosemirror/model';
 import { NodeSelection, Selection, TextSelection } from '@atlaskit/editor-prosemirror/state';
-import { findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
+import { findParentNodeClosestToPos, findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
 import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { fixColumnSizes, fixColumnStructure, getSelectedLayout } from './actions';
+import { EVEN_DISTRIBUTED_COL_WIDTHS } from './consts';
 import { pluginKey } from './plugin-key';
 import { getMaybeLayoutSection } from './utils';
 export var DEFAULT_LAYOUT = 'two_equal';
@@ -73,7 +76,23 @@ var getInitialPluginState = function getInitialPluginState(options, state) {
 var handleDeleteLayoutColumn = function handleDeleteLayoutColumn(state, dispatch) {
   var sel = state.selection;
   if (sel instanceof NodeSelection && sel.node.type.name === 'layoutColumn' && sel.$from.parent.type.name === 'layoutSection' && sel.$from.parent.childCount === 2 && dispatch && editorExperiment('advanced_layouts', true)) {
-    dispatch(state.tr.deleteRange(sel.from + 1, sel.from + sel.node.content.size));
+    if (fg('platform_editor_advanced_layouts_dnd_remove_layout')) {
+      var _sel$$from$parent$las, _sel$$from$parent$fir;
+      var tr = state.tr;
+      var layoutContentFragment = sel.$from.parentOffset === 0 ? Fragment.from((_sel$$from$parent$las = sel.$from.parent.lastChild) === null || _sel$$from$parent$las === void 0 ? void 0 : _sel$$from$parent$las.content) : Fragment.from((_sel$$from$parent$fir = sel.$from.parent.firstChild) === null || _sel$$from$parent$fir === void 0 ? void 0 : _sel$$from$parent$fir.content);
+      var parent = findParentNodeClosestToPos(sel.$from, function (node) {
+        return node.type.name === 'layoutSection';
+      });
+      if (parent) {
+        var layoutSectionPos = tr.mapping.map(parent.pos);
+        var layoutSectionNodeSize = parent.node.nodeSize;
+        dispatch(state.tr.replaceWith(layoutSectionPos, layoutSectionPos + layoutSectionNodeSize, layoutContentFragment));
+        return true;
+      }
+      return false;
+    } else {
+      dispatch(state.tr.deleteRange(sel.from + 1, sel.from + sel.node.content.size));
+    }
     return true;
   }
   return false;
@@ -145,19 +164,34 @@ export default (function (options) {
           changes.push(change);
         }
       });
+      if (editorExperiment('advanced_layouts', true) && changes.length === 1 && fg('platform_editor_advanced_layouts_dnd_remove_layout')) {
+        var _change$slice$content, _change$slice$content2;
+        var change = changes[0];
+        // when need to update a layoutColumn with width 100
+        // meaning a single column layout has been create,
+        // We replace the layout with its content
+        // This is to prevent a single column layout from being created
+        // when a user deletes a layoutColumn
+        if (change.slice.content.childCount === 1 && ((_change$slice$content = change.slice.content.firstChild) === null || _change$slice$content === void 0 ? void 0 : _change$slice$content.type.name) === 'layoutColumn' && ((_change$slice$content2 = change.slice.content.firstChild) === null || _change$slice$content2 === void 0 ? void 0 : _change$slice$content2.attrs.width) === EVEN_DISTRIBUTED_COL_WIDTHS[1]) {
+          var tr = newState.tr;
+          var content = change.slice.content.firstChild.content;
+          tr.replaceWith(change.from - 1, change.to, content);
+          return tr;
+        }
+      }
       if (changes.length) {
-        var tr = newState.tr;
+        var _tr = newState.tr;
         var selection = newState.selection.toJSON();
         changes.forEach(function (change) {
-          tr.replaceRange(change.from, change.to, change.slice);
+          _tr.replaceRange(change.from, change.to, change.slice);
         });
 
         // selecting and deleting across columns in 3 col layouts can remove
         // a layoutColumn so we fix the structure here
-        tr = fixColumnStructure(newState) || tr;
-        if (tr.docChanged) {
-          tr.setSelection(Selection.fromJSON(tr.doc, selection));
-          return tr;
+        _tr = fixColumnStructure(newState) || _tr;
+        if (_tr.docChanged) {
+          _tr.setSelection(Selection.fromJSON(_tr.doc, selection));
+          return _tr;
         }
       }
       return;

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

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import { type EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import { type PortalProviderAPI } from '@atlaskit/editor-common/portal';
 import ReactNodeView from '@atlaskit/editor-common/react-node-view';
@@ -35,10 +35,10 @@ export declare class LayoutSectionView extends ReactNodeView<LayoutSectionViewPr
         contentDOM: HTMLElement | undefined;
     };
     setDomAttrs(node: PMNode, element: HTMLElement): void;
-    render(props: LayoutSectionViewProps, forwardRef: ForwardRef): JSX.Element;
+    render(props: LayoutSectionViewProps, forwardRef: ForwardRef): React.JSX.Element;
     ignoreMutation(mutation: MutationRecord | {
         type: 'selection';
-        target: Element;
+        target: Node;
     }): boolean;
 }
 export {};

package/dist/types-ts4.5/nodeviews/index.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import { type EventDispatcher } from '@atlaskit/editor-common/event-dispatcher';
 import { type PortalProviderAPI } from '@atlaskit/editor-common/portal';
 import ReactNodeView from '@atlaskit/editor-common/react-node-view';
@@ -35,10 +35,10 @@ export declare class LayoutSectionView extends ReactNodeView<LayoutSectionViewPr
         contentDOM: HTMLElement | undefined;
     };
     setDomAttrs(node: PMNode, element: HTMLElement): void;
-    render(props: LayoutSectionViewProps, forwardRef: ForwardRef): JSX.Element;
+    render(props: LayoutSectionViewProps, forwardRef: ForwardRef): React.JSX.Element;
     ignoreMutation(mutation: MutationRecord | {
         type: 'selection';
-        target: Element;
+        target: Node;
     }): boolean;
 }
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-layout",
-	"version": "1.13.1",
+	"version": "1.15.0",
 	"description": "Layout plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -32,16 +32,16 @@
 	},
 	"dependencies": {
 		"@atlaskit/adf-schema": "^46.1.0",
-		"@atlaskit/editor-common": "^99.7.0",
-		"@atlaskit/editor-plugin-analytics": "^1.11.0",
-		"@atlaskit/editor-plugin-decorations": "^1.4.0",
-		"@atlaskit/editor-plugin-editor-disabled": "^1.4.0",
-		"@atlaskit/editor-plugin-selection": "^1.6.0",
-		"@atlaskit/editor-plugin-width": "^2.0.0",
-		"@atlaskit/editor-prosemirror": "6.2.1",
-		"@atlaskit/icon": "^23.6.0",
+		"@atlaskit/editor-common": "^99.10.0",
+		"@atlaskit/editor-plugin-analytics": "^1.12.0",
+		"@atlaskit/editor-plugin-decorations": "^1.5.0",
+		"@atlaskit/editor-plugin-editor-disabled": "^1.5.0",
+		"@atlaskit/editor-plugin-selection": "^1.7.0",
+		"@atlaskit/editor-plugin-width": "^2.1.0",
+		"@atlaskit/editor-prosemirror": "7.0.0",
+		"@atlaskit/icon": "^23.7.0",
 		"@atlaskit/platform-feature-flags": "^1.0.0",
-		"@atlaskit/tmp-editor-statsig": "^2.41.0",
+		"@atlaskit/tmp-editor-statsig": "^2.43.0",
 		"@atlaskit/tokens": "^3.3.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1"
@@ -106,6 +106,9 @@
 		},
 		"platform_editor_advanced_layouts_post_fix_patch_3": {
 			"type": "boolean"
+		},
+		"platform_editor_advanced_layouts_dnd_remove_layout": {
+			"type": "boolean"
 		}
 	}
 }