@atlaskit/editor-plugin-block-controls 8.11.0 → 8.12.0

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,12 @@
1
1
  # @atlaskit/editor-plugin-block-controls
2
2
 
3
+ ## 8.12.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`c78234abd2778`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c78234abd2778) -
8
+ EDITOR-5792 fix drop target for sync blocks
9
+
3
10
  ## 8.11.0
4
11
 
5
12
  ### Minor Changes
@@ -4,8 +4,10 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.findSurroundingNodes = void 0;
7
+ var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
7
8
  var IGNORE_NODES = ['tableRow', 'listItem', 'caption', 'media'];
8
9
  var blockLeafNodes = ['blockCard', 'rule', 'extension'];
10
+ var blockLeafNodeNext = ['blockCard', 'rule', 'extension', 'syncBlock'];
9
11
  var DISABLE_CHILD_DROP_TARGET = ['orderedList', 'bulletList'];
10
12
 
11
13
  /**
@@ -19,7 +21,9 @@ var DISABLE_CHILD_DROP_TARGET = ['orderedList', 'bulletList'];
19
21
  */
20
22
  var _findSurroundingNodes = exports.findSurroundingNodes = function findSurroundingNodes(state, $pos, nodeType) {
21
23
  var depth = $pos.depth;
22
- var blockLeafNodeList = blockLeafNodes;
24
+ var blockLeafNodeList = (0, _experiments.editorExperiment)('platform_synced_block_patch_6', true, {
25
+ exposure: true
26
+ }) ? blockLeafNodeNext : blockLeafNodes;
23
27
 
24
28
  // special cases like hr rule here
25
29
  if (blockLeafNodeList.includes(nodeType || '') || $pos.pos === 0) {
@@ -70,6 +70,15 @@ var nestedDropZoneStyle = (0, _react2.css)({
70
70
  width: 'unset'
71
71
  });
72
72
  var enableDropZone = ['paragraph', 'mediaSingle', 'heading', 'codeBlock', 'decisionList', 'bulletList', 'orderedList', 'taskList', 'extension', 'blockCard'];
73
+ var enableDropZoneNext = ['paragraph', 'mediaSingle', 'heading', 'codeBlock', 'decisionList', 'bulletList', 'orderedList', 'taskList', 'extension', 'blockCard', 'syncBlock'];
74
+ var getEnableDropZone = function getEnableDropZone() {
75
+ if ((0, _experiments.editorExperiment)('platform_synced_block_patch_6', true, {
76
+ exposure: true
77
+ })) {
78
+ return enableDropZoneNext;
79
+ }
80
+ return enableDropZone;
81
+ };
73
82
 
74
83
  // This z index is used in container like layout
75
84
  var fullHeightStyleAdjustZIndexStyle = (0, _react2.css)({
@@ -122,7 +131,7 @@ var HoverZone = function HoverZone(_ref) {
122
131
  var hoverZoneUpperStyle = (0, _react.useMemo)(function () {
123
132
  var heightStyleOffset = "var(--editor-block-controls-drop-indicator-gap, 0)/2";
124
133
  var transformOffset = "var(".concat(EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_OFFSET, ", 0)");
125
- var heightStyle = anchorName && enableDropZone.includes((node === null || node === void 0 ? void 0 : node.type.name) || '') ? (0, _anchorUtils.isAnchorSupported)() ? "calc(anchor-size(".concat(anchorName, " height)/2 + ").concat(heightStyleOffset, ")") : "calc(".concat(((anchorRectCache === null || anchorRectCache === void 0 ? void 0 : anchorRectCache.getHeight(anchorName)) || 0) / 2, "px + ").concat(heightStyleOffset, ")") : '4px';
134
+ var heightStyle = anchorName && getEnableDropZone().includes((node === null || node === void 0 ? void 0 : node.type.name) || '') ? (0, _anchorUtils.isAnchorSupported)() ? "calc(anchor-size(".concat(anchorName, " height)/2 + ").concat(heightStyleOffset, ")") : "calc(".concat(((anchorRectCache === null || anchorRectCache === void 0 ? void 0 : anchorRectCache.getHeight(anchorName)) || 0) / 2, "px + ").concat(heightStyleOffset, ")") : '4px';
126
135
  var transform = position === 'upper' ? "translateY(calc(-100% + ".concat(transformOffset, "))") : "translateY(".concat(transformOffset, ")");
127
136
  return (0, _react2.css)({
128
137
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
@@ -147,7 +156,7 @@ var HoverZone = function HoverZone(_ref) {
147
156
  var _anchorName = node ? (0, _expValEquals.expValEquals)('platform_editor_native_anchor_with_dnd', 'isEnabled', true) ? (api === null || api === void 0 ? void 0 : api.core.actions.getAnchorIdForNode(node, pos || -1)) || '' : (0, _decorationsCommon.getNodeAnchor)(node) : '';
148
157
  var top = 'unset';
149
158
  if (_anchorName) {
150
- var enabledDropZone = enableDropZone.includes((node === null || node === void 0 ? void 0 : node.type.name) || '');
159
+ var enabledDropZone = getEnableDropZone().includes((node === null || node === void 0 ? void 0 : node.type.name) || '');
151
160
  if ((0, _anchorUtils.isAnchorSupported)()) {
152
161
  top = enabledDropZone ? "calc(anchor(".concat(_anchorName, " 50%))") : "calc(anchor(".concat(_anchorName, " bottom) - 4px)");
153
162
  } else if (anchorRectCache) {
@@ -1,5 +1,7 @@
1
+ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
1
2
  const IGNORE_NODES = ['tableRow', 'listItem', 'caption', 'media'];
2
3
  const blockLeafNodes = ['blockCard', 'rule', 'extension'];
4
+ const blockLeafNodeNext = ['blockCard', 'rule', 'extension', 'syncBlock'];
3
5
  const DISABLE_CHILD_DROP_TARGET = ['orderedList', 'bulletList'];
4
6
 
5
7
  /**
@@ -13,7 +15,9 @@ const DISABLE_CHILD_DROP_TARGET = ['orderedList', 'bulletList'];
13
15
  */
14
16
  export const findSurroundingNodes = (state, $pos, nodeType) => {
15
17
  const depth = $pos.depth;
16
- const blockLeafNodeList = blockLeafNodes;
18
+ const blockLeafNodeList = editorExperiment('platform_synced_block_patch_6', true, {
19
+ exposure: true
20
+ }) ? blockLeafNodeNext : blockLeafNodes;
17
21
 
18
22
  // special cases like hr rule here
19
23
  if (blockLeafNodeList.includes(nodeType || '') || $pos.pos === 0) {
@@ -60,6 +60,15 @@ const nestedDropZoneStyle = css({
60
60
  width: 'unset'
61
61
  });
62
62
  const enableDropZone = ['paragraph', 'mediaSingle', 'heading', 'codeBlock', 'decisionList', 'bulletList', 'orderedList', 'taskList', 'extension', 'blockCard'];
63
+ const enableDropZoneNext = ['paragraph', 'mediaSingle', 'heading', 'codeBlock', 'decisionList', 'bulletList', 'orderedList', 'taskList', 'extension', 'blockCard', 'syncBlock'];
64
+ const getEnableDropZone = () => {
65
+ if (editorExperiment('platform_synced_block_patch_6', true, {
66
+ exposure: true
67
+ })) {
68
+ return enableDropZoneNext;
69
+ }
70
+ return enableDropZone;
71
+ };
63
72
 
64
73
  // This z index is used in container like layout
65
74
  const fullHeightStyleAdjustZIndexStyle = css({
@@ -110,7 +119,7 @@ const HoverZone = ({
110
119
  const hoverZoneUpperStyle = useMemo(() => {
111
120
  const heightStyleOffset = `var(--editor-block-controls-drop-indicator-gap, 0)/2`;
112
121
  const transformOffset = `var(${EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_OFFSET}, 0)`;
113
- const heightStyle = anchorName && enableDropZone.includes((node === null || node === void 0 ? void 0 : node.type.name) || '') ? isAnchorSupported() ? `calc(anchor-size(${anchorName} height)/2 + ${heightStyleOffset})` : `calc(${((anchorRectCache === null || anchorRectCache === void 0 ? void 0 : anchorRectCache.getHeight(anchorName)) || 0) / 2}px + ${heightStyleOffset})` : '4px';
122
+ const heightStyle = anchorName && getEnableDropZone().includes((node === null || node === void 0 ? void 0 : node.type.name) || '') ? isAnchorSupported() ? `calc(anchor-size(${anchorName} height)/2 + ${heightStyleOffset})` : `calc(${((anchorRectCache === null || anchorRectCache === void 0 ? void 0 : anchorRectCache.getHeight(anchorName)) || 0) / 2}px + ${heightStyleOffset})` : '4px';
114
123
  const transform = position === 'upper' ? `translateY(calc(-100% + ${transformOffset}))` : `translateY(${transformOffset})`;
115
124
  return css({
116
125
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
@@ -135,7 +144,7 @@ const HoverZone = ({
135
144
  const anchorName = node ? expValEquals('platform_editor_native_anchor_with_dnd', 'isEnabled', true) ? (api === null || api === void 0 ? void 0 : api.core.actions.getAnchorIdForNode(node, pos || -1)) || '' : getNodeAnchor(node) : '';
136
145
  let top = 'unset';
137
146
  if (anchorName) {
138
- const enabledDropZone = enableDropZone.includes((node === null || node === void 0 ? void 0 : node.type.name) || '');
147
+ const enabledDropZone = getEnableDropZone().includes((node === null || node === void 0 ? void 0 : node.type.name) || '');
139
148
  if (isAnchorSupported()) {
140
149
  top = enabledDropZone ? `calc(anchor(${anchorName} 50%))` : `calc(anchor(${anchorName} bottom) - 4px)`;
141
150
  } else if (anchorRectCache) {
@@ -1,5 +1,7 @@
1
+ import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
1
2
  var IGNORE_NODES = ['tableRow', 'listItem', 'caption', 'media'];
2
3
  var blockLeafNodes = ['blockCard', 'rule', 'extension'];
4
+ var blockLeafNodeNext = ['blockCard', 'rule', 'extension', 'syncBlock'];
3
5
  var DISABLE_CHILD_DROP_TARGET = ['orderedList', 'bulletList'];
4
6
 
5
7
  /**
@@ -13,7 +15,9 @@ var DISABLE_CHILD_DROP_TARGET = ['orderedList', 'bulletList'];
13
15
  */
14
16
  var _findSurroundingNodes = function findSurroundingNodes(state, $pos, nodeType) {
15
17
  var depth = $pos.depth;
16
- var blockLeafNodeList = blockLeafNodes;
18
+ var blockLeafNodeList = editorExperiment('platform_synced_block_patch_6', true, {
19
+ exposure: true
20
+ }) ? blockLeafNodeNext : blockLeafNodes;
17
21
 
18
22
  // special cases like hr rule here
19
23
  if (blockLeafNodeList.includes(nodeType || '') || $pos.pos === 0) {
@@ -62,6 +62,15 @@ var nestedDropZoneStyle = css({
62
62
  width: 'unset'
63
63
  });
64
64
  var enableDropZone = ['paragraph', 'mediaSingle', 'heading', 'codeBlock', 'decisionList', 'bulletList', 'orderedList', 'taskList', 'extension', 'blockCard'];
65
+ var enableDropZoneNext = ['paragraph', 'mediaSingle', 'heading', 'codeBlock', 'decisionList', 'bulletList', 'orderedList', 'taskList', 'extension', 'blockCard', 'syncBlock'];
66
+ var getEnableDropZone = function getEnableDropZone() {
67
+ if (editorExperiment('platform_synced_block_patch_6', true, {
68
+ exposure: true
69
+ })) {
70
+ return enableDropZoneNext;
71
+ }
72
+ return enableDropZone;
73
+ };
65
74
 
66
75
  // This z index is used in container like layout
67
76
  var fullHeightStyleAdjustZIndexStyle = css({
@@ -114,7 +123,7 @@ var HoverZone = function HoverZone(_ref) {
114
123
  var hoverZoneUpperStyle = useMemo(function () {
115
124
  var heightStyleOffset = "var(--editor-block-controls-drop-indicator-gap, 0)/2";
116
125
  var transformOffset = "var(".concat(EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_OFFSET, ", 0)");
117
- var heightStyle = anchorName && enableDropZone.includes((node === null || node === void 0 ? void 0 : node.type.name) || '') ? isAnchorSupported() ? "calc(anchor-size(".concat(anchorName, " height)/2 + ").concat(heightStyleOffset, ")") : "calc(".concat(((anchorRectCache === null || anchorRectCache === void 0 ? void 0 : anchorRectCache.getHeight(anchorName)) || 0) / 2, "px + ").concat(heightStyleOffset, ")") : '4px';
126
+ var heightStyle = anchorName && getEnableDropZone().includes((node === null || node === void 0 ? void 0 : node.type.name) || '') ? isAnchorSupported() ? "calc(anchor-size(".concat(anchorName, " height)/2 + ").concat(heightStyleOffset, ")") : "calc(".concat(((anchorRectCache === null || anchorRectCache === void 0 ? void 0 : anchorRectCache.getHeight(anchorName)) || 0) / 2, "px + ").concat(heightStyleOffset, ")") : '4px';
118
127
  var transform = position === 'upper' ? "translateY(calc(-100% + ".concat(transformOffset, "))") : "translateY(".concat(transformOffset, ")");
119
128
  return css({
120
129
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values
@@ -139,7 +148,7 @@ var HoverZone = function HoverZone(_ref) {
139
148
  var _anchorName = node ? expValEquals('platform_editor_native_anchor_with_dnd', 'isEnabled', true) ? (api === null || api === void 0 ? void 0 : api.core.actions.getAnchorIdForNode(node, pos || -1)) || '' : getNodeAnchor(node) : '';
140
149
  var top = 'unset';
141
150
  if (_anchorName) {
142
- var enabledDropZone = enableDropZone.includes((node === null || node === void 0 ? void 0 : node.type.name) || '');
151
+ var enabledDropZone = getEnableDropZone().includes((node === null || node === void 0 ? void 0 : node.type.name) || '');
143
152
  if (isAnchorSupported()) {
144
153
  top = enabledDropZone ? "calc(anchor(".concat(_anchorName, " 50%))") : "calc(anchor(".concat(_anchorName, " bottom) - 4px)");
145
154
  } else if (anchorRectCache) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-controls",
3
- "version": "8.11.0",
3
+ "version": "8.12.0",
4
4
  "description": "Block controls plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -39,7 +39,7 @@
39
39
  "@atlaskit/editor-plugin-limited-mode": "^4.0.0",
40
40
  "@atlaskit/editor-plugin-metrics": "^8.0.0",
41
41
  "@atlaskit/editor-plugin-quick-insert": "^7.5.0",
42
- "@atlaskit/editor-plugin-selection": "^7.0.0",
42
+ "@atlaskit/editor-plugin-selection": "^7.1.0",
43
43
  "@atlaskit/editor-plugin-toolbar": "^4.1.0",
44
44
  "@atlaskit/editor-plugin-type-ahead": "^7.0.0",
45
45
  "@atlaskit/editor-plugin-user-intent": "^5.0.0",
@@ -56,8 +56,8 @@
56
56
  "@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^3.2.0",
57
57
  "@atlaskit/primitives": "^18.0.0",
58
58
  "@atlaskit/theme": "^22.0.0",
59
- "@atlaskit/tmp-editor-statsig": "^35.4.0",
60
- "@atlaskit/tokens": "^11.0.0",
59
+ "@atlaskit/tmp-editor-statsig": "^35.6.0",
60
+ "@atlaskit/tokens": "^11.1.0",
61
61
  "@atlaskit/tooltip": "^20.14.0",
62
62
  "@babel/runtime": "^7.0.0",
63
63
  "@emotion/react": "^11.7.1",
@@ -67,7 +67,7 @@
67
67
  "uuid": "^3.1.0"
68
68
  },
69
69
  "peerDependencies": {
70
- "@atlaskit/editor-common": "^111.31.0",
70
+ "@atlaskit/editor-common": "^111.33.0",
71
71
  "react": "^18.2.0",
72
72
  "react-dom": "^18.2.0",
73
73
  "react-intl-next": "npm:react-intl@^5.18.1"