@atlaskit/editor-plugin-block-controls 2.13.11 → 2.13.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 2.13.12
4
+
5
+ ### Patch Changes
6
+
7
+ - [#163103](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/163103)
8
+ [`ec14916563763`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/ec14916563763) -
9
+ [ux] [ED-25060] Implement drag and drop a layout column to another layout section
10
+
3
11
  ## 2.13.11
4
12
 
5
13
  ### Patch Changes
@@ -33,26 +33,19 @@ var createNewLayout = function createNewLayout(schema, layoutContents) {
33
33
  }
34
34
  return null;
35
35
  };
36
- var updateColumnWidths = function updateColumnWidths(tr, layoutNode, layoutNodePos, newColumnWidth) {
36
+ var updateColumnWidths = function updateColumnWidths(tr, layoutNode, layoutNodePos, childCount) {
37
+ var newColumnWidth = _consts2.DEFAULT_COLUMN_DISTRIBUTIONS[childCount];
37
38
  if (newColumnWidth) {
38
39
  layoutNode.content.forEach(function (node, offset) {
39
40
  if (node.type.name === 'layoutColumn') {
40
- tr = tr.setNodeAttribute(layoutNodePos + offset + 1, 'width', newColumnWidth);
41
+ tr.setNodeAttribute(layoutNodePos + offset + 1, 'width', newColumnWidth);
41
42
  }
42
43
  });
43
44
  }
44
- return tr;
45
- };
46
-
47
- /**
48
- * Insert a node into an existing layout at position `to` and delete the node
49
- */
50
- var moveNode = function moveNode(from, to, newNode, sourceNodeSize, tr) {
51
- tr.insert(to, newNode).setSelection(new _state.NodeSelection(tr.doc.resolve(to))).scrollIntoView();
52
- var mappedFrom = tr.mapping.map(from);
53
- var mappedFromEnd = mappedFrom + sourceNodeSize;
54
- tr.delete(mappedFrom, mappedFromEnd);
55
- return tr;
45
+ return {
46
+ newColumnWidth: newColumnWidth,
47
+ tr: tr
48
+ };
56
49
  };
57
50
  var moveToExistingLayout = function moveToExistingLayout(toLayout, toLayoutPos, sourceNode, from, to, tr, isSameLayout) {
58
51
  if (isSameLayout) {
@@ -61,16 +54,41 @@ var moveToExistingLayout = function moveToExistingLayout(toLayout, toLayoutPos,
61
54
  var mappedTo = tr.mapping.map(to);
62
55
  tr.insert(mappedTo, sourceNode).setSelection(new _state.NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
63
56
  } else if (toLayout.childCount < (0, _consts.maxLayoutColumnSupported)()) {
64
- var newColumnWidth = _consts2.DEFAULT_COLUMN_DISTRIBUTIONS[toLayout.childCount + 1];
65
- updateColumnWidths(tr, toLayout, toLayoutPos, newColumnWidth);
66
- var _ref2 = tr.doc.type.schema.nodes || {},
67
- layoutColumn = _ref2.layoutColumn;
68
- moveNode(from, to, layoutColumn.create({
69
- width: newColumnWidth
70
- }, sourceNode), sourceNode.nodeSize, tr);
57
+ insertToDestination(tr, to, sourceNode, toLayout, toLayoutPos);
58
+ var mappedFrom = tr.mapping.map(from);
59
+ removeFromSource(tr, tr.doc.resolve(mappedFrom));
71
60
  }
72
61
  return tr;
73
62
  };
63
+ var removeFromSource = function removeFromSource(tr, $from) {
64
+ var sourceNode = $from.nodeAfter;
65
+ var sourceParent = $from.parent;
66
+ if (!sourceNode) {
67
+ return tr;
68
+ }
69
+ var sourceNodeEndPos = $from.pos + sourceNode.nodeSize;
70
+ if (sourceNode.type.name === 'layoutColumn') {
71
+ if (sourceParent.childCount === _consts.MIN_LAYOUT_COLUMN) {
72
+ tr.delete($from.pos + 1, sourceNodeEndPos - 1);
73
+ return tr;
74
+ } else {
75
+ updateColumnWidths(tr, $from.parent, $from.before($from.depth), sourceParent.childCount - 1);
76
+ }
77
+ }
78
+ tr.delete($from.pos, sourceNodeEndPos);
79
+ return tr;
80
+ };
81
+ var insertToDestination = function insertToDestination(tr, to, sourceNode, toLayout, toLayoutPos) {
82
+ var _ref2 = updateColumnWidths(tr, toLayout, toLayoutPos, toLayout.childCount + 1) || {},
83
+ newColumnWidth = _ref2.newColumnWidth;
84
+ var _ref3 = tr.doc.type.schema.nodes || {},
85
+ layoutColumn = _ref3.layoutColumn;
86
+ var content = layoutColumn.createChecked({
87
+ width: newColumnWidth
88
+ }, sourceNode.type.name === 'layoutColumn' ? sourceNode.content : sourceNode);
89
+ tr.insert(to, content).setSelection(new _state.NodeSelection(tr.doc.resolve(to))).scrollIntoView();
90
+ return tr;
91
+ };
74
92
 
75
93
  /**
76
94
  * Check if the node at `from` can be moved to node at `to` to create/expand a layout.
@@ -80,10 +98,10 @@ var canMoveToLayout = function canMoveToLayout(from, to, tr) {
80
98
  if (from === to) {
81
99
  return;
82
100
  }
83
- var _ref3 = tr.doc.type.schema.nodes || {},
84
- layoutSection = _ref3.layoutSection,
85
- layoutColumn = _ref3.layoutColumn,
86
- doc = _ref3.doc;
101
+ var _ref4 = tr.doc.type.schema.nodes || {},
102
+ layoutSection = _ref4.layoutSection,
103
+ layoutColumn = _ref4.layoutColumn,
104
+ doc = _ref4.doc;
87
105
 
88
106
  // layout plugin does not exist
89
107
  if (!layoutSection || !layoutColumn) {
@@ -112,8 +130,8 @@ var canMoveToLayout = function canMoveToLayout(from, to, tr) {
112
130
  };
113
131
  var moveToLayout = exports.moveToLayout = function moveToLayout(api) {
114
132
  return function (from, to, options) {
115
- return function (_ref4) {
116
- var tr = _ref4.tr;
133
+ return function (_ref5) {
134
+ var tr = _ref5.tr;
117
135
  var canMove = canMoveToLayout(from, to, tr);
118
136
  if (!canMove) {
119
137
  return tr;
@@ -122,11 +140,11 @@ var moveToLayout = exports.moveToLayout = function moveToLayout(api) {
122
140
  fromNode = canMove.fromNode,
123
141
  $from = canMove.$from,
124
142
  $to = canMove.$to;
125
- var _ref5 = tr.doc.type.schema.nodes || {},
126
- layoutSection = _ref5.layoutSection,
127
- layoutColumn = _ref5.layoutColumn;
128
- var _ref6 = tr.doc.type.schema.marks || {},
129
- breakout = _ref6.breakout;
143
+ var _ref6 = tr.doc.type.schema.nodes || {},
144
+ layoutSection = _ref6.layoutSection,
145
+ layoutColumn = _ref6.layoutColumn;
146
+ var _ref7 = tr.doc.type.schema.marks || {},
147
+ breakout = _ref7.breakout;
130
148
  var fromNodeWithoutBreakout = fromNode;
131
149
 
132
150
  // remove breakout from node;
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.maxLayoutColumnSupported = exports.DIRECTION = void 0;
6
+ exports.maxLayoutColumnSupported = exports.MIN_LAYOUT_COLUMN = exports.DIRECTION = void 0;
7
7
  var _advancedLayoutsFlags = require("./utils/advanced-layouts-flags");
8
8
  var DIRECTION = exports.DIRECTION = /*#__PURE__*/function (DIRECTION) {
9
9
  DIRECTION["UP"] = "up";
@@ -14,4 +14,5 @@ var DIRECTION = exports.DIRECTION = /*#__PURE__*/function (DIRECTION) {
14
14
  }({});
15
15
  var maxLayoutColumnSupported = exports.maxLayoutColumnSupported = function maxLayoutColumnSupported() {
16
16
  return (0, _advancedLayoutsFlags.isPreRelease2)() ? 5 : 3;
17
- };
17
+ };
18
+ var MIN_LAYOUT_COLUMN = exports.MIN_LAYOUT_COLUMN = 2;
@@ -1,6 +1,6 @@
1
1
  import { Fragment } from '@atlaskit/editor-prosemirror/model';
2
2
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
3
- import { maxLayoutColumnSupported } from '../consts';
3
+ import { maxLayoutColumnSupported, MIN_LAYOUT_COLUMN } from '../consts';
4
4
  import { DEFAULT_COLUMN_DISTRIBUTIONS } from '../ui/consts';
5
5
  import { isInSameLayout } from '../utils/validation';
6
6
  const createNewLayout = (schema, layoutContents) => {
@@ -28,26 +28,19 @@ const createNewLayout = (schema, layoutContents) => {
28
28
  }
29
29
  return null;
30
30
  };
31
- const updateColumnWidths = (tr, layoutNode, layoutNodePos, newColumnWidth) => {
31
+ const updateColumnWidths = (tr, layoutNode, layoutNodePos, childCount) => {
32
+ const newColumnWidth = DEFAULT_COLUMN_DISTRIBUTIONS[childCount];
32
33
  if (newColumnWidth) {
33
34
  layoutNode.content.forEach((node, offset) => {
34
35
  if (node.type.name === 'layoutColumn') {
35
- tr = tr.setNodeAttribute(layoutNodePos + offset + 1, 'width', newColumnWidth);
36
+ tr.setNodeAttribute(layoutNodePos + offset + 1, 'width', newColumnWidth);
36
37
  }
37
38
  });
38
39
  }
39
- return tr;
40
- };
41
-
42
- /**
43
- * Insert a node into an existing layout at position `to` and delete the node
44
- */
45
- const moveNode = (from, to, newNode, sourceNodeSize, tr) => {
46
- tr.insert(to, newNode).setSelection(new NodeSelection(tr.doc.resolve(to))).scrollIntoView();
47
- const mappedFrom = tr.mapping.map(from);
48
- const mappedFromEnd = mappedFrom + sourceNodeSize;
49
- tr.delete(mappedFrom, mappedFromEnd);
50
- return tr;
40
+ return {
41
+ newColumnWidth,
42
+ tr
43
+ };
51
44
  };
52
45
  const moveToExistingLayout = (toLayout, toLayoutPos, sourceNode, from, to, tr, isSameLayout) => {
53
46
  if (isSameLayout) {
@@ -56,15 +49,41 @@ const moveToExistingLayout = (toLayout, toLayoutPos, sourceNode, from, to, tr, i
56
49
  const mappedTo = tr.mapping.map(to);
57
50
  tr.insert(mappedTo, sourceNode).setSelection(new NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
58
51
  } else if (toLayout.childCount < maxLayoutColumnSupported()) {
59
- const newColumnWidth = DEFAULT_COLUMN_DISTRIBUTIONS[toLayout.childCount + 1];
60
- updateColumnWidths(tr, toLayout, toLayoutPos, newColumnWidth);
61
- const {
62
- layoutColumn
63
- } = tr.doc.type.schema.nodes || {};
64
- moveNode(from, to, layoutColumn.create({
65
- width: newColumnWidth
66
- }, sourceNode), sourceNode.nodeSize, tr);
52
+ insertToDestination(tr, to, sourceNode, toLayout, toLayoutPos);
53
+ const mappedFrom = tr.mapping.map(from);
54
+ removeFromSource(tr, tr.doc.resolve(mappedFrom));
55
+ }
56
+ return tr;
57
+ };
58
+ const removeFromSource = (tr, $from) => {
59
+ const sourceNode = $from.nodeAfter;
60
+ const sourceParent = $from.parent;
61
+ if (!sourceNode) {
62
+ return tr;
67
63
  }
64
+ const sourceNodeEndPos = $from.pos + sourceNode.nodeSize;
65
+ if (sourceNode.type.name === 'layoutColumn') {
66
+ if (sourceParent.childCount === MIN_LAYOUT_COLUMN) {
67
+ tr.delete($from.pos + 1, sourceNodeEndPos - 1);
68
+ return tr;
69
+ } else {
70
+ updateColumnWidths(tr, $from.parent, $from.before($from.depth), sourceParent.childCount - 1);
71
+ }
72
+ }
73
+ tr.delete($from.pos, sourceNodeEndPos);
74
+ return tr;
75
+ };
76
+ const insertToDestination = (tr, to, sourceNode, toLayout, toLayoutPos) => {
77
+ const {
78
+ newColumnWidth
79
+ } = updateColumnWidths(tr, toLayout, toLayoutPos, toLayout.childCount + 1) || {};
80
+ const {
81
+ layoutColumn
82
+ } = tr.doc.type.schema.nodes || {};
83
+ const content = layoutColumn.createChecked({
84
+ width: newColumnWidth
85
+ }, sourceNode.type.name === 'layoutColumn' ? sourceNode.content : sourceNode);
86
+ tr.insert(to, content).setSelection(new NodeSelection(tr.doc.resolve(to))).scrollIntoView();
68
87
  return tr;
69
88
  };
70
89
 
@@ -8,4 +8,5 @@ export let DIRECTION = /*#__PURE__*/function (DIRECTION) {
8
8
  }({});
9
9
  export const maxLayoutColumnSupported = () => {
10
10
  return isPreRelease2() ? 5 : 3;
11
- };
11
+ };
12
+ export const MIN_LAYOUT_COLUMN = 2;
@@ -1,6 +1,6 @@
1
1
  import { Fragment } from '@atlaskit/editor-prosemirror/model';
2
2
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
3
- import { maxLayoutColumnSupported } from '../consts';
3
+ import { maxLayoutColumnSupported, MIN_LAYOUT_COLUMN } from '../consts';
4
4
  import { DEFAULT_COLUMN_DISTRIBUTIONS } from '../ui/consts';
5
5
  import { isInSameLayout } from '../utils/validation';
6
6
  var createNewLayout = function createNewLayout(schema, layoutContents) {
@@ -27,26 +27,19 @@ var createNewLayout = function createNewLayout(schema, layoutContents) {
27
27
  }
28
28
  return null;
29
29
  };
30
- var updateColumnWidths = function updateColumnWidths(tr, layoutNode, layoutNodePos, newColumnWidth) {
30
+ var updateColumnWidths = function updateColumnWidths(tr, layoutNode, layoutNodePos, childCount) {
31
+ var newColumnWidth = DEFAULT_COLUMN_DISTRIBUTIONS[childCount];
31
32
  if (newColumnWidth) {
32
33
  layoutNode.content.forEach(function (node, offset) {
33
34
  if (node.type.name === 'layoutColumn') {
34
- tr = tr.setNodeAttribute(layoutNodePos + offset + 1, 'width', newColumnWidth);
35
+ tr.setNodeAttribute(layoutNodePos + offset + 1, 'width', newColumnWidth);
35
36
  }
36
37
  });
37
38
  }
38
- return tr;
39
- };
40
-
41
- /**
42
- * Insert a node into an existing layout at position `to` and delete the node
43
- */
44
- var moveNode = function moveNode(from, to, newNode, sourceNodeSize, tr) {
45
- tr.insert(to, newNode).setSelection(new NodeSelection(tr.doc.resolve(to))).scrollIntoView();
46
- var mappedFrom = tr.mapping.map(from);
47
- var mappedFromEnd = mappedFrom + sourceNodeSize;
48
- tr.delete(mappedFrom, mappedFromEnd);
49
- return tr;
39
+ return {
40
+ newColumnWidth: newColumnWidth,
41
+ tr: tr
42
+ };
50
43
  };
51
44
  var moveToExistingLayout = function moveToExistingLayout(toLayout, toLayoutPos, sourceNode, from, to, tr, isSameLayout) {
52
45
  if (isSameLayout) {
@@ -55,16 +48,41 @@ var moveToExistingLayout = function moveToExistingLayout(toLayout, toLayoutPos,
55
48
  var mappedTo = tr.mapping.map(to);
56
49
  tr.insert(mappedTo, sourceNode).setSelection(new NodeSelection(tr.doc.resolve(mappedTo))).scrollIntoView();
57
50
  } else if (toLayout.childCount < maxLayoutColumnSupported()) {
58
- var newColumnWidth = DEFAULT_COLUMN_DISTRIBUTIONS[toLayout.childCount + 1];
59
- updateColumnWidths(tr, toLayout, toLayoutPos, newColumnWidth);
60
- var _ref2 = tr.doc.type.schema.nodes || {},
61
- layoutColumn = _ref2.layoutColumn;
62
- moveNode(from, to, layoutColumn.create({
63
- width: newColumnWidth
64
- }, sourceNode), sourceNode.nodeSize, tr);
51
+ insertToDestination(tr, to, sourceNode, toLayout, toLayoutPos);
52
+ var mappedFrom = tr.mapping.map(from);
53
+ removeFromSource(tr, tr.doc.resolve(mappedFrom));
65
54
  }
66
55
  return tr;
67
56
  };
57
+ var removeFromSource = function removeFromSource(tr, $from) {
58
+ var sourceNode = $from.nodeAfter;
59
+ var sourceParent = $from.parent;
60
+ if (!sourceNode) {
61
+ return tr;
62
+ }
63
+ var sourceNodeEndPos = $from.pos + sourceNode.nodeSize;
64
+ if (sourceNode.type.name === 'layoutColumn') {
65
+ if (sourceParent.childCount === MIN_LAYOUT_COLUMN) {
66
+ tr.delete($from.pos + 1, sourceNodeEndPos - 1);
67
+ return tr;
68
+ } else {
69
+ updateColumnWidths(tr, $from.parent, $from.before($from.depth), sourceParent.childCount - 1);
70
+ }
71
+ }
72
+ tr.delete($from.pos, sourceNodeEndPos);
73
+ return tr;
74
+ };
75
+ var insertToDestination = function insertToDestination(tr, to, sourceNode, toLayout, toLayoutPos) {
76
+ var _ref2 = updateColumnWidths(tr, toLayout, toLayoutPos, toLayout.childCount + 1) || {},
77
+ newColumnWidth = _ref2.newColumnWidth;
78
+ var _ref3 = tr.doc.type.schema.nodes || {},
79
+ layoutColumn = _ref3.layoutColumn;
80
+ var content = layoutColumn.createChecked({
81
+ width: newColumnWidth
82
+ }, sourceNode.type.name === 'layoutColumn' ? sourceNode.content : sourceNode);
83
+ tr.insert(to, content).setSelection(new NodeSelection(tr.doc.resolve(to))).scrollIntoView();
84
+ return tr;
85
+ };
68
86
 
69
87
  /**
70
88
  * Check if the node at `from` can be moved to node at `to` to create/expand a layout.
@@ -74,10 +92,10 @@ var canMoveToLayout = function canMoveToLayout(from, to, tr) {
74
92
  if (from === to) {
75
93
  return;
76
94
  }
77
- var _ref3 = tr.doc.type.schema.nodes || {},
78
- layoutSection = _ref3.layoutSection,
79
- layoutColumn = _ref3.layoutColumn,
80
- doc = _ref3.doc;
95
+ var _ref4 = tr.doc.type.schema.nodes || {},
96
+ layoutSection = _ref4.layoutSection,
97
+ layoutColumn = _ref4.layoutColumn,
98
+ doc = _ref4.doc;
81
99
 
82
100
  // layout plugin does not exist
83
101
  if (!layoutSection || !layoutColumn) {
@@ -106,8 +124,8 @@ var canMoveToLayout = function canMoveToLayout(from, to, tr) {
106
124
  };
107
125
  export var moveToLayout = function moveToLayout(api) {
108
126
  return function (from, to, options) {
109
- return function (_ref4) {
110
- var tr = _ref4.tr;
127
+ return function (_ref5) {
128
+ var tr = _ref5.tr;
111
129
  var canMove = canMoveToLayout(from, to, tr);
112
130
  if (!canMove) {
113
131
  return tr;
@@ -116,11 +134,11 @@ export var moveToLayout = function moveToLayout(api) {
116
134
  fromNode = canMove.fromNode,
117
135
  $from = canMove.$from,
118
136
  $to = canMove.$to;
119
- var _ref5 = tr.doc.type.schema.nodes || {},
120
- layoutSection = _ref5.layoutSection,
121
- layoutColumn = _ref5.layoutColumn;
122
- var _ref6 = tr.doc.type.schema.marks || {},
123
- breakout = _ref6.breakout;
137
+ var _ref6 = tr.doc.type.schema.nodes || {},
138
+ layoutSection = _ref6.layoutSection,
139
+ layoutColumn = _ref6.layoutColumn;
140
+ var _ref7 = tr.doc.type.schema.marks || {},
141
+ breakout = _ref7.breakout;
124
142
  var fromNodeWithoutBreakout = fromNode;
125
143
 
126
144
  // remove breakout from node;
@@ -8,4 +8,5 @@ export var DIRECTION = /*#__PURE__*/function (DIRECTION) {
8
8
  }({});
9
9
  export var maxLayoutColumnSupported = function maxLayoutColumnSupported() {
10
10
  return isPreRelease2() ? 5 : 3;
11
- };
11
+ };
12
+ export var MIN_LAYOUT_COLUMN = 2;
@@ -5,3 +5,4 @@ export declare enum DIRECTION {
5
5
  RIGHT = "right"
6
6
  }
7
7
  export declare const maxLayoutColumnSupported: () => 5 | 3;
8
+ export declare const MIN_LAYOUT_COLUMN = 2;
@@ -5,3 +5,4 @@ export declare enum DIRECTION {
5
5
  RIGHT = "right"
6
6
  }
7
7
  export declare const maxLayoutColumnSupported: () => 5 | 3;
8
+ export declare const MIN_LAYOUT_COLUMN = 2;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-controls",
3
- "version": "2.13.11",
3
+ "version": "2.13.12",
4
4
  "description": "Block controls plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -31,7 +31,7 @@
31
31
  },
32
32
  "dependencies": {
33
33
  "@atlaskit/adf-schema": "^44.2.0",
34
- "@atlaskit/editor-common": "^94.16.0",
34
+ "@atlaskit/editor-common": "^94.20.0",
35
35
  "@atlaskit/editor-plugin-accessibility-utils": "^1.2.0",
36
36
  "@atlaskit/editor-plugin-analytics": "^1.10.0",
37
37
  "@atlaskit/editor-plugin-editor-disabled": "^1.3.0",
@@ -48,7 +48,7 @@
48
48
  "@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^1.1.0",
49
49
  "@atlaskit/primitives": "^13.1.0",
50
50
  "@atlaskit/theme": "^14.0.0",
51
- "@atlaskit/tmp-editor-statsig": "^2.12.0",
51
+ "@atlaskit/tmp-editor-statsig": "^2.14.0",
52
52
  "@atlaskit/tokens": "^2.2.0",
53
53
  "@atlaskit/tooltip": "^18.9.0",
54
54
  "@babel/runtime": "^7.0.0",