@atlaskit/editor-plugin-block-controls 8.12.0 → 9.0.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 +10 -0
- package/dist/cjs/editor-commands/move-to-layout.js +7 -2
- package/dist/cjs/pm-plugins/utils/inline-drop-target.js +8 -1
- package/dist/cjs/ui/drop-target.js +5 -3
- package/dist/es2019/editor-commands/move-to-layout.js +7 -2
- package/dist/es2019/pm-plugins/utils/inline-drop-target.js +8 -2
- package/dist/es2019/ui/drop-target.js +5 -3
- package/dist/esm/editor-commands/move-to-layout.js +7 -2
- package/dist/esm/pm-plugins/utils/inline-drop-target.js +8 -1
- package/dist/esm/ui/drop-target.js +5 -3
- package/dist/types/pm-plugins/utils/inline-drop-target.d.ts +1 -1
- package/dist/types-ts4.5/pm-plugins/utils/inline-drop-target.d.ts +1 -1
- package/package.json +17 -17
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,15 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-block-controls
|
|
2
2
|
|
|
3
|
+
## 9.0.0
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`ae28f2e6bb741`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ae28f2e6bb741) -
|
|
8
|
+
Editor-4477: Removed the heading with alignment patch in the newGetSelection
|
|
9
|
+
- [`ae28f2e6bb741`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/ae28f2e6bb741) -
|
|
10
|
+
Editor-5020-fix-inline-drop-hints-not-visible-in-sync-block
|
|
11
|
+
- Updated dependencies
|
|
12
|
+
|
|
3
13
|
## 8.12.0
|
|
4
14
|
|
|
5
15
|
### Minor Changes
|
|
@@ -134,16 +134,21 @@ var canMoveToLayout = function canMoveToLayout(api, from, to, tr, moveNodeAtCurs
|
|
|
134
134
|
var _ref3 = tr.doc.type.schema.nodes || {},
|
|
135
135
|
layoutSection = _ref3.layoutSection,
|
|
136
136
|
layoutColumn = _ref3.layoutColumn,
|
|
137
|
-
doc = _ref3.doc
|
|
137
|
+
doc = _ref3.doc,
|
|
138
|
+
bodiedSyncBlock = _ref3.bodiedSyncBlock;
|
|
138
139
|
|
|
139
140
|
// layout plugin does not exist
|
|
140
141
|
if (!layoutSection || !layoutColumn) {
|
|
141
142
|
return;
|
|
142
143
|
}
|
|
143
144
|
var $to = tr.doc.resolve(to);
|
|
145
|
+
var allowedParentTypes = [doc, layoutSection];
|
|
146
|
+
if (bodiedSyncBlock && (0, _expValEquals.expValEquals)('platform_synced_block', 'isEnabled', true) && (0, _expValEquals.expValEquals)('platform_synced_block_patch_6', 'isEnabled', true)) {
|
|
147
|
+
allowedParentTypes.push(bodiedSyncBlock);
|
|
148
|
+
}
|
|
144
149
|
|
|
145
150
|
// drop at invalid position, not top level, or not a layout column
|
|
146
|
-
if (!$to.nodeAfter || !
|
|
151
|
+
if (!$to.nodeAfter || !allowedParentTypes.includes($to.parent.type)) {
|
|
147
152
|
return;
|
|
148
153
|
}
|
|
149
154
|
var $from = tr.doc.resolve(from);
|
|
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.shouldAllowInlineDropTarget = void 0;
|
|
7
7
|
var _utils = require("@atlaskit/editor-common/utils");
|
|
8
|
+
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
8
9
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
9
10
|
var _checkMediaLayout = require("./check-media-layout");
|
|
10
11
|
var _consts = require("./consts");
|
|
@@ -12,7 +13,13 @@ var syncedBlockTypes = ['syncBlock', 'bodiedSyncBlock'];
|
|
|
12
13
|
var shouldAllowInlineDropTarget = exports.shouldAllowInlineDropTarget = function shouldAllowInlineDropTarget(isNested, node) {
|
|
13
14
|
var isSameLayout = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
|
14
15
|
var activeNode = arguments.length > 3 ? arguments[3] : undefined;
|
|
16
|
+
var parentNode = arguments.length > 4 ? arguments[4] : undefined;
|
|
17
|
+
var isInsideBodiedSyncBlock = (parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) === 'bodiedSyncBlock';
|
|
15
18
|
if ((0, _experiments.editorExperiment)('advanced_layouts', false) || isNested) {
|
|
19
|
+
// If nested inside bodiedSyncBlock, enable inline drop target so user can drop to create a layout inside it
|
|
20
|
+
if (isInsideBodiedSyncBlock && (0, _expValEquals.expValEquals)('platform_synced_block', 'isEnabled', true) && (0, _expValEquals.expValEquals)('platform_synced_block_patch_6', 'isEnabled', true)) {
|
|
21
|
+
return true;
|
|
22
|
+
}
|
|
16
23
|
return false;
|
|
17
24
|
}
|
|
18
25
|
if ((0, _checkMediaLayout.isWrappedMedia)(node)) {
|
|
@@ -21,7 +28,7 @@ var shouldAllowInlineDropTarget = exports.shouldAllowInlineDropTarget = function
|
|
|
21
28
|
if ((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) === 'layoutSection') {
|
|
22
29
|
return false;
|
|
23
30
|
}
|
|
24
|
-
if ((syncedBlockTypes.includes((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) || '') || syncedBlockTypes.includes((node === null || node === void 0 ? void 0 : node.type.name) || '')) && (0, _experiments.editorExperiment)('platform_synced_block', true)) {
|
|
31
|
+
if ((syncedBlockTypes.includes((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) || '') || syncedBlockTypes.includes((node === null || node === void 0 ? void 0 : node.type.name) || '')) && (0, _experiments.editorExperiment)('platform_synced_block', true) && !(0, _expValEquals.expValEquals)('platform_synced_block_patch_6', 'isEnabled', true)) {
|
|
25
32
|
return false;
|
|
26
33
|
}
|
|
27
34
|
if ((node === null || node === void 0 ? void 0 : node.type.name) === 'layoutSection') {
|
|
@@ -113,12 +113,13 @@ var HoverZone = function HoverZone(_ref) {
|
|
|
113
113
|
_useActiveAnchorTrack2 = (0, _slicedToArray2.default)(_useActiveAnchorTrack, 2),
|
|
114
114
|
_isActive = _useActiveAnchorTrack2[0],
|
|
115
115
|
setActiveAnchor = _useActiveAnchorTrack2[1];
|
|
116
|
+
var isInsideBodiedSyncBlock = parent && parent.type.name === 'bodiedSyncBlock' && (0, _expValEquals.expValEquals)('platform_synced_block', 'isEnabled', true) && (0, _expValEquals.expValEquals)('platform_synced_block_patch_6', 'isEnabled', true);
|
|
116
117
|
(0, _react.useEffect)(function () {
|
|
117
118
|
if (ref.current) {
|
|
118
119
|
return (0, _adapter.dropTargetForElements)({
|
|
119
120
|
element: ref.current,
|
|
120
121
|
onDragEnter: function onDragEnter() {
|
|
121
|
-
if (!isNestedDropTarget && (0, _experiments.editorExperiment)('advanced_layouts', true)) {
|
|
122
|
+
if ((!isNestedDropTarget || isInsideBodiedSyncBlock) && (0, _experiments.editorExperiment)('advanced_layouts', true)) {
|
|
122
123
|
setActiveAnchor();
|
|
123
124
|
}
|
|
124
125
|
_onDragEnter();
|
|
@@ -127,7 +128,7 @@ var HoverZone = function HoverZone(_ref) {
|
|
|
127
128
|
onDrop: onDrop
|
|
128
129
|
});
|
|
129
130
|
}
|
|
130
|
-
}, [isNestedDropTarget, _onDragEnter, onDragLeave, onDrop, setActiveAnchor]);
|
|
131
|
+
}, [isNestedDropTarget, isInsideBodiedSyncBlock, _onDragEnter, onDragLeave, onDrop, setActiveAnchor]);
|
|
131
132
|
var hoverZoneUpperStyle = (0, _react.useMemo)(function () {
|
|
132
133
|
var heightStyleOffset = "var(--editor-block-controls-drop-indicator-gap, 0)/2";
|
|
133
134
|
var transformOffset = "var(".concat(EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_OFFSET, ", 0)");
|
|
@@ -238,6 +239,7 @@ var DropTarget = exports.DropTarget = function DropTarget(props) {
|
|
|
238
239
|
var dynamicStyle = (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({
|
|
239
240
|
width: isNestedDropTarget ? 'unset' : '100%'
|
|
240
241
|
}, EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_WIDTH, isNestedDropTarget ? '100%' : "".concat(lineLength || DEFAULT_DROP_INDICATOR_WIDTH, "px")), EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN, isNestedDropTarget ? (0, _consts.getNestedNodeLeftPaddingMargin)(parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) : '0'), EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX, _constants.layers.navigation());
|
|
242
|
+
var isShowInlineDropTarget = (0, _inlineDropTarget.shouldAllowInlineDropTarget)(isNestedDropTarget, nextNode, isSameLayout, activeNode, parentNode);
|
|
241
243
|
return (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(HoverZone, {
|
|
242
244
|
onDragEnter: function onDragEnter() {
|
|
243
245
|
return setIsDraggedOver(true);
|
|
@@ -282,7 +284,7 @@ var DropTarget = exports.DropTarget = function DropTarget(props) {
|
|
|
282
284
|
position: "lower",
|
|
283
285
|
isNestedDropTarget: isNestedDropTarget,
|
|
284
286
|
api: api
|
|
285
|
-
}),
|
|
287
|
+
}), isShowInlineDropTarget && (0, _react2.jsx)(_react.Fragment, null, (0, _react2.jsx)(_inlineDropTarget2.InlineDropTarget
|
|
286
288
|
// Ignored via go/ees005
|
|
287
289
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
288
290
|
, (0, _extends2.default)({}, props, {
|
|
@@ -130,7 +130,8 @@ const canMoveToLayout = (api, from, to, tr, moveNodeAtCursorPos) => {
|
|
|
130
130
|
const {
|
|
131
131
|
layoutSection,
|
|
132
132
|
layoutColumn,
|
|
133
|
-
doc
|
|
133
|
+
doc,
|
|
134
|
+
bodiedSyncBlock
|
|
134
135
|
} = tr.doc.type.schema.nodes || {};
|
|
135
136
|
|
|
136
137
|
// layout plugin does not exist
|
|
@@ -138,9 +139,13 @@ const canMoveToLayout = (api, from, to, tr, moveNodeAtCursorPos) => {
|
|
|
138
139
|
return;
|
|
139
140
|
}
|
|
140
141
|
const $to = tr.doc.resolve(to);
|
|
142
|
+
const allowedParentTypes = [doc, layoutSection];
|
|
143
|
+
if (bodiedSyncBlock && expValEquals('platform_synced_block', 'isEnabled', true) && expValEquals('platform_synced_block_patch_6', 'isEnabled', true)) {
|
|
144
|
+
allowedParentTypes.push(bodiedSyncBlock);
|
|
145
|
+
}
|
|
141
146
|
|
|
142
147
|
// drop at invalid position, not top level, or not a layout column
|
|
143
|
-
if (!$to.nodeAfter || !
|
|
148
|
+
if (!$to.nodeAfter || !allowedParentTypes.includes($to.parent.type)) {
|
|
144
149
|
return;
|
|
145
150
|
}
|
|
146
151
|
const $from = tr.doc.resolve(from);
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { isEmptyParagraph } from '@atlaskit/editor-common/utils';
|
|
2
|
+
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
2
3
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
3
4
|
import { isWrappedMedia } from './check-media-layout';
|
|
4
5
|
import { maxLayoutColumnSupported } from './consts';
|
|
@@ -7,8 +8,13 @@ export const shouldAllowInlineDropTarget = (isNested, node,
|
|
|
7
8
|
/**
|
|
8
9
|
* Is the active node in the same layout as the target node
|
|
9
10
|
*/
|
|
10
|
-
isSameLayout = false, activeNode) => {
|
|
11
|
+
isSameLayout = false, activeNode, parentNode) => {
|
|
12
|
+
const isInsideBodiedSyncBlock = (parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) === 'bodiedSyncBlock';
|
|
11
13
|
if (editorExperiment('advanced_layouts', false) || isNested) {
|
|
14
|
+
// If nested inside bodiedSyncBlock, enable inline drop target so user can drop to create a layout inside it
|
|
15
|
+
if (isInsideBodiedSyncBlock && expValEquals('platform_synced_block', 'isEnabled', true) && expValEquals('platform_synced_block_patch_6', 'isEnabled', true)) {
|
|
16
|
+
return true;
|
|
17
|
+
}
|
|
12
18
|
return false;
|
|
13
19
|
}
|
|
14
20
|
if (isWrappedMedia(node)) {
|
|
@@ -17,7 +23,7 @@ isSameLayout = false, activeNode) => {
|
|
|
17
23
|
if ((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) === 'layoutSection') {
|
|
18
24
|
return false;
|
|
19
25
|
}
|
|
20
|
-
if ((syncedBlockTypes.includes((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) || '') || syncedBlockTypes.includes((node === null || node === void 0 ? void 0 : node.type.name) || '')) && editorExperiment('platform_synced_block', true)) {
|
|
26
|
+
if ((syncedBlockTypes.includes((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) || '') || syncedBlockTypes.includes((node === null || node === void 0 ? void 0 : node.type.name) || '')) && editorExperiment('platform_synced_block', true) && !expValEquals('platform_synced_block_patch_6', 'isEnabled', true)) {
|
|
21
27
|
return false;
|
|
22
28
|
}
|
|
23
29
|
if ((node === null || node === void 0 ? void 0 : node.type.name) === 'layoutSection') {
|
|
@@ -101,12 +101,13 @@ const HoverZone = ({
|
|
|
101
101
|
return node ? getNodeAnchor(node) : '';
|
|
102
102
|
}, [api, node, pos, position]);
|
|
103
103
|
const [_isActive, setActiveAnchor] = useActiveAnchorTracker(anchorName);
|
|
104
|
+
const isInsideBodiedSyncBlock = parent && parent.type.name === 'bodiedSyncBlock' && expValEquals('platform_synced_block', 'isEnabled', true) && expValEquals('platform_synced_block_patch_6', 'isEnabled', true);
|
|
104
105
|
useEffect(() => {
|
|
105
106
|
if (ref.current) {
|
|
106
107
|
return dropTargetForElements({
|
|
107
108
|
element: ref.current,
|
|
108
109
|
onDragEnter: () => {
|
|
109
|
-
if (!isNestedDropTarget && editorExperiment('advanced_layouts', true)) {
|
|
110
|
+
if ((!isNestedDropTarget || isInsideBodiedSyncBlock) && editorExperiment('advanced_layouts', true)) {
|
|
110
111
|
setActiveAnchor();
|
|
111
112
|
}
|
|
112
113
|
onDragEnter();
|
|
@@ -115,7 +116,7 @@ const HoverZone = ({
|
|
|
115
116
|
onDrop
|
|
116
117
|
});
|
|
117
118
|
}
|
|
118
|
-
}, [isNestedDropTarget, onDragEnter, onDragLeave, onDrop, setActiveAnchor]);
|
|
119
|
+
}, [isNestedDropTarget, isInsideBodiedSyncBlock, onDragEnter, onDragLeave, onDrop, setActiveAnchor]);
|
|
119
120
|
const hoverZoneUpperStyle = useMemo(() => {
|
|
120
121
|
const heightStyleOffset = `var(--editor-block-controls-drop-indicator-gap, 0)/2`;
|
|
121
122
|
const transformOffset = `var(${EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_OFFSET}, 0)`;
|
|
@@ -231,6 +232,7 @@ export const DropTarget = props => {
|
|
|
231
232
|
[EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN]: isNestedDropTarget ? getNestedNodeLeftPaddingMargin(parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) : '0',
|
|
232
233
|
[EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX]: layers.navigation()
|
|
233
234
|
};
|
|
235
|
+
const isShowInlineDropTarget = shouldAllowInlineDropTarget(isNestedDropTarget, nextNode, isSameLayout, activeNode, parentNode);
|
|
234
236
|
return jsx(Fragment, null, jsx(HoverZone, {
|
|
235
237
|
onDragEnter: () => setIsDraggedOver(true),
|
|
236
238
|
onDragLeave: () => setIsDraggedOver(false),
|
|
@@ -267,7 +269,7 @@ export const DropTarget = props => {
|
|
|
267
269
|
position: "lower",
|
|
268
270
|
isNestedDropTarget: isNestedDropTarget,
|
|
269
271
|
api: api
|
|
270
|
-
}),
|
|
272
|
+
}), isShowInlineDropTarget && jsx(Fragment, null, jsx(InlineDropTarget
|
|
271
273
|
// Ignored via go/ees005
|
|
272
274
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
273
275
|
, _extends({}, props, {
|
|
@@ -128,16 +128,21 @@ var canMoveToLayout = function canMoveToLayout(api, from, to, tr, moveNodeAtCurs
|
|
|
128
128
|
var _ref3 = tr.doc.type.schema.nodes || {},
|
|
129
129
|
layoutSection = _ref3.layoutSection,
|
|
130
130
|
layoutColumn = _ref3.layoutColumn,
|
|
131
|
-
doc = _ref3.doc
|
|
131
|
+
doc = _ref3.doc,
|
|
132
|
+
bodiedSyncBlock = _ref3.bodiedSyncBlock;
|
|
132
133
|
|
|
133
134
|
// layout plugin does not exist
|
|
134
135
|
if (!layoutSection || !layoutColumn) {
|
|
135
136
|
return;
|
|
136
137
|
}
|
|
137
138
|
var $to = tr.doc.resolve(to);
|
|
139
|
+
var allowedParentTypes = [doc, layoutSection];
|
|
140
|
+
if (bodiedSyncBlock && expValEquals('platform_synced_block', 'isEnabled', true) && expValEquals('platform_synced_block_patch_6', 'isEnabled', true)) {
|
|
141
|
+
allowedParentTypes.push(bodiedSyncBlock);
|
|
142
|
+
}
|
|
138
143
|
|
|
139
144
|
// drop at invalid position, not top level, or not a layout column
|
|
140
|
-
if (!$to.nodeAfter || !
|
|
145
|
+
if (!$to.nodeAfter || !allowedParentTypes.includes($to.parent.type)) {
|
|
141
146
|
return;
|
|
142
147
|
}
|
|
143
148
|
var $from = tr.doc.resolve(from);
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { isEmptyParagraph } from '@atlaskit/editor-common/utils';
|
|
2
|
+
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
2
3
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
3
4
|
import { isWrappedMedia } from './check-media-layout';
|
|
4
5
|
import { maxLayoutColumnSupported } from './consts';
|
|
@@ -6,7 +7,13 @@ var syncedBlockTypes = ['syncBlock', 'bodiedSyncBlock'];
|
|
|
6
7
|
export var shouldAllowInlineDropTarget = function shouldAllowInlineDropTarget(isNested, node) {
|
|
7
8
|
var isSameLayout = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
|
|
8
9
|
var activeNode = arguments.length > 3 ? arguments[3] : undefined;
|
|
10
|
+
var parentNode = arguments.length > 4 ? arguments[4] : undefined;
|
|
11
|
+
var isInsideBodiedSyncBlock = (parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) === 'bodiedSyncBlock';
|
|
9
12
|
if (editorExperiment('advanced_layouts', false) || isNested) {
|
|
13
|
+
// If nested inside bodiedSyncBlock, enable inline drop target so user can drop to create a layout inside it
|
|
14
|
+
if (isInsideBodiedSyncBlock && expValEquals('platform_synced_block', 'isEnabled', true) && expValEquals('platform_synced_block_patch_6', 'isEnabled', true)) {
|
|
15
|
+
return true;
|
|
16
|
+
}
|
|
10
17
|
return false;
|
|
11
18
|
}
|
|
12
19
|
if (isWrappedMedia(node)) {
|
|
@@ -15,7 +22,7 @@ export var shouldAllowInlineDropTarget = function shouldAllowInlineDropTarget(is
|
|
|
15
22
|
if ((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) === 'layoutSection') {
|
|
16
23
|
return false;
|
|
17
24
|
}
|
|
18
|
-
if ((syncedBlockTypes.includes((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) || '') || syncedBlockTypes.includes((node === null || node === void 0 ? void 0 : node.type.name) || '')) && editorExperiment('platform_synced_block', true)) {
|
|
25
|
+
if ((syncedBlockTypes.includes((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) || '') || syncedBlockTypes.includes((node === null || node === void 0 ? void 0 : node.type.name) || '')) && editorExperiment('platform_synced_block', true) && !expValEquals('platform_synced_block_patch_6', 'isEnabled', true)) {
|
|
19
26
|
return false;
|
|
20
27
|
}
|
|
21
28
|
if ((node === null || node === void 0 ? void 0 : node.type.name) === 'layoutSection') {
|
|
@@ -105,12 +105,13 @@ var HoverZone = function HoverZone(_ref) {
|
|
|
105
105
|
_useActiveAnchorTrack2 = _slicedToArray(_useActiveAnchorTrack, 2),
|
|
106
106
|
_isActive = _useActiveAnchorTrack2[0],
|
|
107
107
|
setActiveAnchor = _useActiveAnchorTrack2[1];
|
|
108
|
+
var isInsideBodiedSyncBlock = parent && parent.type.name === 'bodiedSyncBlock' && expValEquals('platform_synced_block', 'isEnabled', true) && expValEquals('platform_synced_block_patch_6', 'isEnabled', true);
|
|
108
109
|
useEffect(function () {
|
|
109
110
|
if (ref.current) {
|
|
110
111
|
return dropTargetForElements({
|
|
111
112
|
element: ref.current,
|
|
112
113
|
onDragEnter: function onDragEnter() {
|
|
113
|
-
if (!isNestedDropTarget && editorExperiment('advanced_layouts', true)) {
|
|
114
|
+
if ((!isNestedDropTarget || isInsideBodiedSyncBlock) && editorExperiment('advanced_layouts', true)) {
|
|
114
115
|
setActiveAnchor();
|
|
115
116
|
}
|
|
116
117
|
_onDragEnter();
|
|
@@ -119,7 +120,7 @@ var HoverZone = function HoverZone(_ref) {
|
|
|
119
120
|
onDrop: onDrop
|
|
120
121
|
});
|
|
121
122
|
}
|
|
122
|
-
}, [isNestedDropTarget, _onDragEnter, onDragLeave, onDrop, setActiveAnchor]);
|
|
123
|
+
}, [isNestedDropTarget, isInsideBodiedSyncBlock, _onDragEnter, onDragLeave, onDrop, setActiveAnchor]);
|
|
123
124
|
var hoverZoneUpperStyle = useMemo(function () {
|
|
124
125
|
var heightStyleOffset = "var(--editor-block-controls-drop-indicator-gap, 0)/2";
|
|
125
126
|
var transformOffset = "var(".concat(EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_OFFSET, ", 0)");
|
|
@@ -230,6 +231,7 @@ export var DropTarget = function DropTarget(props) {
|
|
|
230
231
|
var dynamicStyle = _defineProperty(_defineProperty(_defineProperty({
|
|
231
232
|
width: isNestedDropTarget ? 'unset' : '100%'
|
|
232
233
|
}, EDITOR_BLOCK_CONTROLS_DROP_INDICATOR_WIDTH, isNestedDropTarget ? '100%' : "".concat(lineLength || DEFAULT_DROP_INDICATOR_WIDTH, "px")), EDITOR_BLOCK_CONTROLS_DROP_TARGET_LEFT_MARGIN, isNestedDropTarget ? getNestedNodeLeftPaddingMargin(parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) : '0'), EDITOR_BLOCK_CONTROLS_DROP_TARGET_ZINDEX, layers.navigation());
|
|
234
|
+
var isShowInlineDropTarget = shouldAllowInlineDropTarget(isNestedDropTarget, nextNode, isSameLayout, activeNode, parentNode);
|
|
233
235
|
return jsx(Fragment, null, jsx(HoverZone, {
|
|
234
236
|
onDragEnter: function onDragEnter() {
|
|
235
237
|
return setIsDraggedOver(true);
|
|
@@ -274,7 +276,7 @@ export var DropTarget = function DropTarget(props) {
|
|
|
274
276
|
position: "lower",
|
|
275
277
|
isNestedDropTarget: isNestedDropTarget,
|
|
276
278
|
api: api
|
|
277
|
-
}),
|
|
279
|
+
}), isShowInlineDropTarget && jsx(Fragment, null, jsx(InlineDropTarget
|
|
278
280
|
// Ignored via go/ees005
|
|
279
281
|
// eslint-disable-next-line react/jsx-props-no-spreading
|
|
280
282
|
, _extends({}, props, {
|
|
@@ -4,4 +4,4 @@ export declare const shouldAllowInlineDropTarget: (isNested: boolean, node?: PMN
|
|
|
4
4
|
/**
|
|
5
5
|
* Is the active node in the same layout as the target node
|
|
6
6
|
*/
|
|
7
|
-
isSameLayout?: boolean, activeNode?: ActiveNode) => boolean;
|
|
7
|
+
isSameLayout?: boolean, activeNode?: ActiveNode, parentNode?: PMNode) => boolean;
|
|
@@ -4,4 +4,4 @@ export declare const shouldAllowInlineDropTarget: (isNested: boolean, node?: PMN
|
|
|
4
4
|
/**
|
|
5
5
|
* Is the active node in the same layout as the target node
|
|
6
6
|
*/
|
|
7
|
-
isSameLayout?: boolean, activeNode?: ActiveNode) => boolean;
|
|
7
|
+
isSameLayout?: boolean, activeNode?: ActiveNode, parentNode?: PMNode) => boolean;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-block-controls",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "9.0.0",
|
|
4
4
|
"description": "Block controls plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -30,20 +30,20 @@
|
|
|
30
30
|
"dependencies": {
|
|
31
31
|
"@atlaskit/browser-apis": "^0.0.1",
|
|
32
32
|
"@atlaskit/button": "^23.10.0",
|
|
33
|
-
"@atlaskit/editor-plugin-accessibility-utils": "^
|
|
34
|
-
"@atlaskit/editor-plugin-analytics": "^
|
|
35
|
-
"@atlaskit/editor-plugin-editor-disabled": "^
|
|
36
|
-
"@atlaskit/editor-plugin-editor-viewmode": "^
|
|
37
|
-
"@atlaskit/editor-plugin-feature-flags": "^
|
|
38
|
-
"@atlaskit/editor-plugin-interaction": "^
|
|
39
|
-
"@atlaskit/editor-plugin-limited-mode": "^
|
|
40
|
-
"@atlaskit/editor-plugin-metrics": "^
|
|
41
|
-
"@atlaskit/editor-plugin-quick-insert": "^
|
|
42
|
-
"@atlaskit/editor-plugin-selection": "^
|
|
43
|
-
"@atlaskit/editor-plugin-toolbar": "^
|
|
44
|
-
"@atlaskit/editor-plugin-type-ahead": "^
|
|
45
|
-
"@atlaskit/editor-plugin-user-intent": "^
|
|
46
|
-
"@atlaskit/editor-plugin-width": "^
|
|
33
|
+
"@atlaskit/editor-plugin-accessibility-utils": "^8.0.0",
|
|
34
|
+
"@atlaskit/editor-plugin-analytics": "^8.0.0",
|
|
35
|
+
"@atlaskit/editor-plugin-editor-disabled": "^8.0.0",
|
|
36
|
+
"@atlaskit/editor-plugin-editor-viewmode": "^10.0.0",
|
|
37
|
+
"@atlaskit/editor-plugin-feature-flags": "^7.0.0",
|
|
38
|
+
"@atlaskit/editor-plugin-interaction": "^15.0.0",
|
|
39
|
+
"@atlaskit/editor-plugin-limited-mode": "^5.0.0",
|
|
40
|
+
"@atlaskit/editor-plugin-metrics": "^9.0.0",
|
|
41
|
+
"@atlaskit/editor-plugin-quick-insert": "^8.0.0",
|
|
42
|
+
"@atlaskit/editor-plugin-selection": "^8.0.0",
|
|
43
|
+
"@atlaskit/editor-plugin-toolbar": "^5.0.0",
|
|
44
|
+
"@atlaskit/editor-plugin-type-ahead": "^8.0.0",
|
|
45
|
+
"@atlaskit/editor-plugin-user-intent": "^6.0.0",
|
|
46
|
+
"@atlaskit/editor-plugin-width": "^9.0.0",
|
|
47
47
|
"@atlaskit/editor-prosemirror": "^7.3.0",
|
|
48
48
|
"@atlaskit/editor-shared-styles": "^3.10.0",
|
|
49
49
|
"@atlaskit/editor-tables": "^2.9.0",
|
|
@@ -56,7 +56,7 @@
|
|
|
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.
|
|
59
|
+
"@atlaskit/tmp-editor-statsig": "^35.10.0",
|
|
60
60
|
"@atlaskit/tokens": "^11.1.0",
|
|
61
61
|
"@atlaskit/tooltip": "^20.14.0",
|
|
62
62
|
"@babel/runtime": "^7.0.0",
|
|
@@ -67,7 +67,7 @@
|
|
|
67
67
|
"uuid": "^3.1.0"
|
|
68
68
|
},
|
|
69
69
|
"peerDependencies": {
|
|
70
|
-
"@atlaskit/editor-common": "^
|
|
70
|
+
"@atlaskit/editor-common": "^112.0.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"
|