@atlaskit/editor-plugin-block-controls 24.0.1 → 24.0.3

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.
Files changed (9) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/dist/cjs/pm-plugins/handle-sparse-hover-target.js +7 -3
  3. package/dist/cjs/pm-plugins/sparse-gutter-hover.js +7 -7
  4. package/dist/es2019/pm-plugins/handle-sparse-hover-target.js +7 -3
  5. package/dist/es2019/pm-plugins/sparse-gutter-hover.js +7 -7
  6. package/dist/esm/pm-plugins/handle-sparse-hover-target.js +7 -3
  7. package/dist/esm/pm-plugins/sparse-gutter-hover.js +7 -7
  8. package/dist/types/pm-plugins/sparse-gutter-hover.d.ts +3 -3
  9. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,20 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 24.0.3
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 24.0.2
10
+
11
+ ### Patch Changes
12
+
13
+ - [`834a52c0cc828`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/834a52c0cc828) -
14
+ Allow sparse gutter hover to target blocks nested inside table cells, matching legacy hover zone
15
+ behaviour
16
+ - Updated dependencies
17
+
3
18
  ## 24.0.1
4
19
 
5
20
  ### Patch Changes
package/dist/cjs/pm-plugins/handle-sparse-hover-target.js CHANGED
@@ -8,8 +8,9 @@ var _nodeAnchor = require("@atlaskit/editor-common/node-anchor");
8
8
  var _fg = require("@atlaskit/platform-feature-flags/fg");
9
9
  var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
10
10
  var _decorationsCommon = require("./decorations-common");
11
- var OPAQUE_BLOCKS = new Set(['table', 'bulletList', 'orderedList', 'taskList', 'decisionList', 'mediaSingle']);
11
+ var OPAQUE_BLOCKS = new Set(['bulletList', 'orderedList', 'taskList', 'decisionList', 'mediaSingle']);
12
12
  var EXCLUDED_BLOCKS = new Set(['listItem', 'tableRow', 'tableCell', 'tableHeader', 'caption']);
13
+ var TABLE_CELLS = new Set(['tableCell', 'tableHeader']);
13
14
  var isPanelNodeTypeName = function isPanelNodeTypeName(nodeTypeName) {
14
15
  return nodeTypeName === 'panel' || nodeTypeName === 'panel_c1' && (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_controls_reliable_anchor', 'isEnabled', true) && (0, _fg.fg)('platform_editor_controls_reliable_anchor_patch_1');
15
16
  };
@@ -84,13 +85,16 @@ var handleSparseHoverTarget = exports.handleSparseHoverTarget = function handleS
84
85
  if (!_node.isBlock || EXCLUDED_BLOCKS.has(_node.type.name)) {
85
86
  continue;
86
87
  }
87
- targetPosition = $pos.before(depth);
88
+ // Legacy hover excludes direct cell children, but can target deeper blocks inside them.
89
+ if (!TABLE_CELLS.has($pos.node(depth - 1).type.name)) {
90
+ targetPosition = $pos.before(depth);
91
+ }
88
92
  if (OPAQUE_BLOCKS.has(_node.type.name)) {
89
93
  opaque = true;
90
94
  break;
91
95
  }
92
96
  }
