@atlaskit/editor-plugin-block-controls 7.10.0 → 7.10.2
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 +16 -0
- package/dist/cjs/blockControlsPlugin.js +1 -1
- package/dist/cjs/editor-commands/move-node.js +1 -2
- package/dist/cjs/pm-plugins/decorations-drop-target-active.js +2 -2
- package/dist/cjs/pm-plugins/main.js +4 -4
- package/dist/cjs/pm-plugins/utils/inline-drop-target.js +1 -2
- package/dist/cjs/ui/drag-handle.js +9 -9
- package/dist/es2019/blockControlsPlugin.js +1 -1
- package/dist/es2019/editor-commands/move-node.js +1 -2
- package/dist/es2019/pm-plugins/decorations-drop-target-active.js +2 -2
- package/dist/es2019/pm-plugins/main.js +4 -4
- package/dist/es2019/pm-plugins/utils/inline-drop-target.js +1 -2
- package/dist/es2019/ui/drag-handle.js +9 -9
- package/dist/esm/blockControlsPlugin.js +1 -1
- package/dist/esm/editor-commands/move-node.js +1 -2
- package/dist/esm/pm-plugins/decorations-drop-target-active.js +2 -2
- package/dist/esm/pm-plugins/main.js +4 -4
- package/dist/esm/pm-plugins/utils/inline-drop-target.js +1 -2
- package/dist/esm/ui/drag-handle.js +9 -9
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,21 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-block-controls
|
|
2
2
|
|
|
3
|
+
## 7.10.2
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`41a91a916c125`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/41a91a916c125) -
|
|
8
|
+
EDITOR-2846 Change platform_synced_block to use editorExperiment and add Jira experiment
|
|
9
|
+
- Updated dependencies
|
|
10
|
+
|
|
11
|
+
## 7.10.1
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- [`7583860e8637f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7583860e8637f) -
|
|
16
|
+
EDITOR-3621 Clean up platform_editor_block_menu_keyboard_navigation feature gate
|
|
17
|
+
- Updated dependencies
|
|
18
|
+
|
|
3
19
|
## 7.10.0
|
|
4
20
|
|
|
5
21
|
### Minor Changes
|
|
@@ -133,7 +133,7 @@ var blockControlsPlugin = exports.blockControlsPlugin = function blockControlsPl
|
|
|
133
133
|
toggleMenuMeta = _objectSpread(_objectSpread({}, toggleMenuMeta), {}, {
|
|
134
134
|
moveUp: moveUp,
|
|
135
135
|
moveDown: moveDown,
|
|
136
|
-
openedViaKeyboard:
|
|
136
|
+
openedViaKeyboard: options === null || options === void 0 ? void 0 : options.openedViaKeyboard
|
|
137
137
|
});
|
|
138
138
|
}
|
|
139
139
|
tr.setMeta(_main.key, _objectSpread(_objectSpread({}, currMeta), {}, {
|
|
@@ -18,7 +18,6 @@ var _state = require("@atlaskit/editor-prosemirror/state");
|
|
|
18
18
|
var _utils2 = require("@atlaskit/editor-prosemirror/utils");
|
|
19
19
|
var _utils3 = require("@atlaskit/editor-tables/utils");
|
|
20
20
|
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
21
|
-
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
|
|
22
21
|
var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
|
|
23
22
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
24
23
|
var _main = require("../pm-plugins/main");
|
|
@@ -391,7 +390,7 @@ var moveNode = exports.moveNode = function moveNode(api) {
|
|
|
391
390
|
|
|
392
391
|
// Currently we don't support breakout mark for children nodes of bodiedSyncBlock node
|
|
393
392
|
// Hence strip out the mark for now
|
|
394
|
-
if (destNode.type.name === 'bodiedSyncBlock' && (0,
|
|
393
|
+
if (destNode.type.name === 'bodiedSyncBlock' && (0, _experiments.editorExperiment)('platform_synced_block', true)) {
|
|
395
394
|
var _convertedNodeSlice2;
|
|
396
395
|
var nodes = [];
|
|
397
396
|
(_convertedNodeSlice2 = convertedNodeSlice) === null || _convertedNodeSlice2 === void 0 || _convertedNodeSlice2.content.forEach(function (node) {
|
|
@@ -26,7 +26,7 @@ var PARENT_WITH_END_DROP_TARGET_SYNC_BLOCK = [].concat(PARENT_WITH_END_DROP_TARG
|
|
|
26
26
|
var NODE_WITH_NO_PARENT_POS = ['tableCell', 'tableHeader', 'layoutColumn'];
|
|
27
27
|
var UNSUPPORTED_LAYOUT_CONTENT = ['syncBlock', 'bodiedSyncBlock'];
|
|
28
28
|
var isContainerNode = function isContainerNode(node) {
|
|
29
|
-
if ((0,
|
|
29
|
+
if ((0, _experiments.editorExperiment)('platform_synced_block', true)) {
|
|
30
30
|
return PARENT_WITH_END_DROP_TARGET_SYNC_BLOCK.includes(node.type.name);
|
|
31
31
|
}
|
|
32
32
|
return PARENT_WITH_END_DROP_TARGET.includes(node.type.name);
|
|
@@ -213,7 +213,7 @@ var getActiveDropTargetDecorations = exports.getActiveDropTargetDecorations = fu
|
|
|
213
213
|
}
|
|
214
214
|
if ((0, _experiments.editorExperiment)('advanced_layouts', true)) {
|
|
215
215
|
var _isSameLayout = $activeNodePos && (0, _validation.isInSameLayout)($activeNodePos, state.doc.resolve(rootNodeWithPos.pos));
|
|
216
|
-
var hasUnsupportedContent = UNSUPPORTED_LAYOUT_CONTENT.includes((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) || '') && (0,
|
|
216
|
+
var hasUnsupportedContent = UNSUPPORTED_LAYOUT_CONTENT.includes((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) || '') && (0, _experiments.editorExperiment)('platform_synced_block', true);
|
|
217
217
|
if (rootNodeWithPos.node.type.name === 'layoutSection' && !hasUnsupportedContent) {
|
|
218
218
|
var layoutSectionNode = rootNodeWithPos.node;
|
|
219
219
|
if (layoutSectionNode.childCount < (0, _consts.maxLayoutColumnSupported)() || _isSameLayout) {
|
|
@@ -556,11 +556,11 @@ var _apply = exports.apply = function apply(api, formatMessage, tr, currentState
|
|
|
556
556
|
isDragging: (_meta$isDragging3 = meta === null || meta === void 0 ? void 0 : meta.isDragging) !== null && _meta$isDragging3 !== void 0 ? _meta$isDragging3 : isDragging,
|
|
557
557
|
isMenuOpen: isMenuOpenNew,
|
|
558
558
|
menuTriggerBy: flags.toolbarFlagsEnabled || (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) ? (meta === null || meta === void 0 || (_meta$toggleMenu = meta.toggleMenu) === null || _meta$toggleMenu === void 0 ? void 0 : _meta$toggleMenu.anchorName) || menuTriggerBy : undefined,
|
|
559
|
-
menuTriggerByNode: (0,
|
|
559
|
+
menuTriggerByNode: (0, _experiments.editorExperiment)('platform_synced_block', true) ? (meta === null || meta === void 0 || (_meta$toggleMenu2 = meta.toggleMenu) === null || _meta$toggleMenu2 === void 0 ? void 0 : _meta$toggleMenu2.triggerByNode) || menuTriggerByNode : undefined,
|
|
560
560
|
blockMenuOptions: (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) ? {
|
|
561
561
|
canMoveUp: (meta === null || meta === void 0 || (_meta$toggleMenu3 = meta.toggleMenu) === null || _meta$toggleMenu3 === void 0 ? void 0 : _meta$toggleMenu3.moveUp) !== undefined ? meta === null || meta === void 0 || (_meta$toggleMenu4 = meta.toggleMenu) === null || _meta$toggleMenu4 === void 0 ? void 0 : _meta$toggleMenu4.moveUp : blockMenuOptions === null || blockMenuOptions === void 0 ? void 0 : blockMenuOptions.canMoveUp,
|
|
562
562
|
canMoveDown: (meta === null || meta === void 0 || (_meta$toggleMenu5 = meta.toggleMenu) === null || _meta$toggleMenu5 === void 0 ? void 0 : _meta$toggleMenu5.moveDown) !== undefined ? meta === null || meta === void 0 || (_meta$toggleMenu6 = meta.toggleMenu) === null || _meta$toggleMenu6 === void 0 ? void 0 : _meta$toggleMenu6.moveDown : blockMenuOptions === null || blockMenuOptions === void 0 ? void 0 : blockMenuOptions.canMoveDown,
|
|
563
|
-
openedViaKeyboard: (
|
|
563
|
+
openedViaKeyboard: (meta === null || meta === void 0 || (_meta$toggleMenu7 = meta.toggleMenu) === null || _meta$toggleMenu7 === void 0 ? void 0 : _meta$toggleMenu7.openedViaKeyboard) !== undefined ? meta === null || meta === void 0 || (_meta$toggleMenu8 = meta.toggleMenu) === null || _meta$toggleMenu8 === void 0 ? void 0 : _meta$toggleMenu8.openedViaKeyboard : blockMenuOptions === null || blockMenuOptions === void 0 ? void 0 : blockMenuOptions.openedViaKeyboard
|
|
564
564
|
} : undefined,
|
|
565
565
|
editorHeight: (_meta$editorHeight = meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== null && _meta$editorHeight !== void 0 ? _meta$editorHeight : editorHeight,
|
|
566
566
|
editorWidthLeft: (_meta$editorWidthLeft = meta === null || meta === void 0 ? void 0 : meta.editorWidthLeft) !== null && _meta$editorWidthLeft !== void 0 ? _meta$editorWidthLeft : editorWidthLeft,
|
|
@@ -772,7 +772,7 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
|
|
|
772
772
|
}
|
|
773
773
|
if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
|
|
774
774
|
var _api$blockControls$sh2, _api$blockControls$sh3;
|
|
775
|
-
var isBlockMenuOpen = (api === null || api === void 0 || (_api$blockControls$sh2 = api.blockControls.sharedState.currentState()) === null || _api$blockControls$sh2 === void 0 ? void 0 : _api$blockControls$sh2.isMenuOpen) && (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true)
|
|
775
|
+
var isBlockMenuOpen = (api === null || api === void 0 || (_api$blockControls$sh2 = api.blockControls.sharedState.currentState()) === null || _api$blockControls$sh2 === void 0 ? void 0 : _api$blockControls$sh2.isMenuOpen) && (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true);
|
|
776
776
|
// when block menu is just open, and we press arrow keys, we want to use the arrow keys to navigate the block menu
|
|
777
777
|
// in this scenario, isSelectedViaDragHandle should not be set to false
|
|
778
778
|
if (api !== null && api !== void 0 && (_api$blockControls$sh3 = api.blockControls.sharedState.currentState()) !== null && _api$blockControls$sh3 !== void 0 && _api$blockControls$sh3.isSelectedViaDragHandle && !isBlockMenuOpen) {
|
|
@@ -799,7 +799,7 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
|
|
|
799
799
|
}
|
|
800
800
|
if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
|
|
801
801
|
var _api$blockControls$sh4, _api$blockControls$sh5;
|
|
802
|
-
var _isBlockMenuOpen = (api === null || api === void 0 || (_api$blockControls$sh4 = api.blockControls.sharedState.currentState()) === null || _api$blockControls$sh4 === void 0 ? void 0 : _api$blockControls$sh4.isMenuOpen) && (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true)
|
|
802
|
+
var _isBlockMenuOpen = (api === null || api === void 0 || (_api$blockControls$sh4 = api.blockControls.sharedState.currentState()) === null || _api$blockControls$sh4 === void 0 ? void 0 : _api$blockControls$sh4.isMenuOpen) && (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true);
|
|
803
803
|
// when block menu is just open, and we press arrow keys, we want to use the arrow keys to navigate the block menu
|
|
804
804
|
// in this scenario, isSelectedViaDragHandle should not be set to false
|
|
805
805
|
if (api !== null && api !== void 0 && (_api$blockControls$sh5 = api.blockControls.sharedState.currentState()) !== null && _api$blockControls$sh5 !== void 0 && _api$blockControls$sh5.isSelectedViaDragHandle && !_isBlockMenuOpen) {
|
|
@@ -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");
|
|
@@ -22,7 +21,7 @@ var shouldAllowInlineDropTarget = exports.shouldAllowInlineDropTarget = function
|
|
|
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) || '')) && (0,
|
|
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)) {
|
|
26
25
|
return false;
|
|
27
26
|
}
|
|
28
27
|
if ((node === null || node === void 0 ? void 0 : node.type.name) === 'layoutSection') {
|
|
@@ -448,7 +448,7 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref2) {
|
|
|
448
448
|
api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || _api$blockControls2.commands.toggleBlockMenu({
|
|
449
449
|
anchorName: anchorName,
|
|
450
450
|
openedViaKeyboard: false,
|
|
451
|
-
triggerByNode: (0,
|
|
451
|
+
triggerByNode: (0, _experiments.editorExperiment)('platform_synced_block', true) ? {
|
|
452
452
|
nodeType: nodeType,
|
|
453
453
|
pos: startPos,
|
|
454
454
|
rootPos: tr.doc.resolve(startPos).before(1)
|
|
@@ -490,7 +490,7 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref2) {
|
|
|
490
490
|
} else {
|
|
491
491
|
tr = (0, _getSelection.selectNode)(tr, startPos, nodeType, api);
|
|
492
492
|
}
|
|
493
|
-
var rootPos = (0,
|
|
493
|
+
var rootPos = (0, _experiments.editorExperiment)('platform_synced_block', true) ? tr.doc.resolve(startPos).before(1) : undefined;
|
|
494
494
|
var triggerByNode = (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_synced_block', 'isEnabled', true) ? {
|
|
495
495
|
nodeType: nodeType,
|
|
496
496
|
pos: startPos,
|
|
@@ -501,7 +501,7 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref2) {
|
|
|
501
501
|
api === null || api === void 0 || (_api$blockControls3 = api.blockControls) === null || _api$blockControls3 === void 0 || _api$blockControls3.commands.toggleBlockMenu({
|
|
502
502
|
anchorName: anchorName,
|
|
503
503
|
triggerByNode: triggerByNode,
|
|
504
|
-
openedViaKeyboard:
|
|
504
|
+
openedViaKeyboard: false
|
|
505
505
|
})({
|
|
506
506
|
tr: tr
|
|
507
507
|
});
|
|
@@ -511,7 +511,7 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref2) {
|
|
|
511
511
|
api === null || api === void 0 || (_api$blockControls4 = api.blockControls) === null || _api$blockControls4 === void 0 || _api$blockControls4.commands.toggleBlockMenu({
|
|
512
512
|
anchorName: anchorName,
|
|
513
513
|
triggerByNode: triggerByNode,
|
|
514
|
-
openedViaKeyboard:
|
|
514
|
+
openedViaKeyboard: false
|
|
515
515
|
})({
|
|
516
516
|
tr: tr
|
|
517
517
|
});
|
|
@@ -593,7 +593,7 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref2) {
|
|
|
593
593
|
!isMultiSelect && tr.setMeta(_main.key, {
|
|
594
594
|
pos: startPos
|
|
595
595
|
});
|
|
596
|
-
var rootPos = (0,
|
|
596
|
+
var rootPos = (0, _experiments.editorExperiment)('platform_synced_block', true) ? tr.doc.resolve(startPos).before(1) : undefined;
|
|
597
597
|
var triggerByNode = (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_synced_block', 'isEnabled', true) ? {
|
|
598
598
|
nodeType: nodeType,
|
|
599
599
|
pos: startPos,
|
|
@@ -744,7 +744,7 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref2) {
|
|
|
744
744
|
} else {
|
|
745
745
|
var domAtPos = view.domAtPos.bind(view);
|
|
746
746
|
var previewContent = [];
|
|
747
|
-
expandedSlice.content.descendants(function (node, pos
|
|
747
|
+
expandedSlice.content.descendants(function (node, pos) {
|
|
748
748
|
// Get the dom element of the node
|
|
749
749
|
//eslint-disable-next-line @atlaskit/editor/no-as-casting
|
|
750
750
|
var nodeDomElement = (0, _utils.findDomRefAtPos)(sliceFrom + pos, domAtPos);
|
|
@@ -1075,13 +1075,13 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref2) {
|
|
|
1075
1075
|
css: [(0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? dragHandleButtonStyles : dragHandleButtonStylesOld, (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && dragHandleColor,
|
|
1076
1076
|
// ED-26266: Fixed the drag handle highlight when selecting multiple line in Firefox
|
|
1077
1077
|
// See https://product-fabric.atlassian.net/browse/ED-26266
|
|
1078
|
-
browser.gecko && dragHandleMultiLineSelectionFixFirefox, (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn && layoutColumnDragHandleStyles, dragHandleSelected && hasHadInteraction && selectedStyles, (0, _experiments.editorExperiment)('platform_editor_preview_panel_responsiveness', true) && (0, _experiments.editorExperiment)('platform_editor_controls', 'control') && dragHandleButtonSmallScreenStyles, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) &&
|
|
1078
|
+
browser.gecko && dragHandleMultiLineSelectionFixFirefox, (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn && layoutColumnDragHandleStyles, dragHandleSelected && hasHadInteraction && selectedStyles, (0, _experiments.editorExperiment)('platform_editor_preview_panel_responsiveness', true) && (0, _experiments.editorExperiment)('platform_editor_controls', 'control') && dragHandleButtonSmallScreenStyles, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) && isFocused && keyboardFocusedDragHandleStyles, (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) ? focusedStyles : focusedStylesOld, (0, _expValEquals.expValEquals)('cc_editor_ai_content_mode', 'variant', 'test') && (0, _platformFeatureFlags.fg)('platform_editor_content_mode_button_mvp') && dragHandleButtonDenseModeStyles],
|
|
1079
1079
|
ref: buttonRef
|
|
1080
1080
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
1081
1081
|
,
|
|
1082
1082
|
style: !(0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? (0, _experiments.editorExperiment)('platform_editor_block_control_optimise_render', true) ? positionStyles : positionStylesOld : {},
|
|
1083
1083
|
onClick: (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) ? handleOnClickNew : handleOnClick,
|
|
1084
|
-
onKeyDown: (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true)
|
|
1084
|
+
onKeyDown: (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) ? handleKeyDownNew : handleKeyDown
|
|
1085
1085
|
// eslint-disable-next-line @atlaskit/design-system/no-direct-use-of-web-platform-drag-and-drop
|
|
1086
1086
|
,
|
|
1087
1087
|
onDrop: handleOnDrop,
|
|
@@ -1089,7 +1089,7 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref2) {
|
|
|
1089
1089
|
"data-editor-block-ctrl-drag-handle": true,
|
|
1090
1090
|
"data-testid": "block-ctrl-drag-handle",
|
|
1091
1091
|
"aria-label": (0, _expValEquals.expValEquals)('platform_editor_drag_handle_aria_label', 'isEnabled', true) ? dragHandleAriaLabel : '',
|
|
1092
|
-
onBlur: (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true)
|
|
1092
|
+
onBlur: (0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) ? function () {
|
|
1093
1093
|
return setIsFocused(false);
|
|
1094
1094
|
} : undefined
|
|
1095
1095
|
}, (0, _react2.jsx)(_primitives.Box, {
|
|
@@ -126,7 +126,7 @@ export const blockControlsPlugin = ({
|
|
|
126
126
|
...toggleMenuMeta,
|
|
127
127
|
moveUp,
|
|
128
128
|
moveDown,
|
|
129
|
-
openedViaKeyboard:
|
|
129
|
+
openedViaKeyboard: options === null || options === void 0 ? void 0 : options.openedViaKeyboard
|
|
130
130
|
};
|
|
131
131
|
}
|
|
132
132
|
tr.setMeta(key, {
|
|
@@ -10,7 +10,6 @@ import { Selection, NodeSelection } from '@atlaskit/editor-prosemirror/state';
|
|
|
10
10
|
import { findChildrenByType, findParentNodeOfType, findParentNodeOfTypeClosestToPos } from '@atlaskit/editor-prosemirror/utils';
|
|
11
11
|
import { findTable, isInTable, isTableSelected } from '@atlaskit/editor-tables/utils';
|
|
12
12
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
13
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
14
13
|
import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
|
|
15
14
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
16
15
|
import { key } from '../pm-plugins/main';
|
|
@@ -393,7 +392,7 @@ export const moveNode = api => (start, to, inputMethod = INPUT_METHOD.DRAG_AND_D
|
|
|
393
392
|
|
|
394
393
|
// Currently we don't support breakout mark for children nodes of bodiedSyncBlock node
|
|
395
394
|
// Hence strip out the mark for now
|
|
396
|
-
if (destNode.type.name === 'bodiedSyncBlock' &&
|
|
395
|
+
if (destNode.type.name === 'bodiedSyncBlock' && editorExperiment('platform_synced_block', true)) {
|
|
397
396
|
var _convertedNodeSlice2;
|
|
398
397
|
const nodes = [];
|
|
399
398
|
(_convertedNodeSlice2 = convertedNodeSlice) === null || _convertedNodeSlice2 === void 0 ? void 0 : _convertedNodeSlice2.content.forEach(node => {
|
|
@@ -21,7 +21,7 @@ const PARENT_WITH_END_DROP_TARGET_SYNC_BLOCK = [...PARENT_WITH_END_DROP_TARGET,
|
|
|
21
21
|
const NODE_WITH_NO_PARENT_POS = ['tableCell', 'tableHeader', 'layoutColumn'];
|
|
22
22
|
const UNSUPPORTED_LAYOUT_CONTENT = ['syncBlock', 'bodiedSyncBlock'];
|
|
23
23
|
const isContainerNode = node => {
|
|
24
|
-
if (
|
|
24
|
+
if (editorExperiment('platform_synced_block', true)) {
|
|
25
25
|
return PARENT_WITH_END_DROP_TARGET_SYNC_BLOCK.includes(node.type.name);
|
|
26
26
|
}
|
|
27
27
|
return PARENT_WITH_END_DROP_TARGET.includes(node.type.name);
|
|
@@ -196,7 +196,7 @@ export const getActiveDropTargetDecorations = (activeDropTargetNode, state, api,
|
|
|
196
196
|
}
|
|
197
197
|
if (editorExperiment('advanced_layouts', true)) {
|
|
198
198
|
const isSameLayout = $activeNodePos && isInSameLayout($activeNodePos, state.doc.resolve(rootNodeWithPos.pos));
|
|
199
|
-
const hasUnsupportedContent = UNSUPPORTED_LAYOUT_CONTENT.includes((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) || '') &&
|
|
199
|
+
const hasUnsupportedContent = UNSUPPORTED_LAYOUT_CONTENT.includes((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) || '') && editorExperiment('platform_synced_block', true);
|
|
200
200
|
if (rootNodeWithPos.node.type.name === 'layoutSection' && !hasUnsupportedContent) {
|
|
201
201
|
const layoutSectionNode = rootNodeWithPos.node;
|
|
202
202
|
if (layoutSectionNode.childCount < maxLayoutColumnSupported() || isSameLayout) {
|
|
@@ -554,11 +554,11 @@ export const apply = (api, formatMessage, tr, currentState, newState, flags, nod
|
|
|
554
554
|
isDragging: (_meta$isDragging3 = meta === null || meta === void 0 ? void 0 : meta.isDragging) !== null && _meta$isDragging3 !== void 0 ? _meta$isDragging3 : isDragging,
|
|
555
555
|
isMenuOpen: isMenuOpenNew,
|
|
556
556
|
menuTriggerBy: flags.toolbarFlagsEnabled || expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? (meta === null || meta === void 0 ? void 0 : (_meta$toggleMenu = meta.toggleMenu) === null || _meta$toggleMenu === void 0 ? void 0 : _meta$toggleMenu.anchorName) || menuTriggerBy : undefined,
|
|
557
|
-
menuTriggerByNode:
|
|
557
|
+
menuTriggerByNode: editorExperiment('platform_synced_block', true) ? (meta === null || meta === void 0 ? void 0 : (_meta$toggleMenu2 = meta.toggleMenu) === null || _meta$toggleMenu2 === void 0 ? void 0 : _meta$toggleMenu2.triggerByNode) || menuTriggerByNode : undefined,
|
|
558
558
|
blockMenuOptions: expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? {
|
|
559
559
|
canMoveUp: (meta === null || meta === void 0 ? void 0 : (_meta$toggleMenu3 = meta.toggleMenu) === null || _meta$toggleMenu3 === void 0 ? void 0 : _meta$toggleMenu3.moveUp) !== undefined ? meta === null || meta === void 0 ? void 0 : (_meta$toggleMenu4 = meta.toggleMenu) === null || _meta$toggleMenu4 === void 0 ? void 0 : _meta$toggleMenu4.moveUp : blockMenuOptions === null || blockMenuOptions === void 0 ? void 0 : blockMenuOptions.canMoveUp,
|
|
560
560
|
canMoveDown: (meta === null || meta === void 0 ? void 0 : (_meta$toggleMenu5 = meta.toggleMenu) === null || _meta$toggleMenu5 === void 0 ? void 0 : _meta$toggleMenu5.moveDown) !== undefined ? meta === null || meta === void 0 ? void 0 : (_meta$toggleMenu6 = meta.toggleMenu) === null || _meta$toggleMenu6 === void 0 ? void 0 : _meta$toggleMenu6.moveDown : blockMenuOptions === null || blockMenuOptions === void 0 ? void 0 : blockMenuOptions.canMoveDown,
|
|
561
|
-
openedViaKeyboard:
|
|
561
|
+
openedViaKeyboard: (meta === null || meta === void 0 ? void 0 : (_meta$toggleMenu7 = meta.toggleMenu) === null || _meta$toggleMenu7 === void 0 ? void 0 : _meta$toggleMenu7.openedViaKeyboard) !== undefined ? meta === null || meta === void 0 ? void 0 : (_meta$toggleMenu8 = meta.toggleMenu) === null || _meta$toggleMenu8 === void 0 ? void 0 : _meta$toggleMenu8.openedViaKeyboard : blockMenuOptions === null || blockMenuOptions === void 0 ? void 0 : blockMenuOptions.openedViaKeyboard
|
|
562
562
|
} : undefined,
|
|
563
563
|
editorHeight: (_meta$editorHeight = meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== null && _meta$editorHeight !== void 0 ? _meta$editorHeight : editorHeight,
|
|
564
564
|
editorWidthLeft: (_meta$editorWidthLeft = meta === null || meta === void 0 ? void 0 : meta.editorWidthLeft) !== null && _meta$editorWidthLeft !== void 0 ? _meta$editorWidthLeft : editorWidthLeft,
|
|
@@ -776,7 +776,7 @@ export const createPlugin = (api, getIntl, nodeViewPortalProviderAPI) => {
|
|
|
776
776
|
}
|
|
777
777
|
if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && editorExperiment('platform_editor_controls', 'variant1')) {
|
|
778
778
|
var _api$blockControls$sh2, _api$blockControls$sh3;
|
|
779
|
-
const isBlockMenuOpen = (api === null || api === void 0 ? void 0 : (_api$blockControls$sh2 = api.blockControls.sharedState.currentState()) === null || _api$blockControls$sh2 === void 0 ? void 0 : _api$blockControls$sh2.isMenuOpen) && expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)
|
|
779
|
+
const isBlockMenuOpen = (api === null || api === void 0 ? void 0 : (_api$blockControls$sh2 = api.blockControls.sharedState.currentState()) === null || _api$blockControls$sh2 === void 0 ? void 0 : _api$blockControls$sh2.isMenuOpen) && expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true);
|
|
780
780
|
// when block menu is just open, and we press arrow keys, we want to use the arrow keys to navigate the block menu
|
|
781
781
|
// in this scenario, isSelectedViaDragHandle should not be set to false
|
|
782
782
|
if (api !== null && api !== void 0 && (_api$blockControls$sh3 = api.blockControls.sharedState.currentState()) !== null && _api$blockControls$sh3 !== void 0 && _api$blockControls$sh3.isSelectedViaDragHandle && !isBlockMenuOpen) {
|
|
@@ -804,7 +804,7 @@ export const createPlugin = (api, getIntl, nodeViewPortalProviderAPI) => {
|
|
|
804
804
|
}
|
|
805
805
|
if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && editorExperiment('platform_editor_controls', 'variant1')) {
|
|
806
806
|
var _api$blockControls$sh4, _api$blockControls$sh5;
|
|
807
|
-
const isBlockMenuOpen = (api === null || api === void 0 ? void 0 : (_api$blockControls$sh4 = api.blockControls.sharedState.currentState()) === null || _api$blockControls$sh4 === void 0 ? void 0 : _api$blockControls$sh4.isMenuOpen) && expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)
|
|
807
|
+
const isBlockMenuOpen = (api === null || api === void 0 ? void 0 : (_api$blockControls$sh4 = api.blockControls.sharedState.currentState()) === null || _api$blockControls$sh4 === void 0 ? void 0 : _api$blockControls$sh4.isMenuOpen) && expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true);
|
|
808
808
|
// when block menu is just open, and we press arrow keys, we want to use the arrow keys to navigate the block menu
|
|
809
809
|
// in this scenario, isSelectedViaDragHandle should not be set to false
|
|
810
810
|
if (api !== null && api !== void 0 && (_api$blockControls$sh5 = api.blockControls.sharedState.currentState()) !== null && _api$blockControls$sh5 !== void 0 && _api$blockControls$sh5.isSelectedViaDragHandle && !isBlockMenuOpen) {
|
|
@@ -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';
|
|
@@ -18,7 +17,7 @@ isSameLayout = false, activeNode) => {
|
|
|
18
17
|
if ((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) === 'layoutSection') {
|
|
19
18
|
return false;
|
|
20
19
|
}
|
|
21
|
-
if ((syncedBlockTypes.includes((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) || '') || syncedBlockTypes.includes((node === null || node === void 0 ? void 0 : node.type.name) || '')) &&
|
|
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)) {
|
|
22
21
|
return false;
|
|
23
22
|
}
|
|
24
23
|
if ((node === null || node === void 0 ? void 0 : node.type.name) === 'layoutSection') {
|
|
@@ -426,7 +426,7 @@ export const DragHandle = ({
|
|
|
426
426
|
api === null || api === void 0 ? void 0 : (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 ? void 0 : _api$blockControls2.commands.toggleBlockMenu({
|
|
427
427
|
anchorName,
|
|
428
428
|
openedViaKeyboard: false,
|
|
429
|
-
triggerByNode:
|
|
429
|
+
triggerByNode: editorExperiment('platform_synced_block', true) ? {
|
|
430
430
|
nodeType,
|
|
431
431
|
pos: startPos,
|
|
432
432
|
rootPos: tr.doc.resolve(startPos).before(1)
|
|
@@ -469,7 +469,7 @@ export const DragHandle = ({
|
|
|
469
469
|
} else {
|
|
470
470
|
tr = selectNode(tr, startPos, nodeType, api);
|
|
471
471
|
}
|
|
472
|
-
const rootPos =
|
|
472
|
+
const rootPos = editorExperiment('platform_synced_block', true) ? tr.doc.resolve(startPos).before(1) : undefined;
|
|
473
473
|
const triggerByNode = expValEqualsNoExposure('platform_synced_block', 'isEnabled', true) ? {
|
|
474
474
|
nodeType,
|
|
475
475
|
pos: startPos,
|
|
@@ -480,7 +480,7 @@ export const DragHandle = ({
|
|
|
480
480
|
api === null || api === void 0 ? void 0 : (_api$blockControls3 = api.blockControls) === null || _api$blockControls3 === void 0 ? void 0 : _api$blockControls3.commands.toggleBlockMenu({
|
|
481
481
|
anchorName,
|
|
482
482
|
triggerByNode,
|
|
483
|
-
openedViaKeyboard:
|
|
483
|
+
openedViaKeyboard: false
|
|
484
484
|
})({
|
|
485
485
|
tr
|
|
486
486
|
});
|
|
@@ -490,7 +490,7 @@ export const DragHandle = ({
|
|
|
490
490
|
api === null || api === void 0 ? void 0 : (_api$blockControls4 = api.blockControls) === null || _api$blockControls4 === void 0 ? void 0 : _api$blockControls4.commands.toggleBlockMenu({
|
|
491
491
|
anchorName,
|
|
492
492
|
triggerByNode,
|
|
493
|
-
openedViaKeyboard:
|
|
493
|
+
openedViaKeyboard: false
|
|
494
494
|
})({
|
|
495
495
|
tr
|
|
496
496
|
});
|
|
@@ -572,7 +572,7 @@ export const DragHandle = ({
|
|
|
572
572
|
!isMultiSelect && tr.setMeta(key, {
|
|
573
573
|
pos: startPos
|
|
574
574
|
});
|
|
575
|
-
const rootPos =
|
|
575
|
+
const rootPos = editorExperiment('platform_synced_block', true) ? tr.doc.resolve(startPos).before(1) : undefined;
|
|
576
576
|
const triggerByNode = expValEqualsNoExposure('platform_synced_block', 'isEnabled', true) ? {
|
|
577
577
|
nodeType,
|
|
578
578
|
pos: startPos,
|
|
@@ -727,7 +727,7 @@ export const DragHandle = ({
|
|
|
727
727
|
} else {
|
|
728
728
|
const domAtPos = view.domAtPos.bind(view);
|
|
729
729
|
const previewContent = [];
|
|
730
|
-
expandedSlice.content.descendants((node, pos
|
|
730
|
+
expandedSlice.content.descendants((node, pos) => {
|
|
731
731
|
// Get the dom element of the node
|
|
732
732
|
//eslint-disable-next-line @atlaskit/editor/no-as-casting
|
|
733
733
|
const nodeDomElement = findDomRefAtPos(sliceFrom + pos, domAtPos);
|
|
@@ -1063,13 +1063,13 @@ export const DragHandle = ({
|
|
|
1063
1063
|
css: [editorExperiment('platform_editor_controls', 'variant1') ? dragHandleButtonStyles : dragHandleButtonStylesOld, editorExperiment('platform_editor_controls', 'variant1') && dragHandleColor,
|
|
1064
1064
|
// ED-26266: Fixed the drag handle highlight when selecting multiple line in Firefox
|
|
1065
1065
|
// See https://product-fabric.atlassian.net/browse/ED-26266
|
|
1066
|
-
browser.gecko && dragHandleMultiLineSelectionFixFirefox, editorExperiment('advanced_layouts', true) && isLayoutColumn && layoutColumnDragHandleStyles, dragHandleSelected && hasHadInteraction && selectedStyles, editorExperiment('platform_editor_preview_panel_responsiveness', true) && editorExperiment('platform_editor_controls', 'control') && dragHandleButtonSmallScreenStyles, expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) &&
|
|
1066
|
+
browser.gecko && dragHandleMultiLineSelectionFixFirefox, editorExperiment('advanced_layouts', true) && isLayoutColumn && layoutColumnDragHandleStyles, dragHandleSelected && hasHadInteraction && selectedStyles, editorExperiment('platform_editor_preview_panel_responsiveness', true) && editorExperiment('platform_editor_controls', 'control') && dragHandleButtonSmallScreenStyles, expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) && isFocused && keyboardFocusedDragHandleStyles, expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? focusedStyles : focusedStylesOld, expValEquals('cc_editor_ai_content_mode', 'variant', 'test') && fg('platform_editor_content_mode_button_mvp') && dragHandleButtonDenseModeStyles],
|
|
1067
1067
|
ref: buttonRef
|
|
1068
1068
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
1069
1069
|
,
|
|
1070
1070
|
style: !editorExperiment('platform_editor_controls', 'variant1') ? editorExperiment('platform_editor_block_control_optimise_render', true) ? positionStyles : positionStylesOld : {},
|
|
1071
1071
|
onClick: expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? handleOnClickNew : handleOnClick,
|
|
1072
|
-
onKeyDown: expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)
|
|
1072
|
+
onKeyDown: expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? handleKeyDownNew : handleKeyDown
|
|
1073
1073
|
// eslint-disable-next-line @atlaskit/design-system/no-direct-use-of-web-platform-drag-and-drop
|
|
1074
1074
|
,
|
|
1075
1075
|
onDrop: handleOnDrop,
|
|
@@ -1077,7 +1077,7 @@ export const DragHandle = ({
|
|
|
1077
1077
|
"data-editor-block-ctrl-drag-handle": true,
|
|
1078
1078
|
"data-testid": "block-ctrl-drag-handle",
|
|
1079
1079
|
"aria-label": expValEquals('platform_editor_drag_handle_aria_label', 'isEnabled', true) ? dragHandleAriaLabel : '',
|
|
1080
|
-
onBlur: expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)
|
|
1080
|
+
onBlur: expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? () => setIsFocused(false) : undefined
|
|
1081
1081
|
}, jsx(Box, {
|
|
1082
1082
|
xcss: iconWrapperStyles
|
|
1083
1083
|
// eslint-disable-next-line @atlaskit/design-system/no-direct-use-of-web-platform-drag-and-drop
|
|
@@ -126,7 +126,7 @@ export var blockControlsPlugin = function blockControlsPlugin(_ref) {
|
|
|
126
126
|
toggleMenuMeta = _objectSpread(_objectSpread({}, toggleMenuMeta), {}, {
|
|
127
127
|
moveUp: moveUp,
|
|
128
128
|
moveDown: moveDown,
|
|
129
|
-
openedViaKeyboard:
|
|
129
|
+
openedViaKeyboard: options === null || options === void 0 ? void 0 : options.openedViaKeyboard
|
|
130
130
|
});
|
|
131
131
|
}
|
|
132
132
|
tr.setMeta(key, _objectSpread(_objectSpread({}, currMeta), {}, {
|
|
@@ -13,7 +13,6 @@ import { Selection, NodeSelection } from '@atlaskit/editor-prosemirror/state';
|
|
|
13
13
|
import { findChildrenByType, findParentNodeOfType, findParentNodeOfTypeClosestToPos } from '@atlaskit/editor-prosemirror/utils';
|
|
14
14
|
import { findTable, isInTable, isTableSelected } from '@atlaskit/editor-tables/utils';
|
|
15
15
|
import { fg } from '@atlaskit/platform-feature-flags';
|
|
16
|
-
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
|
|
17
16
|
import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
|
|
18
17
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
19
18
|
import { key } from '../pm-plugins/main';
|
|
@@ -385,7 +384,7 @@ export var moveNode = function moveNode(api) {
|
|
|
385
384
|
|
|
386
385
|
// Currently we don't support breakout mark for children nodes of bodiedSyncBlock node
|
|
387
386
|
// Hence strip out the mark for now
|
|
388
|
-
if (destNode.type.name === 'bodiedSyncBlock' &&
|
|
387
|
+
if (destNode.type.name === 'bodiedSyncBlock' && editorExperiment('platform_synced_block', true)) {
|
|
389
388
|
var _convertedNodeSlice2;
|
|
390
389
|
var nodes = [];
|
|
391
390
|
(_convertedNodeSlice2 = convertedNodeSlice) === null || _convertedNodeSlice2 === void 0 || _convertedNodeSlice2.content.forEach(function (node) {
|
|
@@ -21,7 +21,7 @@ var PARENT_WITH_END_DROP_TARGET_SYNC_BLOCK = [].concat(PARENT_WITH_END_DROP_TARG
|
|
|
21
21
|
var NODE_WITH_NO_PARENT_POS = ['tableCell', 'tableHeader', 'layoutColumn'];
|
|
22
22
|
var UNSUPPORTED_LAYOUT_CONTENT = ['syncBlock', 'bodiedSyncBlock'];
|
|
23
23
|
var isContainerNode = function isContainerNode(node) {
|
|
24
|
-
if (
|
|
24
|
+
if (editorExperiment('platform_synced_block', true)) {
|
|
25
25
|
return PARENT_WITH_END_DROP_TARGET_SYNC_BLOCK.includes(node.type.name);
|
|
26
26
|
}
|
|
27
27
|
return PARENT_WITH_END_DROP_TARGET.includes(node.type.name);
|
|
@@ -208,7 +208,7 @@ export var getActiveDropTargetDecorations = function getActiveDropTargetDecorati
|
|
|
208
208
|
}
|
|
209
209
|
if (editorExperiment('advanced_layouts', true)) {
|
|
210
210
|
var _isSameLayout = $activeNodePos && isInSameLayout($activeNodePos, state.doc.resolve(rootNodeWithPos.pos));
|
|
211
|
-
var hasUnsupportedContent = UNSUPPORTED_LAYOUT_CONTENT.includes((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) || '') &&
|
|
211
|
+
var hasUnsupportedContent = UNSUPPORTED_LAYOUT_CONTENT.includes((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) || '') && editorExperiment('platform_synced_block', true);
|
|
212
212
|
if (rootNodeWithPos.node.type.name === 'layoutSection' && !hasUnsupportedContent) {
|
|
213
213
|
var layoutSectionNode = rootNodeWithPos.node;
|
|
214
214
|
if (layoutSectionNode.childCount < maxLayoutColumnSupported() || _isSameLayout) {
|
|
@@ -549,11 +549,11 @@ var _apply = function apply(api, formatMessage, tr, currentState, newState, flag
|
|
|
549
549
|
isDragging: (_meta$isDragging3 = meta === null || meta === void 0 ? void 0 : meta.isDragging) !== null && _meta$isDragging3 !== void 0 ? _meta$isDragging3 : isDragging,
|
|
550
550
|
isMenuOpen: isMenuOpenNew,
|
|
551
551
|
menuTriggerBy: flags.toolbarFlagsEnabled || expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? (meta === null || meta === void 0 || (_meta$toggleMenu = meta.toggleMenu) === null || _meta$toggleMenu === void 0 ? void 0 : _meta$toggleMenu.anchorName) || menuTriggerBy : undefined,
|
|
552
|
-
menuTriggerByNode:
|
|
552
|
+
menuTriggerByNode: editorExperiment('platform_synced_block', true) ? (meta === null || meta === void 0 || (_meta$toggleMenu2 = meta.toggleMenu) === null || _meta$toggleMenu2 === void 0 ? void 0 : _meta$toggleMenu2.triggerByNode) || menuTriggerByNode : undefined,
|
|
553
553
|
blockMenuOptions: expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? {
|
|
554
554
|
canMoveUp: (meta === null || meta === void 0 || (_meta$toggleMenu3 = meta.toggleMenu) === null || _meta$toggleMenu3 === void 0 ? void 0 : _meta$toggleMenu3.moveUp) !== undefined ? meta === null || meta === void 0 || (_meta$toggleMenu4 = meta.toggleMenu) === null || _meta$toggleMenu4 === void 0 ? void 0 : _meta$toggleMenu4.moveUp : blockMenuOptions === null || blockMenuOptions === void 0 ? void 0 : blockMenuOptions.canMoveUp,
|
|
555
555
|
canMoveDown: (meta === null || meta === void 0 || (_meta$toggleMenu5 = meta.toggleMenu) === null || _meta$toggleMenu5 === void 0 ? void 0 : _meta$toggleMenu5.moveDown) !== undefined ? meta === null || meta === void 0 || (_meta$toggleMenu6 = meta.toggleMenu) === null || _meta$toggleMenu6 === void 0 ? void 0 : _meta$toggleMenu6.moveDown : blockMenuOptions === null || blockMenuOptions === void 0 ? void 0 : blockMenuOptions.canMoveDown,
|
|
556
|
-
openedViaKeyboard:
|
|
556
|
+
openedViaKeyboard: (meta === null || meta === void 0 || (_meta$toggleMenu7 = meta.toggleMenu) === null || _meta$toggleMenu7 === void 0 ? void 0 : _meta$toggleMenu7.openedViaKeyboard) !== undefined ? meta === null || meta === void 0 || (_meta$toggleMenu8 = meta.toggleMenu) === null || _meta$toggleMenu8 === void 0 ? void 0 : _meta$toggleMenu8.openedViaKeyboard : blockMenuOptions === null || blockMenuOptions === void 0 ? void 0 : blockMenuOptions.openedViaKeyboard
|
|
557
557
|
} : undefined,
|
|
558
558
|
editorHeight: (_meta$editorHeight = meta === null || meta === void 0 ? void 0 : meta.editorHeight) !== null && _meta$editorHeight !== void 0 ? _meta$editorHeight : editorHeight,
|
|
559
559
|
editorWidthLeft: (_meta$editorWidthLeft = meta === null || meta === void 0 ? void 0 : meta.editorWidthLeft) !== null && _meta$editorWidthLeft !== void 0 ? _meta$editorWidthLeft : editorWidthLeft,
|
|
@@ -766,7 +766,7 @@ export var createPlugin = function createPlugin(api, getIntl, nodeViewPortalProv
|
|
|
766
766
|
}
|
|
767
767
|
if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && editorExperiment('platform_editor_controls', 'variant1')) {
|
|
768
768
|
var _api$blockControls$sh2, _api$blockControls$sh3;
|
|
769
|
-
var isBlockMenuOpen = (api === null || api === void 0 || (_api$blockControls$sh2 = api.blockControls.sharedState.currentState()) === null || _api$blockControls$sh2 === void 0 ? void 0 : _api$blockControls$sh2.isMenuOpen) && expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)
|
|
769
|
+
var isBlockMenuOpen = (api === null || api === void 0 || (_api$blockControls$sh2 = api.blockControls.sharedState.currentState()) === null || _api$blockControls$sh2 === void 0 ? void 0 : _api$blockControls$sh2.isMenuOpen) && expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true);
|
|
770
770
|
// when block menu is just open, and we press arrow keys, we want to use the arrow keys to navigate the block menu
|
|
771
771
|
// in this scenario, isSelectedViaDragHandle should not be set to false
|
|
772
772
|
if (api !== null && api !== void 0 && (_api$blockControls$sh3 = api.blockControls.sharedState.currentState()) !== null && _api$blockControls$sh3 !== void 0 && _api$blockControls$sh3.isSelectedViaDragHandle && !isBlockMenuOpen) {
|
|
@@ -793,7 +793,7 @@ export var createPlugin = function createPlugin(api, getIntl, nodeViewPortalProv
|
|
|
793
793
|
}
|
|
794
794
|
if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && editorExperiment('platform_editor_controls', 'variant1')) {
|
|
795
795
|
var _api$blockControls$sh4, _api$blockControls$sh5;
|
|
796
|
-
var _isBlockMenuOpen = (api === null || api === void 0 || (_api$blockControls$sh4 = api.blockControls.sharedState.currentState()) === null || _api$blockControls$sh4 === void 0 ? void 0 : _api$blockControls$sh4.isMenuOpen) && expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)
|
|
796
|
+
var _isBlockMenuOpen = (api === null || api === void 0 || (_api$blockControls$sh4 = api.blockControls.sharedState.currentState()) === null || _api$blockControls$sh4 === void 0 ? void 0 : _api$blockControls$sh4.isMenuOpen) && expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true);
|
|
797
797
|
// when block menu is just open, and we press arrow keys, we want to use the arrow keys to navigate the block menu
|
|
798
798
|
// in this scenario, isSelectedViaDragHandle should not be set to false
|
|
799
799
|
if (api !== null && api !== void 0 && (_api$blockControls$sh5 = api.blockControls.sharedState.currentState()) !== null && _api$blockControls$sh5 !== void 0 && _api$blockControls$sh5.isSelectedViaDragHandle && !_isBlockMenuOpen) {
|
|
@@ -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';
|
|
@@ -16,7 +15,7 @@ export var shouldAllowInlineDropTarget = function shouldAllowInlineDropTarget(is
|
|
|
16
15
|
if ((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) === 'layoutSection') {
|
|
17
16
|
return false;
|
|
18
17
|
}
|
|
19
|
-
if ((syncedBlockTypes.includes((activeNode === null || activeNode === void 0 ? void 0 : activeNode.nodeType) || '') || syncedBlockTypes.includes((node === null || node === void 0 ? void 0 : node.type.name) || '')) &&
|
|
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)) {
|
|
20
19
|
return false;
|
|
21
20
|
}
|
|
22
21
|
if ((node === null || node === void 0 ? void 0 : node.type.name) === 'layoutSection') {
|
|
@@ -445,7 +445,7 @@ export var DragHandle = function DragHandle(_ref2) {
|
|
|
445
445
|
api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || _api$blockControls2.commands.toggleBlockMenu({
|
|
446
446
|
anchorName: anchorName,
|
|
447
447
|
openedViaKeyboard: false,
|
|
448
|
-
triggerByNode:
|
|
448
|
+
triggerByNode: editorExperiment('platform_synced_block', true) ? {
|
|
449
449
|
nodeType: nodeType,
|
|
450
450
|
pos: startPos,
|
|
451
451
|
rootPos: tr.doc.resolve(startPos).before(1)
|
|
@@ -487,7 +487,7 @@ export var DragHandle = function DragHandle(_ref2) {
|
|
|
487
487
|
} else {
|
|
488
488
|
tr = selectNode(tr, startPos, nodeType, api);
|
|
489
489
|
}
|
|
490
|
-
var rootPos =
|
|
490
|
+
var rootPos = editorExperiment('platform_synced_block', true) ? tr.doc.resolve(startPos).before(1) : undefined;
|
|
491
491
|
var triggerByNode = expValEqualsNoExposure('platform_synced_block', 'isEnabled', true) ? {
|
|
492
492
|
nodeType: nodeType,
|
|
493
493
|
pos: startPos,
|
|
@@ -498,7 +498,7 @@ export var DragHandle = function DragHandle(_ref2) {
|
|
|
498
498
|
api === null || api === void 0 || (_api$blockControls3 = api.blockControls) === null || _api$blockControls3 === void 0 || _api$blockControls3.commands.toggleBlockMenu({
|
|
499
499
|
anchorName: anchorName,
|
|
500
500
|
triggerByNode: triggerByNode,
|
|
501
|
-
openedViaKeyboard:
|
|
501
|
+
openedViaKeyboard: false
|
|
502
502
|
})({
|
|
503
503
|
tr: tr
|
|
504
504
|
});
|
|
@@ -508,7 +508,7 @@ export var DragHandle = function DragHandle(_ref2) {
|
|
|
508
508
|
api === null || api === void 0 || (_api$blockControls4 = api.blockControls) === null || _api$blockControls4 === void 0 || _api$blockControls4.commands.toggleBlockMenu({
|
|
509
509
|
anchorName: anchorName,
|
|
510
510
|
triggerByNode: triggerByNode,
|
|
511
|
-
openedViaKeyboard:
|
|
511
|
+
openedViaKeyboard: false
|
|
512
512
|
})({
|
|
513
513
|
tr: tr
|
|
514
514
|
});
|
|
@@ -590,7 +590,7 @@ export var DragHandle = function DragHandle(_ref2) {
|
|
|
590
590
|
!isMultiSelect && tr.setMeta(key, {
|
|
591
591
|
pos: startPos
|
|
592
592
|
});
|
|
593
|
-
var rootPos =
|
|
593
|
+
var rootPos = editorExperiment('platform_synced_block', true) ? tr.doc.resolve(startPos).before(1) : undefined;
|
|
594
594
|
var triggerByNode = expValEqualsNoExposure('platform_synced_block', 'isEnabled', true) ? {
|
|
595
595
|
nodeType: nodeType,
|
|
596
596
|
pos: startPos,
|
|
@@ -741,7 +741,7 @@ export var DragHandle = function DragHandle(_ref2) {
|
|
|
741
741
|
} else {
|
|
742
742
|
var domAtPos = view.domAtPos.bind(view);
|
|
743
743
|
var previewContent = [];
|
|
744
|
-
expandedSlice.content.descendants(function (node, pos
|
|
744
|
+
expandedSlice.content.descendants(function (node, pos) {
|
|
745
745
|
// Get the dom element of the node
|
|
746
746
|
//eslint-disable-next-line @atlaskit/editor/no-as-casting
|
|
747
747
|
var nodeDomElement = findDomRefAtPos(sliceFrom + pos, domAtPos);
|
|
@@ -1072,13 +1072,13 @@ export var DragHandle = function DragHandle(_ref2) {
|
|
|
1072
1072
|
css: [editorExperiment('platform_editor_controls', 'variant1') ? dragHandleButtonStyles : dragHandleButtonStylesOld, editorExperiment('platform_editor_controls', 'variant1') && dragHandleColor,
|
|
1073
1073
|
// ED-26266: Fixed the drag handle highlight when selecting multiple line in Firefox
|
|
1074
1074
|
// See https://product-fabric.atlassian.net/browse/ED-26266
|
|
1075
|
-
browser.gecko && dragHandleMultiLineSelectionFixFirefox, editorExperiment('advanced_layouts', true) && isLayoutColumn && layoutColumnDragHandleStyles, dragHandleSelected && hasHadInteraction && selectedStyles, editorExperiment('platform_editor_preview_panel_responsiveness', true) && editorExperiment('platform_editor_controls', 'control') && dragHandleButtonSmallScreenStyles, expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) &&
|
|
1075
|
+
browser.gecko && dragHandleMultiLineSelectionFixFirefox, editorExperiment('advanced_layouts', true) && isLayoutColumn && layoutColumnDragHandleStyles, dragHandleSelected && hasHadInteraction && selectedStyles, editorExperiment('platform_editor_preview_panel_responsiveness', true) && editorExperiment('platform_editor_controls', 'control') && dragHandleButtonSmallScreenStyles, expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) && isFocused && keyboardFocusedDragHandleStyles, expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? focusedStyles : focusedStylesOld, expValEquals('cc_editor_ai_content_mode', 'variant', 'test') && fg('platform_editor_content_mode_button_mvp') && dragHandleButtonDenseModeStyles],
|
|
1076
1076
|
ref: buttonRef
|
|
1077
1077
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
|
|
1078
1078
|
,
|
|
1079
1079
|
style: !editorExperiment('platform_editor_controls', 'variant1') ? editorExperiment('platform_editor_block_control_optimise_render', true) ? positionStyles : positionStylesOld : {},
|
|
1080
1080
|
onClick: expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? handleOnClickNew : handleOnClick,
|
|
1081
|
-
onKeyDown: expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)
|
|
1081
|
+
onKeyDown: expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? handleKeyDownNew : handleKeyDown
|
|
1082
1082
|
// eslint-disable-next-line @atlaskit/design-system/no-direct-use-of-web-platform-drag-and-drop
|
|
1083
1083
|
,
|
|
1084
1084
|
onDrop: handleOnDrop,
|
|
@@ -1086,7 +1086,7 @@ export var DragHandle = function DragHandle(_ref2) {
|
|
|
1086
1086
|
"data-editor-block-ctrl-drag-handle": true,
|
|
1087
1087
|
"data-testid": "block-ctrl-drag-handle",
|
|
1088
1088
|
"aria-label": expValEquals('platform_editor_drag_handle_aria_label', 'isEnabled', true) ? dragHandleAriaLabel : '',
|
|
1089
|
-
onBlur: expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)
|
|
1089
|
+
onBlur: expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? function () {
|
|
1090
1090
|
return setIsFocused(false);
|
|
1091
1091
|
} : undefined
|
|
1092
1092
|
}, jsx(Box, {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-block-controls",
|
|
3
|
-
"version": "7.10.
|
|
3
|
+
"version": "7.10.2",
|
|
4
4
|
"description": "Block controls plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -54,7 +54,7 @@
|
|
|
54
54
|
"@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^3.2.0",
|
|
55
55
|
"@atlaskit/primitives": "^16.4.0",
|
|
56
56
|
"@atlaskit/theme": "^21.0.0",
|
|
57
|
-
"@atlaskit/tmp-editor-statsig": "^14.
|
|
57
|
+
"@atlaskit/tmp-editor-statsig": "^14.1.0",
|
|
58
58
|
"@atlaskit/tokens": "^8.4.0",
|
|
59
59
|
"@atlaskit/tooltip": "^20.10.0",
|
|
60
60
|
"@babel/runtime": "^7.0.0",
|