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

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,17 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 2.13.13
4
+
5
+ ### Patch Changes
6
+
7
+ - [#164606](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/164606)
8
+ [`34e9782c56a3f`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/34e9782c56a3f) -
9
+ tidy platform_editor_empty_line_prompt experiment
10
+ - [#163518](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/163518)
11
+ [`0c4fc567f6cfd`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/0c4fc567f6cfd) -
12
+ ED-25705 fix sticky header
13
+ - Updated dependencies
14
+
3
15
  ## 2.13.12
4
16
 
5
17
  ### Patch Changes
@@ -5,13 +5,10 @@ Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
7
  exports.blockControlsPlugin = void 0;
8
- var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
9
8
  var _react = _interopRequireDefault(require("react"));
10
9
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
11
- var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
12
10
  var _moveNode = require("./commands/move-node");
13
11
  var _moveToLayout = require("./commands/move-to-layout");
14
- var _emptyBlockExperiment = require("./pm-plugins/empty-block-experiment");
15
12
  var _main = require("./pm-plugins/main");
16
13
  var _dragHandleMenu = require("./ui/drag-handle-menu");
17
14
  var _globalStyles = require("./ui/global-styles");
@@ -27,22 +24,14 @@ var blockControlsPlugin = exports.blockControlsPlugin = function blockControlsPl
27
24
  var getIntl = _ref2.getIntl;
28
25
  return (0, _main.createPlugin)(api, getIntl);
29
26
  }
30
- }].concat((0, _toConsumableArray2.default)((0, _experiments.editorExperiment)('platform_editor_empty_line_prompt', true, {
31
- exposure: true
32
- }) ? [{
33
- name: 'emptyBlockExperimentPlugin',
34
- plugin: function plugin(_ref3) {
35
- var getIntl = _ref3.getIntl;
36
- return (0, _emptyBlockExperiment.createEmptyBlockExperimentPlugin)(api, getIntl);
37
- }
38
- }] : []));
27
+ }];
39
28
  },