93
- if (!opaque && (_$pos$nodeAfter = $pos.nodeAfter) !== null && _$pos$nodeAfter !== void 0 && _$pos$nodeAfter.isBlock && !EXCLUDED_BLOCKS.has($pos.nodeAfter.type.name)) {
97
+ if (!opaque && (_$pos$nodeAfter = $pos.nodeAfter) !== null && _$pos$nodeAfter !== void 0 && _$pos$nodeAfter.isBlock && !EXCLUDED_BLOCKS.has($pos.nodeAfter.type.name) && !TABLE_CELLS.has($pos.parent.type.name)) {
94
98
  // Browser positions over non-editable node chrome can resolve to the first editable child.
95
99
  // Keep the ancestor unless that child actually owns the hovered DOM target.
96
100
  var nodeAfterDOM = view.nodeDOM(position);
package/dist/cjs/pm-plugins/sparse-gutter-hover.js CHANGED
@@ -15,7 +15,7 @@ var _handleMouseMove = require("./interaction-tracking/handle-mouse-move");
15
15
  var _pmPlugin = require("./interaction-tracking/pm-plugin");
16
16
  var _visibleBox = require("./utils/visible-box");
17
17
  var BLOCK_SELECTOR = '[data-prosemirror-node-block="true"]';
18
- var TABLE_SELECTOR = '[data-prosemirror-node-name="table"]';
18
+ var TABLE_STRUCTURE_NODES = new Set(['table', 'tableRow', 'tableCell', 'tableHeader']);
19
19
  var LAYOUT_SECTION_SELECTOR = '[data-prosemirror-node-name="layoutSection"]';
20
20
  var LAYOUT_COLUMN_SELECTOR = '[data-prosemirror-node-name="layoutColumn"]';
21
21
 
@@ -32,9 +32,9 @@ var getVisibleLeft = function getVisibleLeft(block) {
32
32
  /**
33
33
  * Whether the element under the pointer can be part of a block's left gutter: a container block's
34
34
  * own padding (panel, layout, list…) or an editor wrapper around the content. Text and leaf blocks
35
- * have no gutter inside them, and neither do tables: like the legacy hover zones, anywhere inside a
36
- * table, including cell padding, shows the table's controls. Elements rendered beside the editor
37
- * (title, popups, toolbars) cover any gutter beneath them.
35
+ * have no gutter inside them. Table and cell padding shows the table's controls, but containers
36
+ * nested inside cells can own gutters for their children, as in the legacy hover zones. Elements
37
+ * rendered beside the editor (title, popups, toolbars) cover any gutter beneath them.
38
38
  */
39
39
  var isPossibleGutterElement = exports.isPossibleGutterElement = function isPossibleGutterElement(view, hoveredElement) {
40
40
  if (!(hoveredElement instanceof Element)) {
@@ -45,11 +45,11 @@ var isPossibleGutterElement = exports.isPossibleGutterElement = function isPossi
45
45
  return false;
46
46
  }
47
47
  if (owner && view.dom.contains(owner)) {
48
- var _owner$getAttribute;
49
- if (owner.closest(TABLE_SELECTOR)) {
48
+ var _owner$getAttribute, _owner$getAttribute2;
49
+ if (TABLE_STRUCTURE_NODES.has((_owner$getAttribute = owner.getAttribute('data-prosemirror-node-name')) !== null && _owner$getAttribute !== void 0 ? _owner$getAttribute : '')) {
50
50
  return false;
51
51
  }
52
- var nodeType = view.state.schema.nodes[(_owner$getAttribute = owner.getAttribute('data-prosemirror-node-name')) !== null && _owner$getAttribute !== void 0 ? _owner$getAttribute : ''];
52
+ var nodeType = view.state.schema.nodes[(_owner$getAttribute2 = owner.getAttribute('data-prosemirror-node-name')) !== null && _owner$getAttribute2 !== void 0 ? _owner$getAttribute2 : ''];
53
53
  return !(nodeType !== null && nodeType !== void 0 && nodeType.isTextblock) && !(nodeType !== null && nodeType !== void 0 && nodeType.isLeaf);
54
54
  }
55
55
  return view.dom.contains(hoveredElement) || hoveredElement.contains(view.dom);
package/dist/es2019/pm-plugins/handle-sparse-hover-target.js CHANGED
@@ -2,8 +2,9 @@ import { getNodeIdProvider } from '@atlaskit/editor-common/node-anchor';
2
2
  import { fg } from '@atlaskit/platform-feature-flags/fg';
3
3
  import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
4
4
  import { getNodeTypeWithLevel } from './decorations-common';
5
- const OPAQUE_BLOCKS = new Set(['table', 'bulletList', 'orderedList', 'taskList', 'decisionList', 'mediaSingle']);
5
+ const OPAQUE_BLOCKS = new Set(['bulletList', 'orderedList', 'taskList', 'decisionList', 'mediaSingle']);
6
6
  const EXCLUDED_BLOCKS = new Set(['listItem', 'tableRow', 'tableCell', 'tableHeader', 'caption']);
7
+ const TABLE_CELLS = new Set(['tableCell', 'tableHeader']);
7
8
  const isPanelNodeTypeName = nodeTypeName => nodeTypeName === 'panel' || nodeTypeName === 'panel_c1' && expValEqualsNoExposure('platform_editor_controls_reliable_anchor', 'isEnabled', true) && fg('platform_editor_controls_reliable_anchor_patch_1');
8
9
  const redirectParagraphToWrappedMedia = (view, $target, targetPosition) => {
9
10
  const node = view.state.doc.nodeAt(targetPosition);
@@ -75,13 +76,16 @@ export const handleSparseHoverTarget = (view, target, api) => {
75
76
  if (!node.isBlock || EXCLUDED_BLOCKS.has(node.type.name)) {
76
77
  continue;
77
78
  }
78
- targetPosition = $pos.before(depth);
79
+ // Legacy hover excludes direct cell children, but can target deeper blocks inside them.
80
+ if (!TABLE_CELLS.has($pos.node(depth - 1).type.name)) {
81
+ targetPosition = $pos.before(depth);
82
+ }
79
83
  if (OPAQUE_BLOCKS.has(node.type.name)) {
80
84
  opaque = true;
81
85
  break;
82
86
  }
83
87
  }
84
- if (!opaque && (_$pos$nodeAfter = $pos.nodeAfter) !== null && _$pos$nodeAfter !== void 0 && _$pos$nodeAfter.isBlock && !EXCLUDED_BLOCKS.has($pos.nodeAfter.type.name)) {
88
+ if (!opaque && (_$pos$nodeAfter = $pos.nodeAfter) !== null && _$pos$nodeAfter !== void 0 && _$pos$nodeAfter.isBlock && !EXCLUDED_BLOCKS.has($pos.nodeAfter.type.name) && !TABLE_CELLS.has($pos.parent.type.name)) {
85
89
  // Browser positions over non-editable node chrome can resolve to the first editable child.
86
90
  // Keep the ancestor unless that child actually owns the hovered DOM target.
87
91
  const nodeAfterDOM = view.nodeDOM(position);
package/dist/es2019/pm-plugins/sparse-gutter-hover.js CHANGED
@@ -9,7 +9,7 @@ import { handleMouseLeave } from './interaction-tracking/handle-mouse-move';
9
9
  import { getInteractionTrackingState } from './interaction-tracking/pm-plugin';
10
10
  import { getVisibleBox } from './utils/visible-box';
11
11
  const BLOCK_SELECTOR = '[data-prosemirror-node-block="true"]';
12
- const TABLE_SELECTOR = '[data-prosemirror-node-name="table"]';
12
+ const TABLE_STRUCTURE_NODES = new Set(['table', 'tableRow', 'tableCell', 'tableHeader']);
13
13
  const LAYOUT_SECTION_SELECTOR = '[data-prosemirror-node-name="layoutSection"]';
14
14
  const LAYOUT_COLUMN_SELECTOR = '[data-prosemirror-node-name="layoutColumn"]';
15
15
 
@@ -24,9 +24,9 @@ const getVisibleLeft = block => {
24
24
  /**
25
25
  * Whether the element under the pointer can be part of a block's left gutter: a container block's
26
26
  * own padding (panel, layout, list…) or an editor wrapper around the content. Text and leaf blocks
27
- * have no gutter inside them, and neither do tables: like the legacy hover zones, anywhere inside a
28
- * table, including cell padding, shows the table's controls. Elements rendered beside the editor
29
- * (title, popups, toolbars) cover any gutter beneath them.
27
+ * have no gutter inside them. Table and cell padding shows the table's controls, but containers
28
+ * nested inside cells can own gutters for their children, as in the legacy hover zones. Elements
29
+ * rendered beside the editor (title, popups, toolbars) cover any gutter beneath them.
30
30
  */
31
31
  export const isPossibleGutterElement = (view, hoveredElement) => {
32
32
  if (!(hoveredElement instanceof Element)) {
@@ -37,11 +37,11 @@ export const isPossibleGutterElement = (view, hoveredElement) => {
37
37
  return false;
38
38
  }
39
39
  if (owner && view.dom.contains(owner)) {
40
- var _owner$getAttribute;
41
- if (owner.closest(TABLE_SELECTOR)) {
40
+ var _owner$getAttribute, _owner$getAttribute2;
41
+ if (TABLE_STRUCTURE_NODES.has((_owner$getAttribute = owner.getAttribute('data-prosemirror-node-name')) !== null && _owner$getAttribute !== void 0 ? _owner$getAttribute : '')) {
42
42
  return false;
43
43
  }
44
- const nodeType = view.state.schema.nodes[(_owner$getAttribute = owner.getAttribute('data-prosemirror-node-name')) !== null && _owner$getAttribute !== void 0 ? _owner$getAttribute : ''];
44
+ const nodeType = view.state.schema.nodes[(_owner$getAttribute2 = owner.getAttribute('data-prosemirror-node-name')) !== null && _owner$getAttribute2 !== void 0 ? _owner$getAttribute2 : ''];
45
45
  return !(nodeType !== null && nodeType !== void 0 && nodeType.isTextblock) && !(nodeType !== null && nodeType !== void 0 && nodeType.isLeaf);
46
46
  }
47
47
  return view.dom.contains(hoveredElement) || hoveredElement.contains(view.dom);
package/dist/esm/pm-plugins/handle-sparse-hover-target.js CHANGED
@@ -2,8 +2,9 @@ import { getNodeIdProvider } from '@atlaskit/editor-common/node-anchor';
2
2
  import { fg } from '@atlaskit/platform-feature-flags/fg';
3
3
  import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
4
4
  import { getNodeTypeWithLevel } from './decorations-common';
5
- var OPAQUE_BLOCKS = new Set(['table', 'bulletList', 'orderedList', 'taskList', 'decisionList', 'mediaSingle']);
5
+ var OPAQUE_BLOCKS = new Set(['bulletList', 'orderedList', 'taskList', 'decisionList', 'mediaSingle']);
6
6
  var EXCLUDED_BLOCKS = new Set(['listItem', 'tableRow', 'tableCell', 'tableHeader', 'caption']);
7
+ var TABLE_CELLS = new Set(['tableCell', 'tableHeader']);
7
8
  var isPanelNodeTypeName = function isPanelNodeTypeName(nodeTypeName) {
8
9
  return nodeTypeName === 'panel' || nodeTypeName === 'panel_c1' && expValEqualsNoExposure('platform_editor_controls_reliable_anchor', 'isEnabled', true) && fg('platform_editor_controls_reliable_anchor_patch_1');
9
10
  };
@@ -78,13 +79,16 @@ export var handleSparseHoverTarget = function handleSparseHoverTarget(view, targ
78
79
  if (!_node.isBlock || EXCLUDED_BLOCKS.has(_node.type.name)) {
79
80
  continue;
80
81
  }
81
- targetPosition = $pos.before(depth);
82
+ // Legacy hover excludes direct cell children, but can target deeper blocks inside them.
83
+ if (!TABLE_CELLS.has($pos.node(depth - 1).type.name)) {
84
+ targetPosition = $pos.before(depth);
85
+ }
82
86
  if (OPAQUE_BLOCKS.has(_node.type.name)) {
83
87
  opaque = true;
84
88
  break;
85
89
  }
86
90
  }
87
- if (!opaque && (_$pos$nodeAfter = $pos.nodeAfter) !== null && _$pos$nodeAfter !== void 0 && _$pos$nodeAfter.isBlock && !EXCLUDED_BLOCKS.has($pos.nodeAfter.type.name)) {
91
+ if (!opaque && (_$pos$nodeAfter = $pos.nodeAfter) !== null && _$pos$nodeAfter !== void 0 && _$pos$nodeAfter.isBlock && !EXCLUDED_BLOCKS.has($pos.nodeAfter.type.name) && !TABLE_CELLS.has($pos.parent.type.name)) {
88
92
  // Browser positions over non-editable node chrome can resolve to the first editable child.
89
93
  // Keep the ancestor unless that child actually owns the hovered DOM target.
90
94
  var nodeAfterDOM = view.nodeDOM(position);
package/dist/esm/pm-plugins/sparse-gutter-hover.js CHANGED
@@ -9,7 +9,7 @@ import { handleMouseLeave } from './interaction-tracking/handle-mouse-move';
9
9
  import { getInteractionTrackingState } from './interaction-tracking/pm-plugin';
10
10
  import { getVisibleBox } from './utils/visible-box';
11
11
  var BLOCK_SELECTOR = '[data-prosemirror-node-block="true"]';
12
- var TABLE_SELECTOR = '[data-prosemirror-node-name="table"]';
12
+ var TABLE_STRUCTURE_NODES = new Set(['table', 'tableRow', 'tableCell', 'tableHeader']);
13
13
  var LAYOUT_SECTION_SELECTOR = '[data-prosemirror-node-name="layoutSection"]';
14
14
  var LAYOUT_COLUMN_SELECTOR = '[data-prosemirror-node-name="layoutColumn"]';
15
15
 
@@ -26,9 +26,9 @@ var getVisibleLeft = function getVisibleLeft(block) {
26
26
  /**
27
27
  * Whether the element under the pointer can be part of a block's left gutter: a container block's
28
28
  * own padding (panel, layout, list…) or an editor wrapper around the content. Text and leaf blocks
29
- * have no gutter inside them, and neither do tables: like the legacy hover zones, anywhere inside a
30
- * table, including cell padding, shows the table's controls. Elements rendered beside the editor
31
- * (title, popups, toolbars) cover any gutter beneath them.
29
+ * have no gutter inside them. Table and cell padding shows the table's controls, but containers
30
+ * nested inside cells can own gutters for their children, as in the legacy hover zones. Elements
31
+ * rendered beside the editor (title, popups, toolbars) cover any gutter beneath them.
32
32
  */
33
33
  export var isPossibleGutterElement = function isPossibleGutterElement(view, hoveredElement) {
34
34
  if (!(hoveredElement instanceof Element)) {
@@ -39,11 +39,11 @@ export var isPossibleGutterElement = function isPossibleGutterElement(view, hove
39
39
  return false;
40
40
  }
41
41
  if (owner && view.dom.contains(owner)) {
42
- var _owner$getAttribute;
43
- if (owner.closest(TABLE_SELECTOR)) {
42
+ var _owner$getAttribute, _owner$getAttribute2;
43
+ if (TABLE_STRUCTURE_NODES.has((_owner$getAttribute = owner.getAttribute('data-prosemirror-node-name')) !== null && _owner$getAttribute !== void 0 ? _owner$getAttribute : '')) {
44
44
  return false;
45
45
  }
46
- var nodeType = view.state.schema.nodes[(_owner$getAttribute = owner.getAttribute('data-prosemirror-node-name')) !== null && _owner$getAttribute !== void 0 ? _owner$getAttribute : ''];
46
+ var nodeType = view.state.schema.nodes[(_owner$getAttribute2 = owner.getAttribute('data-prosemirror-node-name')) !== null && _owner$getAttribute2 !== void 0 ? _owner$getAttribute2 : ''];
47
47
  return !(nodeType !== null && nodeType !== void 0 && nodeType.isTextblock) && !(nodeType !== null && nodeType !== void 0 && nodeType.isLeaf);
48
48
  }
49
49
  return view.dom.contains(hoveredElement) || hoveredElement.contains(view.dom);
package/dist/types/pm-plugins/sparse-gutter-hover.d.ts CHANGED
@@ -4,9 +4,9 @@ import type { BlockControlsPlugin } from '../blockControlsPluginType';
4
4
  /**
5
5
  * Whether the element under the pointer can be part of a block's left gutter: a container block's
6
6
  * own padding (panel, layout, list…) or an editor wrapper around the content. Text and leaf blocks
7
- * have no gutter inside them, and neither do tables: like the legacy hover zones, anywhere inside a
8
- * table, including cell padding, shows the table's controls. Elements rendered beside the editor
9
- * (title, popups, toolbars) cover any gutter beneath them.
7
+ * have no gutter inside them. Table and cell padding shows the table's controls, but containers
8
+ * nested inside cells can own gutters for their children, as in the legacy hover zones. Elements
9
+ * rendered beside the editor (title, popups, toolbars) cover any gutter beneath them.
10
10
  */
11
11
  export declare const isPossibleGutterElement: (view: EditorView, hoveredElement: EventTarget | null) => hoveredElement is Element;
12
12
  /** Returns a function that finds the block whose legacy hover zone contains the pointer. */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-controls",
3
- "version": "24.0.1",
3
+ "version": "24.0.3",
4
4
  "description": "Block controls plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -61,7 +61,7 @@
61
61
  "@atlaskit/primitives": "^22.5.0",
62
62
  "@atlaskit/section-message": "^10.2.0",
63
63
  "@atlaskit/theme": "^28.2.0",
64
- "@atlaskit/tmp-editor-statsig": "^219.0.0",
64
+ "@atlaskit/tmp-editor-statsig": "^220.0.0",
65
65
  "@atlaskit/tokens": "^20.1.0",
66
66
  "@atlaskit/tooltip": "^24.4.0",
67
67
  "@babel/runtime": "^7.0.0",
@@ -73,7 +73,7 @@
73
73
  "uuid": "^11.1.1"
74
74
  },
75
75
  "peerDependencies": {
76
- "@atlaskit/editor-common": "^127.1.0",
76
+ "@atlaskit/editor-common": "^127.2.0",
77
77
  "react": "^18.2.0 || ^19.2.0",
78
78
  "react-dom": "^18.2.0 || ^19.2.0",
79
79
  "react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"