@atlaskit/editor-plugin-block-controls 9.0.7 → 9.0.10
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 +23 -0
- package/dist/cjs/pm-plugins/decorations-drag-handle.js +2 -1
- package/dist/cjs/pm-plugins/decorations-quick-insert-button.js +2 -1
- package/dist/cjs/pm-plugins/handle-mouse-over.js +2 -2
- package/dist/cjs/pm-plugins/main.js +14 -6
- package/dist/cjs/pm-plugins/utils/inline-drop-target.js +2 -3
- package/dist/cjs/ui/drag-handle.js +1 -1
- package/dist/es2019/pm-plugins/decorations-drag-handle.js +2 -1
- package/dist/es2019/pm-plugins/decorations-quick-insert-button.js +2 -1
- package/dist/es2019/pm-plugins/handle-mouse-over.js +2 -2
- package/dist/es2019/pm-plugins/main.js +14 -6
- package/dist/es2019/pm-plugins/utils/inline-drop-target.js +2 -3
- package/dist/es2019/ui/drag-handle.js +1 -1
- package/dist/esm/pm-plugins/decorations-drag-handle.js +2 -1
- package/dist/esm/pm-plugins/decorations-quick-insert-button.js +2 -1
- package/dist/esm/pm-plugins/handle-mouse-over.js +2 -2
- package/dist/esm/pm-plugins/main.js +14 -6
- package/dist/esm/pm-plugins/utils/inline-drop-target.js +2 -3
- package/dist/esm/ui/drag-handle.js +1 -1
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,28 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-block-controls
|
|
2
2
|
|
|
3
|
+
## 9.0.10
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`3bc16a4221f74`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3bc16a4221f74) -
|
|
8
|
+
[ux] EDITOR-5746 fix bug where drop targets appeared (and never cleared) after table row drag
|
|
9
|
+
- Updated dependencies
|
|
10
|
+
|
|
11
|
+
## 9.0.9
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- [`97fd2b35b4ba3`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/97fd2b35b4ba3) -
|
|
16
|
+
Editor-5020: fix inline drop hint outside synced block
|
|
17
|
+
- Updated dependencies
|
|
18
|
+
|
|
19
|
+
## 9.0.8
|
|
20
|
+
|
|
21
|
+
### Patch Changes
|
|
22
|
+
|
|
23
|
+
- [`57160c29bc79d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/57160c29bc79d) -
|
|
24
|
+
Fix exposure for remix button block
|
|
25
|
+
|
|
3
26
|
## 9.0.7
|
|
4
27
|
|
|
5
28
|
### Patch Changes
|
|
@@ -13,6 +13,7 @@ var _uuid = _interopRequireDefault(require("uuid"));
|
|
|
13
13
|
var _view = require("@atlaskit/editor-prosemirror/view");
|
|
14
14
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
15
15
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
16
|
+
var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
|
|
16
17
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
17
18
|
var _dragHandle = require("../ui/drag-handle");
|
|
18
19
|
var _decorationsCommon = require("./decorations-common");
|
|
@@ -85,7 +86,7 @@ var dragHandleDecoration = exports.dragHandleDecoration = function dragHandleDec
|
|
|
85
86
|
var element = document.createElement('span');
|
|
86
87
|
// inline decoration causes focus issues when refocusing Editor into first line
|
|
87
88
|
element.style.display = 'block';
|
|
88
|
-
if ((0,
|
|
89
|
+
if ((0, _expValEqualsNoExposure.expValEqualsNoExposure)('confluence_remix_icon_right_side', 'isEnabled', true)) {
|
|
89
90
|
element.setAttribute('data-blocks-decorator-widget', 'true');
|
|
90
91
|
}
|
|
91
92
|
element.setAttribute('data-testid', 'block-ctrl-decorator-widget');
|
|
@@ -10,6 +10,7 @@ var _uuid = _interopRequireDefault(require("uuid"));
|
|
|
10
10
|
var _view = require("@atlaskit/editor-prosemirror/view");
|
|
11
11
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
12
12
|
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
13
|
+
var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
|
|
13
14
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
14
15
|
var _quickInsertButton = require("../ui/quick-insert-button");
|
|
15
16
|
var _marks = require("./utils/marks");
|
|
@@ -76,7 +77,7 @@ var quickInsertButtonDecoration = exports.quickInsertButtonDecoration = function
|
|
|
76
77
|
}
|
|
77
78
|
element.contentEditable = 'false';
|
|
78
79
|
element.setAttribute('data-blocks-quick-insert-container', 'true');
|
|
79
|
-
if ((0,
|
|
80
|
+
if ((0, _expValEqualsNoExposure.expValEqualsNoExposure)('confluence_remix_icon_right_side', 'isEnabled', true)) {
|
|
80
81
|
element.setAttribute('data-blocks-quick-insert-button', 'true');
|
|
81
82
|
}
|
|
82
83
|
element.setAttribute('data-testid', 'block-ctrl-quick-insert-button');
|
|
@@ -63,7 +63,7 @@ var handleMouseOver = exports.handleMouseOver = function handleMouseOver(view, e
|
|
|
63
63
|
// We shouldn't be firing mouse over transactions when the editor is disabled,
|
|
64
64
|
// except in view mode when right-side controls are enabled (show controls on block hover)
|
|
65
65
|
var rightSideControlsEnabled = (_api$blockControls$sh = api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || (_api$blockControls2 = _api$blockControls2.sharedState.currentState()) === null || _api$blockControls2 === void 0 ? void 0 : _api$blockControls2.rightSideControlsEnabled) !== null && _api$blockControls$sh !== void 0 ? _api$blockControls$sh : false;
|
|
66
|
-
if (editorDisabled && (!isViewMode || !(rightSideControlsEnabled && (0,
|
|
66
|
+
if (editorDisabled && (!isViewMode || !(rightSideControlsEnabled && (0, _expValEqualsNoExposure.expValEqualsNoExposure)('confluence_remix_icon_right_side', 'isEnabled', true)))) {
|
|
67
67
|
return false;
|
|
68
68
|
}
|
|
69
69
|
|
|
@@ -89,7 +89,7 @@ var handleMouseOver = exports.handleMouseOver = function handleMouseOver(view, e
|
|
|
89
89
|
|
|
90
90
|
// When hovering over the right-edge button (rendered in a portal outside the block), resolve the
|
|
91
91
|
// block from the container's anchor so activeNode stays set and the button remains visible.
|
|
92
|
-
if (!rootElement && rightSideControlsEnabled && (0,
|
|
92
|
+
if (!rootElement && rightSideControlsEnabled && (0, _expValEqualsNoExposure.expValEqualsNoExposure)('confluence_remix_icon_right_side', 'isEnabled', true)) {
|
|
93
93
|
var rightEdgeContainer = target === null || target === void 0 ? void 0 : target.closest('[data-blocks-right-edge-button-container]');
|
|
94
94
|
if (rightEdgeContainer) {
|
|
95
95
|
var anchor = rightEdgeContainer.getAttribute('data-blocks-right-edge-button-anchor');
|
|
@@ -468,7 +468,7 @@ var _apply = exports.apply = function apply(api, formatMessage, tr, currentState
|
|
|
468
468
|
_iterator.f();
|
|
469
469
|
}
|
|
470
470
|
}
|
|
471
|
-
if (rightSideControlsEnabled && isViewMode && (0,
|
|
471
|
+
if (rightSideControlsEnabled && isViewMode && (0, _expValEqualsNoExposure.expValEqualsNoExposure)('confluence_remix_icon_right_side', 'isEnabled', true)) {
|
|
472
472
|
var _iterator2 = _createForOfIteratorHelper(nodeDecorationRegistry),
|
|
473
473
|
_step2;
|
|
474
474
|
try {
|
|
@@ -650,7 +650,7 @@ var _apply = exports.apply = function apply(api, formatMessage, tr, currentState
|
|
|
650
650
|
} finally {
|
|
651
651
|
_iterator5.f();
|
|
652
652
|
}
|
|
653
|
-
} else if (isViewMode && rightSideControlsEnabled && (0,
|
|
653
|
+
} else if (isViewMode && rightSideControlsEnabled && (0, _expValEqualsNoExposure.expValEqualsNoExposure)('confluence_remix_icon_right_side', 'isEnabled', true)) {
|
|
654
654
|
// Remove view-mode right-side decorations when no active node
|
|
655
655
|
var _iterator6 = _createForOfIteratorHelper(nodeDecorationRegistry),
|
|
656
656
|
_step6;
|
|
@@ -811,8 +811,9 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
|
|
|
811
811
|
var isDisabled = api === null || api === void 0 || (_api$editorDisabled = api.editorDisabled) === null || _api$editorDisabled === void 0 || (_api$editorDisabled = _api$editorDisabled.sharedState.currentState()) === null || _api$editorDisabled === void 0 ? void 0 : _api$editorDisabled.editorDisabled;
|
|
812
812
|
if (isDisabled) {
|
|
813
813
|
var _api$editorViewMode2;
|
|
814
|
+
var remixRightSideEnabled = rightSideControlsEnabled && (0, _expValEqualsNoExposure.expValEqualsNoExposure)('confluence_remix_icon_right_side', 'isEnabled', true);
|
|
814
815
|
// Hide decorations when disabled, except in view mode when right-side controls are enabled
|
|
815
|
-
if (!
|
|
816
|
+
if (!remixRightSideEnabled || (api === null || api === void 0 || (_api$editorViewMode2 = api.editorViewMode) === null || _api$editorViewMode2 === void 0 || (_api$editorViewMode2 = _api$editorViewMode2.sharedState.currentState()) === null || _api$editorViewMode2 === void 0 ? void 0 : _api$editorViewMode2.mode) !== 'view') {
|
|
816
817
|
return;
|
|
817
818
|
}
|
|
818
819
|
}
|
|
@@ -868,10 +869,17 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
|
|
|
868
869
|
return false;
|
|
869
870
|
},
|
|
870
871
|
dragenter: function dragenter(view, event) {
|
|
871
|
-
var _api$limitedMode3;
|
|
872
|
+
var _api$limitedMode3, _key$getState3;
|
|
872
873
|
if (api !== null && api !== void 0 && (_api$limitedMode3 = api.limitedMode) !== null && _api$limitedMode3 !== void 0 && (_api$limitedMode3 = _api$limitedMode3.sharedState.currentState()) !== null && _api$limitedMode3 !== void 0 && _api$limitedMode3.enabled) {
|
|
873
874
|
return;
|
|
874
875
|
}
|
|
876
|
+
|
|
877
|
+
// Only process dragenter for block control drags.
|
|
878
|
+
// Other drag types (e.g. table row) should not create
|
|
879
|
+
// drop target decorations or emit active anchors.
|
|
880
|
+
if (!((_key$getState3 = key.getState(view.state)) !== null && _key$getState3 !== void 0 && _key$getState3.isDragging) && (0, _expValEquals.expValEquals)('platform_editor_fix_table_row_drag_drop_target', 'isEnabled', true)) {
|
|
881
|
+
return;
|
|
882
|
+
}
|
|
875
883
|
if (isHTMLElement(event.target) && (0, _expValEquals.expValEquals)('platform_editor_block_controls_perf_optimization', 'isEnabled', true)) {
|
|
876
884
|
var targetElement = event.target.closest('[data-prosemirror-node-name]');
|
|
877
885
|
if (targetElement) {
|
|
@@ -920,13 +928,13 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
|
|
|
920
928
|
})));
|
|
921
929
|
},
|
|
922
930
|
dragend: function dragend(view) {
|
|
923
|
-
var _api$limitedMode5, _key$
|
|
931
|
+
var _api$limitedMode5, _key$getState4;
|
|
924
932
|
if (api !== null && api !== void 0 && (_api$limitedMode5 = api.limitedMode) !== null && _api$limitedMode5 !== void 0 && (_api$limitedMode5 = _api$limitedMode5.sharedState.currentState()) !== null && _api$limitedMode5 !== void 0 && _api$limitedMode5.enabled) {
|
|
925
933
|
return;
|
|
926
934
|
}
|
|
927
935
|
var state = view.state,
|
|
928
936
|
dispatch = view.dispatch;
|
|
929
|
-
if ((_key$
|
|
937
|
+
if ((_key$getState4 = key.getState(state)) !== null && _key$getState4 !== void 0 && _key$getState4.isPMDragging) {
|
|
930
938
|
var tr = state.tr;
|
|
931
939
|
tr.setMeta(key, _objectSpread(_objectSpread({}, state.tr.getMeta(key)), {}, {
|
|
932
940
|
isPMDragging: false
|
|
@@ -5,7 +5,6 @@ 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");
|
|
9
8
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
10
9
|
var _checkMediaLayout = require("./check-media-layout");
|
|
11
10
|
var _consts = require("./consts");
|
|
@@ -17,7 +16,7 @@ var shouldAllowInlineDropTarget = exports.shouldAllowInlineDropTarget = function
|
|
|
17
16
|
var isInsideBodiedSyncBlock = (parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) === 'bodiedSyncBlock';
|
|
18
17
|
if ((0, _experiments.editorExperiment)('advanced_layouts', false) || isNested) {
|
|
19
18
|
// If nested inside bodiedSyncBlock, enable inline drop target so user can drop to create a layout inside it
|
|
20
|
-
if (isInsideBodiedSyncBlock && (0,
|
|
19
|
+
if (isInsideBodiedSyncBlock && (0, _experiments.editorExperiment)('platform_synced_block', true) && (0, _experiments.editorExperiment)('platform_synced_block_patch_6', true)) {
|
|
21
20
|
return true;
|
|
22
21
|
}
|
|
23
22
|
return false;
|
|
@@ -28,7 +27,7 @@ var shouldAllowInlineDropTarget = exports.shouldAllowInlineDropTarget = function
|
|
|
28
27
|
if ((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) === 'layoutSection') {
|
|
29
28
|
return false;
|
|
30
29
|
}
|
|
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)
|
|
30
|
+
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)) {
|
|
32
31
|
return false;
|
|
33
32
|
}
|
|
34
33
|
if ((node === null || node === void 0 ? void 0 : node.type.name) === 'layoutSection') {
|
|
@@ -1124,7 +1124,7 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref3) {
|
|
|
1124
1124
|
onDrop: handleOnDrop,
|
|
1125
1125
|
disabled: dragHandleDisabled,
|
|
1126
1126
|
"data-editor-block-ctrl-drag-handle": true,
|
|
1127
|
-
"data-blocks-drag-handle": (0,
|
|
1127
|
+
"data-blocks-drag-handle": (0, _expValEqualsNoExposure.expValEqualsNoExposure)('confluence_remix_icon_right_side', 'isEnabled', true) || undefined,
|
|
1128
1128
|
"data-testid": "block-ctrl-drag-handle",
|
|
1129
1129
|
"aria-label": dragHandleAriaLabel,
|
|
1130
1130
|
onBlur: (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) ? function () {
|
|
@@ -6,6 +6,7 @@ import uuid from 'uuid';
|
|
|
6
6
|
import { Decoration } from '@atlaskit/editor-prosemirror/view';
|
|
7
7
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
8
8
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
9
|
+
import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
|
|
9
10
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
10
11
|
import { DragHandle, DragHandleWithVisibility } from '../ui/drag-handle';
|
|
11
12
|
import { TYPE_HANDLE_DEC, TYPE_NODE_DEC, unmountDecorations } from './decorations-common';
|
|
@@ -76,7 +77,7 @@ export const dragHandleDecoration = ({
|
|
|
76
77
|
const element = document.createElement('span');
|
|
77
78
|
// inline decoration causes focus issues when refocusing Editor into first line
|
|
78
79
|
element.style.display = 'block';
|
|
79
|
-
if (
|
|
80
|
+
if (expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true)) {
|
|
80
81
|
element.setAttribute('data-blocks-decorator-widget', 'true');
|
|
81
82
|
}
|
|
82
83
|
element.setAttribute('data-testid', 'block-ctrl-decorator-widget');
|
|
@@ -4,6 +4,7 @@ import uuid from 'uuid';
|
|
|
4
4
|
import { Decoration } from '@atlaskit/editor-prosemirror/view';
|
|
5
5
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
6
6
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
7
|
+
import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
|
|
7
8
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
8
9
|
import { QuickInsertWithVisibility } from '../ui/quick-insert-button';
|
|
9
10
|
import { getActiveBlockMarks } from './utils/marks';
|
|
@@ -67,7 +68,7 @@ export const quickInsertButtonDecoration = ({
|
|
|
67
68
|
}
|
|
68
69
|
element.contentEditable = 'false';
|
|
69
70
|
element.setAttribute('data-blocks-quick-insert-container', 'true');
|
|
70
|
-
if (
|
|
71
|
+
if (expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true)) {
|
|
71
72
|
element.setAttribute('data-blocks-quick-insert-button', 'true');
|
|
72
73
|
}
|
|
73
74
|
element.setAttribute('data-testid', 'block-ctrl-quick-insert-button');
|
|
@@ -55,7 +55,7 @@ export const handleMouseOver = (view, event, api) => {
|
|
|
55
55
|
// We shouldn't be firing mouse over transactions when the editor is disabled,
|
|
56
56
|
// except in view mode when right-side controls are enabled (show controls on block hover)
|
|
57
57
|
const rightSideControlsEnabled = (_api$blockControls$sh = api === null || api === void 0 ? void 0 : (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 ? void 0 : (_api$blockControls2$s = _api$blockControls2.sharedState.currentState()) === null || _api$blockControls2$s === void 0 ? void 0 : _api$blockControls2$s.rightSideControlsEnabled) !== null && _api$blockControls$sh !== void 0 ? _api$blockControls$sh : false;
|
|
58
|
-
if (editorDisabled && (!isViewMode || !(rightSideControlsEnabled &&
|
|
58
|
+
if (editorDisabled && (!isViewMode || !(rightSideControlsEnabled && expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true)))) {
|
|
59
59
|
return false;
|
|
60
60
|
}
|
|
61
61
|
|
|
@@ -81,7 +81,7 @@ export const handleMouseOver = (view, event, api) => {
|
|
|
81
81
|
|
|
82
82
|
// When hovering over the right-edge button (rendered in a portal outside the block), resolve the
|
|
83
83
|
// block from the container's anchor so activeNode stays set and the button remains visible.
|
|
84
|
-
if (!rootElement && rightSideControlsEnabled &&
|
|
84
|
+
if (!rootElement && rightSideControlsEnabled && expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true)) {
|
|
85
85
|
const rightEdgeContainer = target === null || target === void 0 ? void 0 : target.closest('[data-blocks-right-edge-button-container]');
|
|
86
86
|
if (rightEdgeContainer) {
|
|
87
87
|
const anchor = rightEdgeContainer.getAttribute('data-blocks-right-edge-button-anchor');
|
|
@@ -444,7 +444,7 @@ export const apply = (api, formatMessage, tr, currentState, newState, flags, nod
|
|
|
444
444
|
decorations = decorations.remove(old);
|
|
445
445
|
}
|
|
446
446
|
}
|
|
447
|
-
if (rightSideControlsEnabled && isViewMode &&
|
|
447
|
+
if (rightSideControlsEnabled && isViewMode && expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true)) {
|
|
448
448
|
for (const factory of nodeDecorationRegistry) {
|
|
449
449
|
if (factory.showInViewMode) {
|
|
450
450
|
var _activeNode1, _activeNode10;
|
|
@@ -564,7 +564,7 @@ export const apply = (api, formatMessage, tr, currentState, newState, flags, nod
|
|
|
564
564
|
decorations = decorations.add(newState.doc, [dec]);
|
|
565
565
|
}
|
|
566
566
|
}
|
|
567
|
-
} else if (isViewMode && rightSideControlsEnabled &&
|
|
567
|
+
} else if (isViewMode && rightSideControlsEnabled && expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true)) {
|
|
568
568
|
// Remove view-mode right-side decorations when no active node
|
|
569
569
|
for (const factory of nodeDecorationRegistry) {
|
|
570
570
|
if (factory.showInViewMode) {
|
|
@@ -710,8 +710,9 @@ export const createPlugin = (api, getIntl, nodeViewPortalProviderAPI, nodeDecora
|
|
|
710
710
|
const isDisabled = api === null || api === void 0 ? void 0 : (_api$editorDisabled = api.editorDisabled) === null || _api$editorDisabled === void 0 ? void 0 : (_api$editorDisabled$s = _api$editorDisabled.sharedState.currentState()) === null || _api$editorDisabled$s === void 0 ? void 0 : _api$editorDisabled$s.editorDisabled;
|
|
711
711
|
if (isDisabled) {
|
|
712
712
|
var _api$editorViewMode2, _api$editorViewMode2$;
|
|
713
|
+
const remixRightSideEnabled = rightSideControlsEnabled && expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true);
|
|
713
714
|
// Hide decorations when disabled, except in view mode when right-side controls are enabled
|
|
714
|
-
if (!
|
|
715
|
+
if (!remixRightSideEnabled || (api === null || api === void 0 ? void 0 : (_api$editorViewMode2 = api.editorViewMode) === null || _api$editorViewMode2 === void 0 ? void 0 : (_api$editorViewMode2$ = _api$editorViewMode2.sharedState.currentState()) === null || _api$editorViewMode2$ === void 0 ? void 0 : _api$editorViewMode2$.mode) !== 'view') {
|
|
715
716
|
return;
|
|
716
717
|
}
|
|
717
718
|
}
|
|
@@ -770,10 +771,17 @@ export const createPlugin = (api, getIntl, nodeViewPortalProviderAPI, nodeDecora
|
|
|
770
771
|
return false;
|
|
771
772
|
},
|
|
772
773
|
dragenter(view, event) {
|
|
773
|
-
var _api$limitedMode3, _api$limitedMode3$sha;
|
|
774
|
+
var _api$limitedMode3, _api$limitedMode3$sha, _key$getState3;
|
|
774
775
|
if (api !== null && api !== void 0 && (_api$limitedMode3 = api.limitedMode) !== null && _api$limitedMode3 !== void 0 && (_api$limitedMode3$sha = _api$limitedMode3.sharedState.currentState()) !== null && _api$limitedMode3$sha !== void 0 && _api$limitedMode3$sha.enabled) {
|
|
775
776
|
return;
|
|
776
777
|
}
|
|
778
|
+
|
|
779
|
+
// Only process dragenter for block control drags.
|
|
780
|
+
// Other drag types (e.g. table row) should not create
|
|
781
|
+
// drop target decorations or emit active anchors.
|
|
782
|
+
if (!((_key$getState3 = key.getState(view.state)) !== null && _key$getState3 !== void 0 && _key$getState3.isDragging) && expValEquals('platform_editor_fix_table_row_drag_drop_target', 'isEnabled', true)) {
|
|
783
|
+
return;
|
|
784
|
+
}
|
|
777
785
|
if (isHTMLElement(event.target) && expValEquals('platform_editor_block_controls_perf_optimization', 'isEnabled', true)) {
|
|
778
786
|
const targetElement = event.target.closest('[data-prosemirror-node-name]');
|
|
779
787
|
if (targetElement) {
|
|
@@ -823,7 +831,7 @@ export const createPlugin = (api, getIntl, nodeViewPortalProviderAPI, nodeDecora
|
|
|
823
831
|
}));
|
|
824
832
|
},
|
|
825
833
|
dragend(view) {
|
|
826
|
-
var _api$limitedMode5, _api$limitedMode5$sha, _key$
|
|
834
|
+
var _api$limitedMode5, _api$limitedMode5$sha, _key$getState4;
|
|
827
835
|
if (api !== null && api !== void 0 && (_api$limitedMode5 = api.limitedMode) !== null && _api$limitedMode5 !== void 0 && (_api$limitedMode5$sha = _api$limitedMode5.sharedState.currentState()) !== null && _api$limitedMode5$sha !== void 0 && _api$limitedMode5$sha.enabled) {
|
|
828
836
|
return;
|
|
829
837
|
}
|
|
@@ -831,7 +839,7 @@ export const createPlugin = (api, getIntl, nodeViewPortalProviderAPI, nodeDecora
|
|
|
831
839
|
state,
|
|
832
840
|
dispatch
|
|
833
841
|
} = view;
|
|
834
|
-
if ((_key$
|
|
842
|
+
if ((_key$getState4 = key.getState(state)) !== null && _key$getState4 !== void 0 && _key$getState4.isPMDragging) {
|
|
835
843
|
const tr = state.tr;
|
|
836
844
|
tr.setMeta(key, {
|
|
837
845
|
...state.tr.getMeta(key),
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { isEmptyParagraph } from '@atlaskit/editor-common/utils';
|
|
2
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
3
2
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
4
3
|
import { isWrappedMedia } from './check-media-layout';
|
|
5
4
|
import { maxLayoutColumnSupported } from './consts';
|
|
@@ -12,7 +11,7 @@ isSameLayout = false, activeNode, parentNode) => {
|
|
|
12
11
|
const isInsideBodiedSyncBlock = (parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) === 'bodiedSyncBlock';
|
|
13
12
|
if (editorExperiment('advanced_layouts', false) || isNested) {
|
|
14
13
|
// If nested inside bodiedSyncBlock, enable inline drop target so user can drop to create a layout inside it
|
|
15
|
-
if (isInsideBodiedSyncBlock &&
|
|
14
|
+
if (isInsideBodiedSyncBlock && editorExperiment('platform_synced_block', true) && editorExperiment('platform_synced_block_patch_6', true)) {
|
|
16
15
|
return true;
|
|
17
16
|
}
|
|
18
17
|
return false;
|
|
@@ -23,7 +22,7 @@ isSameLayout = false, activeNode, parentNode) => {
|
|
|
23
22
|
if ((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) === 'layoutSection') {
|
|
24
23
|
return false;
|
|
25
24
|
}
|
|
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)
|
|
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)) {
|
|
27
26
|
return false;
|
|
28
27
|
}
|
|
29
28
|
if ((node === null || node === void 0 ? void 0 : node.type.name) === 'layoutSection') {
|
|
@@ -1112,7 +1112,7 @@ export const DragHandle = ({
|
|
|
1112
1112
|
onDrop: handleOnDrop,
|
|
1113
1113
|
disabled: dragHandleDisabled,
|
|
1114
1114
|
"data-editor-block-ctrl-drag-handle": true,
|
|
1115
|
-
"data-blocks-drag-handle":
|
|
1115
|
+
"data-blocks-drag-handle": expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true) || undefined,
|
|
1116
1116
|
"data-testid": "block-ctrl-drag-handle",
|
|
1117
1117
|
"aria-label": dragHandleAriaLabel,
|
|
1118
1118
|
onBlur: expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? () => setIsFocused(false) : undefined
|
|
@@ -7,6 +7,7 @@ import uuid from 'uuid';
|
|
|
7
7
|
import { Decoration } from '@atlaskit/editor-prosemirror/view';
|
|
8
8
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
9
9
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
10
|
+
import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
|
|
10
11
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
11
12
|
import { DragHandle, DragHandleWithVisibility } from '../ui/drag-handle';
|
|
12
13
|
import { TYPE_HANDLE_DEC, TYPE_NODE_DEC, unmountDecorations } from './decorations-common';
|
|
@@ -77,7 +78,7 @@ export var dragHandleDecoration = function dragHandleDecoration(_ref) {
|
|
|
77
78
|
var element = document.createElement('span');
|
|
78
79
|
// inline decoration causes focus issues when refocusing Editor into first line
|
|
79
80
|
element.style.display = 'block';
|
|
80
|
-
if (
|
|
81
|
+
if (expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true)) {
|
|
81
82
|
element.setAttribute('data-blocks-decorator-widget', 'true');
|
|
82
83
|
}
|
|
83
84
|
element.setAttribute('data-testid', 'block-ctrl-decorator-widget');
|
|
@@ -4,6 +4,7 @@ import uuid from 'uuid';
|
|
|
4
4
|
import { Decoration } from '@atlaskit/editor-prosemirror/view';
|
|
5
5
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
6
6
|
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
7
|
+
import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
|
|
7
8
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
8
9
|
import { QuickInsertWithVisibility } from '../ui/quick-insert-button';
|
|
9
10
|
import { getActiveBlockMarks } from './utils/marks';
|
|
@@ -68,7 +69,7 @@ export var quickInsertButtonDecoration = function quickInsertButtonDecoration(_r
|
|
|
68
69
|
}
|
|
69
70
|
element.contentEditable = 'false';
|
|
70
71
|
element.setAttribute('data-blocks-quick-insert-container', 'true');
|
|
71
|
-
if (
|
|
72
|
+
if (expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true)) {
|
|
72
73
|
element.setAttribute('data-blocks-quick-insert-button', 'true');
|
|
73
74
|
}
|
|
74
75
|
element.setAttribute('data-testid', 'block-ctrl-quick-insert-button');
|
|
@@ -56,7 +56,7 @@ export var handleMouseOver = function handleMouseOver(view, event, api) {
|
|
|
56
56
|
// We shouldn't be firing mouse over transactions when the editor is disabled,
|
|
57
57
|
// except in view mode when right-side controls are enabled (show controls on block hover)
|
|
58
58
|
var rightSideControlsEnabled = (_api$blockControls$sh = api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || (_api$blockControls2 = _api$blockControls2.sharedState.currentState()) === null || _api$blockControls2 === void 0 ? void 0 : _api$blockControls2.rightSideControlsEnabled) !== null && _api$blockControls$sh !== void 0 ? _api$blockControls$sh : false;
|
|
59
|
-
if (editorDisabled && (!isViewMode || !(rightSideControlsEnabled &&
|
|
59
|
+
if (editorDisabled && (!isViewMode || !(rightSideControlsEnabled && expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true)))) {
|
|
60
60
|
return false;
|
|
61
61
|
}
|
|
62
62
|
|
|
@@ -82,7 +82,7 @@ export var handleMouseOver = function handleMouseOver(view, event, api) {
|
|
|
82
82
|
|
|
83
83
|
// When hovering over the right-edge button (rendered in a portal outside the block), resolve the
|
|
84
84
|
// block from the container's anchor so activeNode stays set and the button remains visible.
|
|
85
|
-
if (!rootElement && rightSideControlsEnabled &&
|
|
85
|
+
if (!rootElement && rightSideControlsEnabled && expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true)) {
|
|
86
86
|
var rightEdgeContainer = target === null || target === void 0 ? void 0 : target.closest('[data-blocks-right-edge-button-container]');
|
|
87
87
|
if (rightEdgeContainer) {
|
|
88
88
|
var anchor = rightEdgeContainer.getAttribute('data-blocks-right-edge-button-anchor');
|
|
@@ -461,7 +461,7 @@ var _apply = function apply(api, formatMessage, tr, currentState, newState, flag
|
|
|
461
461
|
_iterator.f();
|
|
462
462
|
}
|
|
463
463
|
}
|
|
464
|
-
if (rightSideControlsEnabled && isViewMode &&
|
|
464
|
+
if (rightSideControlsEnabled && isViewMode && expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true)) {
|
|
465
465
|
var _iterator2 = _createForOfIteratorHelper(nodeDecorationRegistry),
|
|
466
466
|
_step2;
|
|
467
467
|
try {
|
|
@@ -643,7 +643,7 @@ var _apply = function apply(api, formatMessage, tr, currentState, newState, flag
|
|
|
643
643
|
} finally {
|
|
644
644
|
_iterator5.f();
|
|
645
645
|
}
|
|
646
|
-
} else if (isViewMode && rightSideControlsEnabled &&
|
|
646
|
+
} else if (isViewMode && rightSideControlsEnabled && expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true)) {
|
|
647
647
|
// Remove view-mode right-side decorations when no active node
|
|
648
648
|
var _iterator6 = _createForOfIteratorHelper(nodeDecorationRegistry),
|
|
649
649
|
_step6;
|
|
@@ -805,8 +805,9 @@ export var createPlugin = function createPlugin(api, getIntl, nodeViewPortalProv
|
|
|
805
805
|
var isDisabled = api === null || api === void 0 || (_api$editorDisabled = api.editorDisabled) === null || _api$editorDisabled === void 0 || (_api$editorDisabled = _api$editorDisabled.sharedState.currentState()) === null || _api$editorDisabled === void 0 ? void 0 : _api$editorDisabled.editorDisabled;
|
|
806
806
|
if (isDisabled) {
|
|
807
807
|
var _api$editorViewMode2;
|
|
808
|
+
var remixRightSideEnabled = rightSideControlsEnabled && expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true);
|
|
808
809
|
// Hide decorations when disabled, except in view mode when right-side controls are enabled
|
|
809
|
-
if (!
|
|
810
|
+
if (!remixRightSideEnabled || (api === null || api === void 0 || (_api$editorViewMode2 = api.editorViewMode) === null || _api$editorViewMode2 === void 0 || (_api$editorViewMode2 = _api$editorViewMode2.sharedState.currentState()) === null || _api$editorViewMode2 === void 0 ? void 0 : _api$editorViewMode2.mode) !== 'view') {
|
|
810
811
|
return;
|
|
811
812
|
}
|
|
812
813
|
}
|
|
@@ -862,10 +863,17 @@ export var createPlugin = function createPlugin(api, getIntl, nodeViewPortalProv
|
|
|
862
863
|
return false;
|
|
863
864
|
},
|
|
864
865
|
dragenter: function dragenter(view, event) {
|
|
865
|
-
var _api$limitedMode3;
|
|
866
|
+
var _api$limitedMode3, _key$getState3;
|
|
866
867
|
if (api !== null && api !== void 0 && (_api$limitedMode3 = api.limitedMode) !== null && _api$limitedMode3 !== void 0 && (_api$limitedMode3 = _api$limitedMode3.sharedState.currentState()) !== null && _api$limitedMode3 !== void 0 && _api$limitedMode3.enabled) {
|
|
867
868
|
return;
|
|
868
869
|
}
|
|
870
|
+
|
|
871
|
+
// Only process dragenter for block control drags.
|
|
872
|
+
// Other drag types (e.g. table row) should not create
|
|
873
|
+
// drop target decorations or emit active anchors.
|
|
874
|
+
if (!((_key$getState3 = key.getState(view.state)) !== null && _key$getState3 !== void 0 && _key$getState3.isDragging) && expValEquals('platform_editor_fix_table_row_drag_drop_target', 'isEnabled', true)) {
|
|
875
|
+
return;
|
|
876
|
+
}
|
|
869
877
|
if (isHTMLElement(event.target) && expValEquals('platform_editor_block_controls_perf_optimization', 'isEnabled', true)) {
|
|
870
878
|
var targetElement = event.target.closest('[data-prosemirror-node-name]');
|
|
871
879
|
if (targetElement) {
|
|
@@ -914,13 +922,13 @@ export var createPlugin = function createPlugin(api, getIntl, nodeViewPortalProv
|
|
|
914
922
|
})));
|
|
915
923
|
},
|
|
916
924
|
dragend: function dragend(view) {
|
|
917
|
-
var _api$limitedMode5, _key$
|
|
925
|
+
var _api$limitedMode5, _key$getState4;
|
|
918
926
|
if (api !== null && api !== void 0 && (_api$limitedMode5 = api.limitedMode) !== null && _api$limitedMode5 !== void 0 && (_api$limitedMode5 = _api$limitedMode5.sharedState.currentState()) !== null && _api$limitedMode5 !== void 0 && _api$limitedMode5.enabled) {
|
|
919
927
|
return;
|
|
920
928
|
}
|
|
921
929
|
var state = view.state,
|
|
922
930
|
dispatch = view.dispatch;
|
|
923
|
-
if ((_key$
|
|
931
|
+
if ((_key$getState4 = key.getState(state)) !== null && _key$getState4 !== void 0 && _key$getState4.isPMDragging) {
|
|
924
932
|
var tr = state.tr;
|
|
925
933
|
tr.setMeta(key, _objectSpread(_objectSpread({}, state.tr.getMeta(key)), {}, {
|
|
926
934
|
isPMDragging: false
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { isEmptyParagraph } from '@atlaskit/editor-common/utils';
|
|
2
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
3
2
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
4
3
|
import { isWrappedMedia } from './check-media-layout';
|
|
5
4
|
import { maxLayoutColumnSupported } from './consts';
|
|
@@ -11,7 +10,7 @@ export var shouldAllowInlineDropTarget = function shouldAllowInlineDropTarget(is
|
|
|
11
10
|
var isInsideBodiedSyncBlock = (parentNode === null || parentNode === void 0 ? void 0 : parentNode.type.name) === 'bodiedSyncBlock';
|
|
12
11
|
if (editorExperiment('advanced_layouts', false) || isNested) {
|
|
13
12
|
// If nested inside bodiedSyncBlock, enable inline drop target so user can drop to create a layout inside it
|
|
14
|
-
if (isInsideBodiedSyncBlock &&
|
|
13
|
+
if (isInsideBodiedSyncBlock && editorExperiment('platform_synced_block', true) && editorExperiment('platform_synced_block_patch_6', true)) {
|
|
15
14
|
return true;
|
|
16
15
|
}
|
|
17
16
|
return false;
|
|
@@ -22,7 +21,7 @@ export var shouldAllowInlineDropTarget = function shouldAllowInlineDropTarget(is
|
|
|
22
21
|
if ((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) === 'layoutSection') {
|
|
23
22
|
return false;
|
|
24
23
|
}
|
|
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)
|
|
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) || '')) && editorExperiment('platform_synced_block', true)) {
|
|
26
25
|
return false;
|
|
27
26
|
}
|
|
28
27
|
if ((node === null || node === void 0 ? void 0 : node.type.name) === 'layoutSection') {
|
|
@@ -1121,7 +1121,7 @@ export var DragHandle = function DragHandle(_ref3) {
|
|
|
1121
1121
|
onDrop: handleOnDrop,
|
|
1122
1122
|
disabled: dragHandleDisabled,
|
|
1123
1123
|
"data-editor-block-ctrl-drag-handle": true,
|
|
1124
|
-
"data-blocks-drag-handle":
|
|
1124
|
+
"data-blocks-drag-handle": expValEqualsNoExposure('confluence_remix_icon_right_side', 'isEnabled', true) || undefined,
|
|
1125
1125
|
"data-testid": "block-ctrl-drag-handle",
|
|
1126
1126
|
"aria-label": dragHandleAriaLabel,
|
|
1127
1127
|
onBlur: expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? function () {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-block-controls",
|
|
3
|
-
"version": "9.0.
|
|
3
|
+
"version": "9.0.10",
|
|
4
4
|
"description": "Block controls plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.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": "^40.
|
|
59
|
+
"@atlaskit/tmp-editor-statsig": "^40.5.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": "^112.
|
|
70
|
+
"@atlaskit/editor-common": "^112.5.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"
|