40
29
  commands: {
41
30
  moveNode: (0, _moveNode.moveNode)(api),
42
31
  moveToLayout: (0, _moveToLayout.moveToLayout)(api),
43
32
  showDragHandleAt: function showDragHandleAt(pos, anchorName, nodeType, handleOptions) {
44
- return function (_ref4) {
45
- var tr = _ref4.tr;
33
+ return function (_ref3) {
34
+ var tr = _ref3.tr;
46
35
  tr.setMeta(_main.key, {
47
36
  activeNode: {
48
37
  pos: pos,
@@ -55,8 +44,8 @@ var blockControlsPlugin = exports.blockControlsPlugin = function blockControlsPl
55
44
  };
56
45
  },
57
46
  setNodeDragged: function setNodeDragged(getPos, anchorName, nodeType) {
58
- return function (_ref5) {
59
- var tr = _ref5.tr;
47
+ return function (_ref4) {
48
+ var tr = _ref4.tr;
60
49
  var pos = getPos();
61
50
  if (pos === undefined) {
62
51
  return tr;
@@ -33,8 +33,8 @@ var shouldIgnoreNode = function shouldIgnoreNode(node, ignore_nodes, depth, pare
33
33
 
34
34
  // TODO use isWrappedMedia when clean up the feature flag
35
35
  var isMediaSingle = 'mediaSingle' === node.type.name && (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_1');
36
- var isFirstTableHeaderOrTableRow = (parent === null || parent === void 0 ? void 0 : parent.type.name) === 'table' && depth === 1 && node === parent.firstChild && ['tableHeader', 'tableRow'].includes(node.type.name) && (0, _advancedLayoutsFlags.isPreRelease1)();
37
- if (isFirstTableHeaderOrTableRow) {
36
+ var isFirstTableRow = (parent === null || parent === void 0 ? void 0 : parent.type.name) === 'table' && depth === 1 && node === parent.firstChild && 'tableRow' === node.type.name && (0, _advancedLayoutsFlags.isPreRelease1)();
37
+ if (isFirstTableRow) {
38
38
  return false;
39
39
  }
40
40
  return (isEmbedCard || isMediaSingle) && ['wrap-right', 'wrap-left'].includes(node.attrs.layout) ? true : ignore_nodes.includes(node.type.name);
@@ -95,8 +95,9 @@ var nodeDecorations = exports.nodeDecorations = function nodeDecorations(newStat
95
95
  var _anchorName2;
96
96
  anchorName = (_anchorName2 = anchorName) !== null && _anchorName2 !== void 0 ? _anchorName2 : "--node-anchor-".concat(node.type.name, "-").concat(index);
97
97
  }
98
+ var anchorStyles = ['tableRow', 'media'].includes(node.type.name) ? "anchor-name: ".concat(anchorName, ";") : "anchor-name: ".concat(anchorName, "; ").concat(pos === 0 && !(0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_3') ? 'margin-top: 0px;' : '', " ").concat((0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_3') ? '' : 'position: relative; z-index: 1;');
98
99
  decs.push(_view.Decoration.node(pos, pos + node.nodeSize, (_Decoration$node = {
99
- style: "anchor-name: ".concat(anchorName, "; ").concat(pos === 0 && !(0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_3') ? 'margin-top: 0px;' : '', " ").concat((0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_3') ? '' : 'position: relative; z-index: 1;')
100
+ style: anchorStyles
100
101
  }, (0, _defineProperty2.default)(_Decoration$node, 'data-drag-handler-anchor-name', anchorName), (0, _defineProperty2.default)(_Decoration$node, 'data-drag-handler-node-type', node.type.name), (0, _defineProperty2.default)(_Decoration$node, 'data-drag-handler-anchor-depth', "".concat(depth)), _Decoration$node), {
101
102
  type: _decorationsCommon.TYPE_NODE_DEC,
102
103
  anchorName: anchorName,
@@ -11,122 +11,94 @@ var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
11
11
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
12
12
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
13
13
  var _consts = require("./consts");
14
- var _globalStyles = require("./empty-block-experiment/global-styles");
15
14
  /**
16
15
  * @jsxRuntime classic
17
16
  * @jsx jsx
18
17
  */
19
18
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-global-styles, @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
20
19
 
20
+ /**
21
+ * This anchor element selector disregards anchors that are solely utilized for size measurements,
22
+ * including those within table rows and media.
23
+ */
24
+ var dragHandlerAnchorSelector = '[data-drag-handler-anchor-name]:not([data-drag-handler-node-type="tableRow"], [data-drag-handler-node-type="media"])';
21
25
  var extendedHoverZone = function extendedHoverZone() {
22
- return (0, _react.css)({
23
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
24
- '.block-ctrl-drag-preview [data-drag-handler-anchor-name]::after': {
25
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
26
- display: 'none !important'
27
- },
28
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
29
- '.ProseMirror': {
30
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
31
- '&& [data-drag-handler-anchor-name]::after': {
32
- content: '""',
33
- position: 'absolute',
34
- top: 0,
35
- left: '-100%',
36
- width: '100%',
37
- height: '100%',
38
- background: 'transparent',
39
- cursor: 'default',
40
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
41
- zIndex: -1
42
- }
43
- },
44
- // TODO - ED-23995 this style override needs to be moved to the Rule styles after FF cleanup - packages/editor/editor-common/src/styles/shared/rule.ts
45
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
46
- 'hr[data-drag-handler-anchor-name]': {
47
- overflow: 'visible'
48
- },
49
- //eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
50
- '[data-blocks-drag-handle-container="true"] + *::after': {
51
- display: 'none'
52
- }
53
- });
26
+ var _css;
27
+ return (0, _react.css)((_css = {}, (0, _defineProperty2.default)(_css, ".block-ctrl-drag-preview ".concat(dragHandlerAnchorSelector, "::after"), {
28
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
29
+ display: 'none !important'
30
+ }), (0, _defineProperty2.default)(_css, '.ProseMirror', (0, _defineProperty2.default)({}, "&& ".concat(dragHandlerAnchorSelector, "::after"), {
31
+ content: '""',
32
+ position: 'absolute',
33
+ top: 0,
34
+ left: '-100%',
35
+ width: '100%',
36
+ height: '100%',
37
+ background: 'transparent',
38
+ cursor: 'default',
39
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
40
+ zIndex: -1
41
+ })), (0, _defineProperty2.default)(_css, 'hr[data-drag-handler-anchor-name]', {
42
+ overflow: 'visible'
43
+ }), (0, _defineProperty2.default)(_css, '[data-blocks-drag-handle-container="true"] + *::after', {
44
+ display: 'none'
45
+ }), _css));
54
46
  };
55
47
  var extendedHoverZoneNested = function extendedHoverZoneNested() {
56
- return (0, _react.css)({
57
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
58
- '.block-ctrl-drag-preview [data-drag-handler-anchor-name]::after': {
59
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
60
- display: 'none !important'
61
- },
62
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
63
- '.ProseMirror': {
64
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
65
- '&& [data-drag-handler-anchor-name]::after': {
66
- content: '""',
67
- position: 'absolute',
68
- top: 0,
69
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
70
- left: "-".concat(_consts.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP, "px"),
71
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
72
- width: "".concat(_consts.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP, "px"),
73
- height: '100%',
74
- cursor: 'default',
75
- zIndex: 1
76
- },
77
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
78
- '&& [data-drag-handler-anchor-depth="0"][data-drag-handler-anchor-name]::after': {
79
- content: '""',
80
- position: 'absolute',
81
- top: 0,
82
- left: '-100%',
83
- width: '100%',
84
- height: '100%',
85
- cursor: 'default',
86
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
87
- zIndex: -1
88
- },
89
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
90
- '&& :is(.pm-table-cell-content-wrap, .pm-table-header-content-wrap) > [data-drag-handler-anchor-name]::after': {
91
- content: '""',
92
- position: 'absolute',
93
- top: 0,
94
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
95
- left: "-".concat((0, _experiments.editorExperiment)('table-nested-dnd', true) ? _consts.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP : 0, "px"),
96
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
97
- width: "".concat((0, _experiments.editorExperiment)('table-nested-dnd', true) ? _consts.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP : 0, "px"),
98
- height: '100%',
99
- cursor: 'default',
100
- zIndex: 1
101
- },
102
- // hover zone for layout column should be placed near the top of the column (where drag handle is)
103
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
104
- '&& [data-drag-handler-anchor-name][data-layout-column]::after': {
105
- content: '""',
106
- position: 'absolute',
107
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
108
- top: "".concat(-_consts.DRAG_HANDLE_WIDTH / 2, "px"),
109
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
110
- left: 0,
111
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
112
- width: '100%',
113
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
114
- height: "".concat(_consts.DRAG_HANDLE_WIDTH, "px"),
115
- cursor: 'default',
116
- zIndex: 1
117
- }
118
- },
119
- // TODO - ED-23995 this style override needs to be moved to the Rule styles after FF cleanup - packages/editor/editor-common/src/styles/shared/rule.ts
120
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
121
- 'hr[data-drag-handler-anchor-name]': {
122
- overflow: 'visible'
123
- },
124
- //Hide pseudo element at top depth level. Leave for nested depths to prevent mouseover loop.
125
- //eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
126
- '[data-blocks-drag-handle-container="true"] + [data-drag-handler-anchor-depth="0"]::after': {
127
- display: 'none'
128
- }
129
- });
48
+ var _ProseMirror2, _css2;
49
+ return (0, _react.css)((_css2 = {}, (0, _defineProperty2.default)(_css2, ".block-ctrl-drag-preview ".concat(dragHandlerAnchorSelector, "::after"), {
50
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
51
+ display: 'none !important'
52
+ }), (0, _defineProperty2.default)(_css2, '.ProseMirror', (_ProseMirror2 = {}, (0, _defineProperty2.default)(_ProseMirror2, "&& ".concat(dragHandlerAnchorSelector, "::after"), {
53
+ content: '""',
54
+ position: 'absolute',
55
+ top: 0,
56
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
57
+ left: "-".concat(_consts.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP, "px"),
58
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
59
+ width: "".concat(_consts.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP, "px"),
60
+ height: '100%',
61
+ cursor: 'default',
62
+ zIndex: 1
63
+ }), (0, _defineProperty2.default)(_ProseMirror2, "&& [data-drag-handler-anchor-depth=\"0\"]".concat(dragHandlerAnchorSelector, "::after"), {
64
+ content: '""',
65
+ position: 'absolute',
66
+ top: 0,
67
+ left: '-100%',
68
+ width: '100%',
69
+ height: '100%',
70
+ cursor: 'default',
71
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
72
+ zIndex: -1
73
+ }), (0, _defineProperty2.default)(_ProseMirror2, "&& :is(.pm-table-cell-content-wrap, .pm-table-header-content-wrap) > ".concat(dragHandlerAnchorSelector, "::after"), {
74
+ content: '""',
75
+ position: 'absolute',
76
+ top: 0,
77
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
78
+ left: "-".concat((0, _experiments.editorExperiment)('table-nested-dnd', true) ? _consts.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP : 0, "px"),
79
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
80
+ width: "".concat((0, _experiments.editorExperiment)('table-nested-dnd', true) ? _consts.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP : 0, "px"),
81
+ height: '100%',
82
+ cursor: 'default',
83
+ zIndex: 1
84
+ }), (0, _defineProperty2.default)(_ProseMirror2, '&& [data-drag-handler-anchor-name][data-layout-column]::after', {
85
+ content: '""',
86
+ position: 'absolute',
87
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
88
+ top: "".concat(-_consts.DRAG_HANDLE_WIDTH / 2, "px"),
89
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
90
+ left: 0,
91
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
92
+ width: '100%',
93
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
94
+ height: "".concat(_consts.DRAG_HANDLE_WIDTH, "px"),
95
+ cursor: 'default',
96
+ zIndex: 1
97
+ }), _ProseMirror2)), (0, _defineProperty2.default)(_css2, 'hr[data-drag-handler-anchor-name]', {
98
+ overflow: 'visible'
99
+ }), (0, _defineProperty2.default)(_css2, '[data-blocks-drag-handle-container="true"] + [data-drag-handler-anchor-depth="0"]::after', {
100
+ display: 'none'
101
+ }), _css2));
130
102
  };
131
103
  var paragraphWithTrailingBreakAsOnlyChild = '+ :is(p, h1, h2, h3, h4, h5, h6) > .ProseMirror-trailingBreak:only-child';
132
104
  var indentatedParagraphWithTrailingBreakAsOnlyChild = '+ div.fabric-editor-indentation-mark > :is(p, h1, h2, h3, h4, h5, h6) > .ProseMirror-trailingBreak:only-child';
@@ -211,21 +183,15 @@ var getTextNodeStyle = function getTextNodeStyle() {
211
183
  };
212
184
  var withRelativePosStyle = (0, _react.css)({
213
185
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
214
- '.ProseMirror': {
215
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
216
- '&& [data-drag-handler-anchor-name]': {
217
- position: 'relative'
218
- }
219
- }
186
+ '.ProseMirror': (0, _defineProperty2.default)({}, "&& ".concat(dragHandlerAnchorSelector), {
187
+ position: 'relative'
188
+ })
220
189
  });
221
190
  var withAnchorNameZindexStyle = (0, _react.css)({
222
191
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
223
- '.ProseMirror': {
224
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
225
- '&& [data-drag-handler-anchor-name]': {
226
- zIndex: 1
227
- }
228
- }
192
+ '.ProseMirror': (0, _defineProperty2.default)({}, "&& ".concat(dragHandlerAnchorSelector), {
193
+ zIndex: 1
194
+ })
229
195
  });
230
196
  var withAnchorNameZindexNestedStyle = (0, _react.css)({
231
197
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
@@ -238,8 +204,6 @@ var withAnchorNameZindexNestedStyle = (0, _react.css)({
238
204
  });
239
205
  var GlobalStylesWrapper = exports.GlobalStylesWrapper = function GlobalStylesWrapper() {
240
206
  return (0, _react.jsx)(_react.Global, {
241
- styles: [globalStyles(), (0, _experiments.editorExperiment)('nested-dnd', true) ? extendedHoverZoneNested() : extendedHoverZone(), getTextNodeStyle(), withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, (0, _experiments.editorExperiment)('platform_editor_empty_line_prompt', true, {
242
- exposure: false
243
- }) ? _globalStyles.emptyBlockExperimentGlobalStyles : undefined, (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_1') ? withDividerInPanelStyleFix : undefined, (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_2') ? withFormatInLayoutStyleFix : undefined, (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_3') ? [withRelativePosStyle, topLevelNodeMarginStyles, (0, _experiments.editorExperiment)('nested-dnd', true) ? withAnchorNameZindexNestedStyle : withAnchorNameZindexStyle] : undefined]
207
+ styles: [globalStyles(), (0, _experiments.editorExperiment)('nested-dnd', true) ? extendedHoverZoneNested() : extendedHoverZone(), getTextNodeStyle(), withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_1') ? withDividerInPanelStyleFix : undefined, (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_2') ? withFormatInLayoutStyleFix : undefined, (0, _platformFeatureFlags.fg)('platform_editor_element_dnd_nested_fix_patch_3') ? [withRelativePosStyle, topLevelNodeMarginStyles, (0, _experiments.editorExperiment)('nested-dnd', true) ? withAnchorNameZindexNestedStyle : withAnchorNameZindexStyle] : undefined]
244
208
  });
245
209
  };
@@ -1,9 +1,7 @@
1
1
  import React from 'react';
2
2
  import { fg } from '@atlaskit/platform-feature-flags';
3
- import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
4
3
  import { moveNode } from './commands/move-node';
5
4
  import { moveToLayout } from './commands/move-to-layout';
6
- import { createEmptyBlockExperimentPlugin } from './pm-plugins/empty-block-experiment';
7
5
  import { createPlugin, key } from './pm-plugins/main';
8
6
  import { DragHandleMenu } from './ui/drag-handle-menu';
9
7
  import { GlobalStylesWrapper } from './ui/global-styles';
@@ -18,14 +16,7 @@ export const blockControlsPlugin = ({
18
16
  plugin: ({
19
17
  getIntl
20
18
  }) => createPlugin(api, getIntl)
21
- }, ...(editorExperiment('platform_editor_empty_line_prompt', true, {
22
- exposure: true
23
- }) ? [{
24
- name: 'emptyBlockExperimentPlugin',
25
- plugin: ({
26
- getIntl
27
- }) => createEmptyBlockExperimentPlugin(api, getIntl)
28
- }] : [])];
19
+ }];
29
20
  },
30
21
  commands: {
31
22
  moveNode: moveNode(api),
@@ -25,8 +25,8 @@ const shouldIgnoreNode = (node, ignore_nodes, depth, parent) => {
25
25
 
26
26
  // TODO use isWrappedMedia when clean up the feature flag
27
27
  const isMediaSingle = 'mediaSingle' === node.type.name && fg('platform_editor_element_dnd_nested_fix_patch_1');
28
- const isFirstTableHeaderOrTableRow = (parent === null || parent === void 0 ? void 0 : parent.type.name) === 'table' && depth === 1 && node === parent.firstChild && ['tableHeader', 'tableRow'].includes(node.type.name) && isPreRelease1();
29
- if (isFirstTableHeaderOrTableRow) {
28
+ const isFirstTableRow = (parent === null || parent === void 0 ? void 0 : parent.type.name) === 'table' && depth === 1 && node === parent.firstChild && 'tableRow' === node.type.name && isPreRelease1();
29
+ if (isFirstTableRow) {
30
30
  return false;
31
31
  }
32
32
  return (isEmbedCard || isMediaSingle) && ['wrap-right', 'wrap-left'].includes(node.attrs.layout) ? true : ignore_nodes.includes(node.type.name);
@@ -84,8 +84,9 @@ export const nodeDecorations = (newState, from, to) => {
84
84
  var _anchorName2;
85
85
  anchorName = (_anchorName2 = anchorName) !== null && _anchorName2 !== void 0 ? _anchorName2 : `--node-anchor-${node.type.name}-${index}`;
86
86
  }
87
+ const anchorStyles = ['tableRow', 'media'].includes(node.type.name) ? `anchor-name: ${anchorName};` : `anchor-name: ${anchorName}; ${pos === 0 && !fg('platform_editor_element_dnd_nested_fix_patch_3') ? 'margin-top: 0px;' : ''} ${fg('platform_editor_element_dnd_nested_fix_patch_3') ? '' : 'position: relative; z-index: 1;'}`;
87
88
  decs.push(Decoration.node(pos, pos + node.nodeSize, {
88
- style: `anchor-name: ${anchorName}; ${pos === 0 && !fg('platform_editor_element_dnd_nested_fix_patch_3') ? 'margin-top: 0px;' : ''} ${fg('platform_editor_element_dnd_nested_fix_patch_3') ? '' : 'position: relative; z-index: 1;'}`,
89
+ style: anchorStyles,
89
90
  ['data-drag-handler-anchor-name']: anchorName,
90
91
  ['data-drag-handler-node-type']: node.type.name,
91
92
  ['data-drag-handler-anchor-depth']: `${depth}`
@@ -8,17 +8,22 @@ import { akEditorCalculatedWideLayoutWidth, akEditorCalculatedWideLayoutWidthSma
8
8
  import { fg } from '@atlaskit/platform-feature-flags';
9
9
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
10
10
  import { DRAG_HANDLE_MAX_WIDTH_PLUS_GAP, DRAG_HANDLE_WIDTH } from './consts';
11
- import { emptyBlockExperimentGlobalStyles } from './empty-block-experiment/global-styles';
11
+
12
+ /**
13
+ * This anchor element selector disregards anchors that are solely utilized for size measurements,
14
+ * including those within table rows and media.
15
+ */
16
+ const dragHandlerAnchorSelector = '[data-drag-handler-anchor-name]:not([data-drag-handler-node-type="tableRow"], [data-drag-handler-node-type="media"])';
12
17
  const extendedHoverZone = () => css({
13
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
14
- '.block-ctrl-drag-preview [data-drag-handler-anchor-name]::after': {
18
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
19
+ [`.block-ctrl-drag-preview ${dragHandlerAnchorSelector}::after`]: {
15
20
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
16
21
  display: 'none !important'
17
22
  },
18
23
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
19
24
  '.ProseMirror': {
20
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
21
- '&& [data-drag-handler-anchor-name]::after': {
25
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
26
+ [`&& ${dragHandlerAnchorSelector}::after`]: {
22
27
  content: '""',
23
28
  position: 'absolute',
24
29
  top: 0,
@@ -42,15 +47,15 @@ const extendedHoverZone = () => css({
42
47
  }
43
48
  });
44
49
  const extendedHoverZoneNested = () => css({
45
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
46
- '.block-ctrl-drag-preview [data-drag-handler-anchor-name]::after': {
50
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
51
+ [`.block-ctrl-drag-preview ${dragHandlerAnchorSelector}::after`]: {
47
52
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles
48
53
  display: 'none !important'
49
54
  },
50
55
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
51
56
  '.ProseMirror': {
52
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
53
- '&& [data-drag-handler-anchor-name]::after': {
57
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
58
+ [`&& ${dragHandlerAnchorSelector}::after`]: {
54
59
  content: '""',
55
60
  position: 'absolute',
56
61
  top: 0,
@@ -62,8 +67,8 @@ const extendedHoverZoneNested = () => css({
62
67
  cursor: 'default',
63
68
  zIndex: 1
64
69
  },
65
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
66
- '&& [data-drag-handler-anchor-depth="0"][data-drag-handler-anchor-name]::after': {
70
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
71
+ [`&& [data-drag-handler-anchor-depth="0"]${dragHandlerAnchorSelector}::after`]: {
67
72
  content: '""',
68
73
  position: 'absolute',
69
74
  top: 0,
@@ -74,8 +79,8 @@ const extendedHoverZoneNested = () => css({
74
79
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
75
80
  zIndex: -1
76
81
  },
77
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
78
- '&& :is(.pm-table-cell-content-wrap, .pm-table-header-content-wrap) > [data-drag-handler-anchor-name]::after': {
82
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
83
+ [`&& :is(.pm-table-cell-content-wrap, .pm-table-header-content-wrap) > ${dragHandlerAnchorSelector}::after`]: {
79
84
  content: '""',
80
85
  position: 'absolute',
81
86
  top: 0,
@@ -215,8 +220,8 @@ const getTextNodeStyle = () => {
215
220
  const withRelativePosStyle = css({
216
221
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
217
222
  '.ProseMirror': {
218
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
219
- '&& [data-drag-handler-anchor-name]': {
223
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
224
+ [`&& ${dragHandlerAnchorSelector}`]: {
220
225
  position: 'relative'
221
226
  }
222
227
  }
@@ -224,8 +229,8 @@ const withRelativePosStyle = css({
224
229
  const withAnchorNameZindexStyle = css({
225
230
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors
226
231
  '.ProseMirror': {
227
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors
228
- '&& [data-drag-handler-anchor-name]': {
232
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-unsafe-values
233
+ [`&& ${dragHandlerAnchorSelector}`]: {
229
234
  zIndex: 1
230
235
  }
231
236
  }
@@ -241,8 +246,6 @@ const withAnchorNameZindexNestedStyle = css({
241
246
  });
242
247
  export const GlobalStylesWrapper = () => {
243
248
  return jsx(Global, {
244
- styles: [globalStyles(), editorExperiment('nested-dnd', true) ? extendedHoverZoneNested() : extendedHoverZone(), getTextNodeStyle(), withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, editorExperiment('platform_editor_empty_line_prompt', true, {
245
- exposure: false
246
- }) ? emptyBlockExperimentGlobalStyles : undefined, fg('platform_editor_element_dnd_nested_fix_patch_1') ? withDividerInPanelStyleFix : undefined, fg('platform_editor_element_dnd_nested_fix_patch_2') ? withFormatInLayoutStyleFix : undefined, fg('platform_editor_element_dnd_nested_fix_patch_3') ? [withRelativePosStyle, topLevelNodeMarginStyles, editorExperiment('nested-dnd', true) ? withAnchorNameZindexNestedStyle : withAnchorNameZindexStyle] : undefined]
249
+ styles: [globalStyles(), editorExperiment('nested-dnd', true) ? extendedHoverZoneNested() : extendedHoverZone(), getTextNodeStyle(), withDeleteLinesStyleFix, withMediaSingleStyleFix, legacyBreakoutWideLayoutStyle, fg('platform_editor_element_dnd_nested_fix_patch_1') ? withDividerInPanelStyleFix : undefined, fg('platform_editor_element_dnd_nested_fix_patch_2') ? withFormatInLayoutStyleFix : undefined, fg('platform_editor_element_dnd_nested_fix_patch_3') ? [withRelativePosStyle, topLevelNodeMarginStyles, editorExperiment('nested-dnd', true) ? withAnchorNameZindexNestedStyle : withAnchorNameZindexStyle] : undefined]
247
250
  });
248
251
  };
@@ -1,10 +1,7 @@
1
- import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
2
1
  import React from 'react';
3
2
  import { fg } from '@atlaskit/platform-feature-flags';
4
- import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
5
3
  import { moveNode } from './commands/move-node';
6
4
  import { moveToLayout } from './commands/move-to-layout';
7
- import { createEmptyBlockExperimentPlugin } from './pm-plugins/empty-block-experiment';
8
5
  import { createPlugin, key } from './pm-plugins/main';
9
6
  import { DragHandleMenu } from './ui/drag-handle-menu';
10
7
  import { GlobalStylesWrapper } from './ui/global-styles';
@@ -20,22 +17,14 @@ export var blockControlsPlugin = function blockControlsPlugin(_ref) {
20
17
  var getIntl = _ref2.getIntl;
21
18
  return createPlugin(api, getIntl);
22
19
  }
23
- }].concat(_toConsumableArray(editorExperiment('platform_editor_empty_line_prompt', true, {
24
- exposure: true
25
- }) ? [{
26
- name: 'emptyBlockExperimentPlugin',
27
- plugin: function plugin(_ref3) {
28
- var getIntl = _ref3.getIntl;
29
- return createEmptyBlockExperimentPlugin(api, getIntl);
30
- }
31
- }] : []));
20
+ }];
32
21
  },
33
22
  commands: {
34
23
  moveNode: moveNode(api),
35
24
  moveToLayout: moveToLayout(api),
36
25
  showDragHandleAt: function showDragHandleAt(pos, anchorName, nodeType, handleOptions) {
37
- return function (_ref4) {
38
- var tr = _ref4.tr;
26
+ return function (_ref3) {
27
+ var tr = _ref3.tr;
39
28
  tr.setMeta(key, {
40
29
  activeNode: {
41
30
  pos: pos,
@@ -48,8 +37,8 @@ export var blockControlsPlugin = function blockControlsPlugin(_ref) {
48
37
  };
49
38
  },
50
39
  setNodeDragged: function setNodeDragged(getPos, anchorName, nodeType) {
51
- return function (_ref5) {
52
- var tr = _ref5.tr;
40
+ return function (_ref4) {
41
+ var tr = _ref4.tr;
53
42
  var pos = getPos();
54
43
  if (pos === undefined) {
55
44
  return tr;
@@ -26,8 +26,8 @@ var shouldIgnoreNode = function shouldIgnoreNode(node, ignore_nodes, depth, pare
26
26
 
27
27
  // TODO use isWrappedMedia when clean up the feature flag
28
28
  var isMediaSingle = 'mediaSingle' === node.type.name && fg('platform_editor_element_dnd_nested_fix_patch_1');
29
- var isFirstTableHeaderOrTableRow = (parent === null || parent === void 0 ? void 0 : parent.type.name) === 'table' && depth === 1 && node === parent.firstChild && ['tableHeader', 'tableRow'].includes(node.type.name) && isPreRelease1();
30
- if (isFirstTableHeaderOrTableRow) {
29
+ var isFirstTableRow = (parent === null || parent === void 0 ? void 0 : parent.type.name) === 'table' && depth === 1 && node === parent.firstChild && 'tableRow' === node.type.name && isPreRelease1();
30
+ if (isFirstTableRow) {
31
31
  return false;
32
32
  }
33
33
  return (isEmbedCard || isMediaSingle) && ['wrap-right', 'wrap-left'].includes(node.attrs.layout) ? true : ignore_nodes.includes(node.type.name);
@@ -88,8 +88,9 @@ export var nodeDecorations = function nodeDecorations(newState, from, to) {
88
88
  var _anchorName2;
89
89
  anchorName = (_anchorName2 = anchorName) !== null && _anchorName2 !== void 0 ? _anchorName2 : "--node-anchor-".concat(node.type.name, "-").concat(index);
90
90
  }
91
+ var anchorStyles = ['tableRow', 'media'].includes(node.type.name) ? "anchor-name: ".concat(anchorName, ";") : "anchor-name: ".concat(anchorName, "; ").concat(pos === 0 && !fg('platform_editor_element_dnd_nested_fix_patch_3') ? 'margin-top: 0px;' : '', " ").concat(fg('platform_editor_element_dnd_nested_fix_patch_3') ? '' : 'position: relative; z-index: 1;');
91
92
  decs.push(Decoration.node(pos, pos + node.nodeSize, (_Decoration$node = {
92
- style: "anchor-name: ".concat(anchorName, "; ").concat(pos === 0 && !fg('platform_editor_element_dnd_nested_fix_patch_3') ? 'margin-top: 0px;' : '', " ").concat(fg('platform_editor_element_dnd_nested_fix_patch_3') ? '' : 'position: relative; z-index: 1;')
93
+ style: anchorStyles
93
94
  }, _defineProperty(_Decoration$node, 'data-drag-handler-anchor-name', anchorName), _defineProperty(_Decoration$node, 'data-drag-handler-node-type', node.type.name), _defineProperty(_Decoration$node, 'data-drag-handler-anchor-depth', "".concat(depth)), _Decoration$node), {
94
95
  type: TYPE_NODE_DEC,
95
96
  anchorName: anchorName,