@atlaskit/editor-plugin-block-menu 6.0.25 → 6.0.26
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 +8 -0
- package/dist/cjs/ui/block-menu.js +18 -55
- package/dist/es2019/ui/block-menu.js +6 -42
- package/dist/esm/ui/block-menu.js +18 -55
- package/package.json +4 -7
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-block-menu
|
|
2
2
|
|
|
3
|
+
## 6.0.26
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`e00b363b9fa30`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e00b363b9fa30) -
|
|
8
|
+
[ux] EDITOR-4481 Clean up platform_editor_toolbar_aifc_user_intent_fix
|
|
9
|
+
- Updated dependencies
|
|
10
|
+
|
|
3
11
|
## 6.0.25
|
|
4
12
|
|
|
5
13
|
### Patch Changes
|
|
@@ -21,8 +21,6 @@ var _ui = require("@atlaskit/editor-common/ui");
|
|
|
21
21
|
var _uiMenu = require("@atlaskit/editor-common/ui-menu");
|
|
22
22
|
var _uiReact = require("@atlaskit/editor-common/ui-react");
|
|
23
23
|
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
|
|
24
|
-
var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
|
|
25
|
-
var _platformFeatureFlagsReact = require("@atlaskit/platform-feature-flags-react");
|
|
26
24
|
var _compiled = require("@atlaskit/primitives/compiled");
|
|
27
25
|
var _prosemirrorHistory = require("@atlaskit/prosemirror-history");
|
|
28
26
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
@@ -37,9 +35,7 @@ var DEFAULT_MENU_WIDTH = 230;
|
|
|
37
35
|
var DRAG_HANDLE_OFFSET_PADDING = 5;
|
|
38
36
|
var FALLBACK_MENU_HEIGHT = 300;
|
|
39
37
|
var PopupWithListeners = (0, _uiReact.withReactEditorViewOuterListeners)(_ui.Popup);
|
|
40
|
-
var useConditionalBlockMenuEffect =
|
|
41
|
-
return (0, _platformFeatureFlags.fg)('platform_editor_toolbar_aifc_user_intent_fix');
|
|
42
|
-
}, function (_ref) {
|
|
38
|
+
var useConditionalBlockMenuEffect = function useConditionalBlockMenuEffect(_ref) {
|
|
43
39
|
var api = _ref.api,
|
|
44
40
|
isMenuOpen = _ref.isMenuOpen,
|
|
45
41
|
menuTriggerBy = _ref.menuTriggerBy,
|
|
@@ -73,49 +69,17 @@ var useConditionalBlockMenuEffect = (0, _platformFeatureFlagsReact.conditionalHo
|
|
|
73
69
|
prevIsMenuOpenRef.current = isMenuOpen;
|
|
74
70
|
api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.commands.setCurrentUserIntent('blockMenuOpen'));
|
|
75
71
|
}, [api, isMenuOpen, menuTriggerBy, selectedByShortcutOrDragHandle, hasFocus, openedViaKeyboard, prevIsMenuOpenRef]);
|
|
76
|
-
}
|
|
77
|
-
var api = _ref2.api,
|
|
78
|
-
isMenuOpen = _ref2.isMenuOpen,
|
|
79
|
-
menuTriggerBy = _ref2.menuTriggerBy,
|
|
80
|
-
selectedByShortcutOrDragHandle = _ref2.selectedByShortcutOrDragHandle,
|
|
81
|
-
hasFocus = _ref2.hasFocus,
|
|
82
|
-
currentUserIntent = _ref2.currentUserIntent,
|
|
83
|
-
openedViaKeyboard = _ref2.openedViaKeyboard,
|
|
84
|
-
prevIsMenuOpenRef = _ref2.prevIsMenuOpenRef;
|
|
85
|
-
(0, _react.useEffect)(function () {
|
|
86
|
-
var _api$userIntent2;
|
|
87
|
-
if (!isMenuOpen || !menuTriggerBy || !selectedByShortcutOrDragHandle || !hasFocus || ['resizing', 'dragging'].includes(currentUserIntent || '')) {
|
|
88
|
-
return;
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
// Fire analytics event when block menu opens (only on first transition from closed to open)
|
|
92
|
-
if (!prevIsMenuOpenRef.current && isMenuOpen) {
|
|
93
|
-
var _api$analytics2;
|
|
94
|
-
api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 || _api$analytics2.actions.fireAnalyticsEvent({
|
|
95
|
-
action: _analytics.ACTION.OPENED,
|
|
96
|
-
actionSubject: _analytics.ACTION_SUBJECT.BLOCK_MENU,
|
|
97
|
-
eventType: _analytics.EVENT_TYPE.UI,
|
|
98
|
-
attributes: {
|
|
99
|
-
inputMethod: openedViaKeyboard ? _analytics.INPUT_METHOD.KEYBOARD : _analytics.INPUT_METHOD.MOUSE
|
|
100
|
-
}
|
|
101
|
-
});
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
// Update the previous state
|
|
105
|
-
prevIsMenuOpenRef.current = isMenuOpen;
|
|
106
|
-
api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 ? void 0 : _api$userIntent2.commands.setCurrentUserIntent('blockMenuOpen'));
|
|
107
|
-
}, [api, isMenuOpen, menuTriggerBy, selectedByShortcutOrDragHandle, hasFocus, currentUserIntent, openedViaKeyboard, prevIsMenuOpenRef]);
|
|
108
|
-
});
|
|
72
|
+
};
|
|
109
73
|
var isSelectionWithinCodeBlock = function isSelectionWithinCodeBlock(state) {
|
|
110
74
|
var _state$selection = state.selection,
|
|
111
75
|
$from = _state$selection.$from,
|
|
112
76
|
$to = _state$selection.$to;
|
|
113
77
|
return $from.sameParent($to) && $from.parent.type === state.schema.nodes.codeBlock;
|
|
114
78
|
};
|
|
115
|
-
var BlockMenuContent = function BlockMenuContent(
|
|
79
|
+
var BlockMenuContent = function BlockMenuContent(_ref2) {
|
|
116
80
|
var _api$blockMenu;
|
|
117
|
-
var api =
|
|
118
|
-
setRef =
|
|
81
|
+
var api = _ref2.api,
|
|
82
|
+
setRef = _ref2.setRef;
|
|
119
83
|
var blockMenuComponents = api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.actions.getBlockMenuComponents();
|
|
120
84
|
var setOutsideClickTargetRef = (0, _react.useContext)(_uiReact.OutsideClickTargetRefContext);
|
|
121
85
|
var ref = function ref(el) {
|
|
@@ -135,13 +99,13 @@ var BlockMenuContent = function BlockMenuContent(_ref3) {
|
|
|
135
99
|
allRegisteredComponents: blockMenuComponents || []
|
|
136
100
|
})));
|
|
137
101
|
};
|
|
138
|
-
var BlockMenu = function BlockMenu(
|
|
139
|
-
var _editorView$dom,
|
|
140
|
-
var editorView =
|
|
141
|
-
api =
|
|
142
|
-
mountTo =
|
|
143
|
-
boundariesElement =
|
|
144
|
-
scrollableElement =
|
|
102
|
+
var BlockMenu = function BlockMenu(_ref3) {
|
|
103
|
+
var _editorView$dom, _ref4, _api$analytics2;
|
|
104
|
+
var editorView = _ref3.editorView,
|
|
105
|
+
api = _ref3.api,
|
|
106
|
+
mountTo = _ref3.mountTo,
|
|
107
|
+
boundariesElement = _ref3.boundariesElement,
|
|
108
|
+
scrollableElement = _ref3.scrollableElement;
|
|
145
109
|
var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['blockControls', 'userIntent'], function (states) {
|
|
146
110
|
var _states$blockControls, _states$blockControls2, _states$blockControls3, _states$userIntentSta, _states$blockControls4;
|
|
147
111
|
return {
|
|
@@ -174,7 +138,7 @@ var BlockMenu = function BlockMenu(_ref4) {
|
|
|
174
138
|
}
|
|
175
139
|
setMenuHeight(((_popupRef$current = popupRef.current) === null || _popupRef$current === void 0 ? void 0 : _popupRef$current.clientHeight) || FALLBACK_MENU_HEIGHT);
|
|
176
140
|
}, [isMenuOpen]);
|
|
177
|
-
var hasFocus = (
|
|
141
|
+
var hasFocus = (_ref4 = (editorView === null || editorView === void 0 ? void 0 : editorView.hasFocus()) || document.activeElement === targetHandleRef || popupRef.current && (popupRef.current.contains(document.activeElement) || popupRef.current === document.activeElement)) !== null && _ref4 !== void 0 ? _ref4 : false;
|
|
178
142
|
var selectedByShortcutOrDragHandle = !!isSelectedViaDragHandle || !!openedViaKeyboard;
|
|
179
143
|
|
|
180
144
|
// Use conditional hook based on feature flag
|
|
@@ -184,7 +148,6 @@ var BlockMenu = function BlockMenu(_ref4) {
|
|
|
184
148
|
menuTriggerBy: menuTriggerBy,
|
|
185
149
|
selectedByShortcutOrDragHandle: selectedByShortcutOrDragHandle,
|
|
186
150
|
hasFocus: hasFocus,
|
|
187
|
-
currentUserIntent: (0, _platformFeatureFlags.fg)('platform_editor_toolbar_aifc_user_intent_fix') ? undefined : currentUserIntent,
|
|
188
151
|
openedViaKeyboard: openedViaKeyboard,
|
|
189
152
|
prevIsMenuOpenRef: prevIsMenuOpenRef
|
|
190
153
|
});
|
|
@@ -225,16 +188,16 @@ var BlockMenu = function BlockMenu(_ref4) {
|
|
|
225
188
|
closeMenu();
|
|
226
189
|
};
|
|
227
190
|
var closeMenu = function closeMenu() {
|
|
228
|
-
api === null || api === void 0 || api.core.actions.execute(function (
|
|
229
|
-
var _api$blockControls2, _api$
|
|
230
|
-
var tr =
|
|
191
|
+
api === null || api === void 0 || api.core.actions.execute(function (_ref5) {
|
|
192
|
+
var _api$blockControls2, _api$userIntent2;
|
|
193
|
+
var tr = _ref5.tr;
|
|
231
194
|
api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || _api$blockControls2.commands.toggleBlockMenu({
|
|
232
195
|
closeMenu: true
|
|
233
196
|
})({
|
|
234
197
|
tr: tr
|
|
235
198
|
});
|
|
236
199
|
onDropdownOpenChanged(false);
|
|
237
|
-
api === null || api === void 0 || (_api$
|
|
200
|
+
api === null || api === void 0 || (_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 || _api$userIntent2.commands.setCurrentUserIntent(currentUserIntent === 'blockMenuOpen' ? 'default' : currentUserIntent || 'default')({
|
|
238
201
|
tr: tr
|
|
239
202
|
});
|
|
240
203
|
return tr;
|
|
@@ -254,7 +217,7 @@ var BlockMenu = function BlockMenu(_ref4) {
|
|
|
254
217
|
}
|
|
255
218
|
return /*#__PURE__*/_react.default.createElement(_errorBoundary.ErrorBoundary, {
|
|
256
219
|
component: _analytics.ACTION_SUBJECT.BLOCK_MENU,
|
|
257
|
-
dispatchAnalyticsEvent: api === null || api === void 0 || (_api$
|
|
220
|
+
dispatchAnalyticsEvent: api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent,
|
|
258
221
|
fallbackComponent: null
|
|
259
222
|
}, /*#__PURE__*/_react.default.createElement(PopupWithListeners, {
|
|
260
223
|
alignX: 'right',
|
|
@@ -12,8 +12,6 @@ import { Popup } from '@atlaskit/editor-common/ui';
|
|
|
12
12
|
import { ArrowKeyNavigationProvider, ArrowKeyNavigationType } from '@atlaskit/editor-common/ui-menu';
|
|
13
13
|
import { OutsideClickTargetRefContext, withReactEditorViewOuterListeners } from '@atlaskit/editor-common/ui-react';
|
|
14
14
|
import { akEditorFloatingOverlapPanelZIndex } from '@atlaskit/editor-shared-styles';
|
|
15
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
16
|
-
import { conditionalHooksFactory } from '@atlaskit/platform-feature-flags-react';
|
|
17
15
|
import { Box } from '@atlaskit/primitives/compiled';
|
|
18
16
|
import { redo, undo } from '@atlaskit/prosemirror-history';
|
|
19
17
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
@@ -27,7 +25,7 @@ const DEFAULT_MENU_WIDTH = 230;
|
|
|
27
25
|
const DRAG_HANDLE_OFFSET_PADDING = 5;
|
|
28
26
|
const FALLBACK_MENU_HEIGHT = 300;
|
|
29
27
|
const PopupWithListeners = withReactEditorViewOuterListeners(Popup);
|
|
30
|
-
const useConditionalBlockMenuEffect =
|
|
28
|
+
const useConditionalBlockMenuEffect = ({
|
|
31
29
|
api,
|
|
32
30
|
isMenuOpen,
|
|
33
31
|
menuTriggerBy,
|
|
@@ -62,40 +60,7 @@ const useConditionalBlockMenuEffect = conditionalHooksFactory(() => fg('platform
|
|
|
62
60
|
prevIsMenuOpenRef.current = isMenuOpen;
|
|
63
61
|
api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.commands.setCurrentUserIntent('blockMenuOpen'));
|
|
64
62
|
}, [api, isMenuOpen, menuTriggerBy, selectedByShortcutOrDragHandle, hasFocus, openedViaKeyboard, prevIsMenuOpenRef]);
|
|
65
|
-
}
|
|
66
|
-
api,
|
|
67
|
-
isMenuOpen,
|
|
68
|
-
menuTriggerBy,
|
|
69
|
-
selectedByShortcutOrDragHandle,
|
|
70
|
-
hasFocus,
|
|
71
|
-
currentUserIntent,
|
|
72
|
-
openedViaKeyboard,
|
|
73
|
-
prevIsMenuOpenRef
|
|
74
|
-
}) => {
|
|
75
|
-
useEffect(() => {
|
|
76
|
-
var _api$userIntent2;
|
|
77
|
-
if (!isMenuOpen || !menuTriggerBy || !selectedByShortcutOrDragHandle || !hasFocus || ['resizing', 'dragging'].includes(currentUserIntent || '')) {
|
|
78
|
-
return;
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
// Fire analytics event when block menu opens (only on first transition from closed to open)
|
|
82
|
-
if (!prevIsMenuOpenRef.current && isMenuOpen) {
|
|
83
|
-
var _api$analytics2;
|
|
84
|
-
api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent({
|
|
85
|
-
action: ACTION.OPENED,
|
|
86
|
-
actionSubject: ACTION_SUBJECT.BLOCK_MENU,
|
|
87
|
-
eventType: EVENT_TYPE.UI,
|
|
88
|
-
attributes: {
|
|
89
|
-
inputMethod: openedViaKeyboard ? INPUT_METHOD.KEYBOARD : INPUT_METHOD.MOUSE
|
|
90
|
-
}
|
|
91
|
-
});
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
// Update the previous state
|
|
95
|
-
prevIsMenuOpenRef.current = isMenuOpen;
|
|
96
|
-
api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : (_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 ? void 0 : _api$userIntent2.commands.setCurrentUserIntent('blockMenuOpen'));
|
|
97
|
-
}, [api, isMenuOpen, menuTriggerBy, selectedByShortcutOrDragHandle, hasFocus, currentUserIntent, openedViaKeyboard, prevIsMenuOpenRef]);
|
|
98
|
-
});
|
|
63
|
+
};
|
|
99
64
|
const isSelectionWithinCodeBlock = state => {
|
|
100
65
|
const {
|
|
101
66
|
$from,
|
|
@@ -132,7 +97,7 @@ const BlockMenu = ({
|
|
|
132
97
|
boundariesElement,
|
|
133
98
|
scrollableElement
|
|
134
99
|
}) => {
|
|
135
|
-
var _editorView$dom, _ref, _api$
|
|
100
|
+
var _editorView$dom, _ref, _api$analytics2;
|
|
136
101
|
const {
|
|
137
102
|
menuTriggerBy,
|
|
138
103
|
isSelectedViaDragHandle,
|
|
@@ -174,7 +139,6 @@ const BlockMenu = ({
|
|
|
174
139
|
menuTriggerBy,
|
|
175
140
|
selectedByShortcutOrDragHandle,
|
|
176
141
|
hasFocus,
|
|
177
|
-
currentUserIntent: fg('platform_editor_toolbar_aifc_user_intent_fix') ? undefined : currentUserIntent,
|
|
178
142
|
openedViaKeyboard,
|
|
179
143
|
prevIsMenuOpenRef
|
|
180
144
|
});
|
|
@@ -218,14 +182,14 @@ const BlockMenu = ({
|
|
|
218
182
|
api === null || api === void 0 ? void 0 : api.core.actions.execute(({
|
|
219
183
|
tr
|
|
220
184
|
}) => {
|
|
221
|
-
var _api$blockControls2, _api$
|
|
185
|
+
var _api$blockControls2, _api$userIntent2;
|
|
222
186
|
api === null || api === void 0 ? void 0 : (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 ? void 0 : _api$blockControls2.commands.toggleBlockMenu({
|
|
223
187
|
closeMenu: true
|
|
224
188
|
})({
|
|
225
189
|
tr
|
|
226
190
|
});
|
|
227
191
|
onDropdownOpenChanged(false);
|
|
228
|
-
api === null || api === void 0 ? void 0 : (_api$
|
|
192
|
+
api === null || api === void 0 ? void 0 : (_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 ? void 0 : _api$userIntent2.commands.setCurrentUserIntent(currentUserIntent === 'blockMenuOpen' ? 'default' : currentUserIntent || 'default')({
|
|
229
193
|
tr
|
|
230
194
|
});
|
|
231
195
|
return tr;
|
|
@@ -245,7 +209,7 @@ const BlockMenu = ({
|
|
|
245
209
|
}
|
|
246
210
|
return /*#__PURE__*/React.createElement(ErrorBoundary, {
|
|
247
211
|
component: ACTION_SUBJECT.BLOCK_MENU,
|
|
248
|
-
dispatchAnalyticsEvent: api === null || api === void 0 ? void 0 : (_api$
|
|
212
|
+
dispatchAnalyticsEvent: api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent,
|
|
249
213
|
fallbackComponent: null
|
|
250
214
|
}, /*#__PURE__*/React.createElement(PopupWithListeners, {
|
|
251
215
|
alignX: 'right',
|
|
@@ -13,8 +13,6 @@ import { Popup } from '@atlaskit/editor-common/ui';
|
|
|
13
13
|
import { ArrowKeyNavigationProvider, ArrowKeyNavigationType } from '@atlaskit/editor-common/ui-menu';
|
|
14
14
|
import { OutsideClickTargetRefContext, withReactEditorViewOuterListeners } from '@atlaskit/editor-common/ui-react';
|
|
15
15
|
import { akEditorFloatingOverlapPanelZIndex } from '@atlaskit/editor-shared-styles';
|
|
16
|
-
import { fg } from '@atlaskit/platform-feature-flags';
|
|
17
|
-
import { conditionalHooksFactory } from '@atlaskit/platform-feature-flags-react';
|
|
18
16
|
import { Box } from '@atlaskit/primitives/compiled';
|
|
19
17
|
import { redo, undo } from '@atlaskit/prosemirror-history';
|
|
20
18
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
@@ -28,9 +26,7 @@ var DEFAULT_MENU_WIDTH = 230;
|
|
|
28
26
|
var DRAG_HANDLE_OFFSET_PADDING = 5;
|
|
29
27
|
var FALLBACK_MENU_HEIGHT = 300;
|
|
30
28
|
var PopupWithListeners = withReactEditorViewOuterListeners(Popup);
|
|
31
|
-
var useConditionalBlockMenuEffect =
|
|
32
|
-
return fg('platform_editor_toolbar_aifc_user_intent_fix');
|
|
33
|
-
}, function (_ref) {
|
|
29
|
+
var useConditionalBlockMenuEffect = function useConditionalBlockMenuEffect(_ref) {
|
|
34
30
|
var api = _ref.api,
|
|
35
31
|
isMenuOpen = _ref.isMenuOpen,
|
|
36
32
|
menuTriggerBy = _ref.menuTriggerBy,
|
|
@@ -64,49 +60,17 @@ var useConditionalBlockMenuEffect = conditionalHooksFactory(function () {
|
|
|
64
60
|
prevIsMenuOpenRef.current = isMenuOpen;
|
|
65
61
|
api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.commands.setCurrentUserIntent('blockMenuOpen'));
|
|
66
62
|
}, [api, isMenuOpen, menuTriggerBy, selectedByShortcutOrDragHandle, hasFocus, openedViaKeyboard, prevIsMenuOpenRef]);
|
|
67
|
-
}
|
|
68
|
-
var api = _ref2.api,
|
|
69
|
-
isMenuOpen = _ref2.isMenuOpen,
|
|
70
|
-
menuTriggerBy = _ref2.menuTriggerBy,
|
|
71
|
-
selectedByShortcutOrDragHandle = _ref2.selectedByShortcutOrDragHandle,
|
|
72
|
-
hasFocus = _ref2.hasFocus,
|
|
73
|
-
currentUserIntent = _ref2.currentUserIntent,
|
|
74
|
-
openedViaKeyboard = _ref2.openedViaKeyboard,
|
|
75
|
-
prevIsMenuOpenRef = _ref2.prevIsMenuOpenRef;
|
|
76
|
-
useEffect(function () {
|
|
77
|
-
var _api$userIntent2;
|
|
78
|
-
if (!isMenuOpen || !menuTriggerBy || !selectedByShortcutOrDragHandle || !hasFocus || ['resizing', 'dragging'].includes(currentUserIntent || '')) {
|
|
79
|
-
return;
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
// Fire analytics event when block menu opens (only on first transition from closed to open)
|
|
83
|
-
if (!prevIsMenuOpenRef.current && isMenuOpen) {
|
|
84
|
-
var _api$analytics2;
|
|
85
|
-
api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 || _api$analytics2.actions.fireAnalyticsEvent({
|
|
86
|
-
action: ACTION.OPENED,
|
|
87
|
-
actionSubject: ACTION_SUBJECT.BLOCK_MENU,
|
|
88
|
-
eventType: EVENT_TYPE.UI,
|
|
89
|
-
attributes: {
|
|
90
|
-
inputMethod: openedViaKeyboard ? INPUT_METHOD.KEYBOARD : INPUT_METHOD.MOUSE
|
|
91
|
-
}
|
|
92
|
-
});
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
// Update the previous state
|
|
96
|
-
prevIsMenuOpenRef.current = isMenuOpen;
|
|
97
|
-
api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 ? void 0 : _api$userIntent2.commands.setCurrentUserIntent('blockMenuOpen'));
|
|
98
|
-
}, [api, isMenuOpen, menuTriggerBy, selectedByShortcutOrDragHandle, hasFocus, currentUserIntent, openedViaKeyboard, prevIsMenuOpenRef]);
|
|
99
|
-
});
|
|
63
|
+
};
|
|
100
64
|
var isSelectionWithinCodeBlock = function isSelectionWithinCodeBlock(state) {
|
|
101
65
|
var _state$selection = state.selection,
|
|
102
66
|
$from = _state$selection.$from,
|
|
103
67
|
$to = _state$selection.$to;
|
|
104
68
|
return $from.sameParent($to) && $from.parent.type === state.schema.nodes.codeBlock;
|
|
105
69
|
};
|
|
106
|
-
var BlockMenuContent = function BlockMenuContent(
|
|
70
|
+
var BlockMenuContent = function BlockMenuContent(_ref2) {
|
|
107
71
|
var _api$blockMenu;
|
|
108
|
-
var api =
|
|
109
|
-
setRef =
|
|
72
|
+
var api = _ref2.api,
|
|
73
|
+
setRef = _ref2.setRef;
|
|
110
74
|
var blockMenuComponents = api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.actions.getBlockMenuComponents();
|
|
111
75
|
var setOutsideClickTargetRef = useContext(OutsideClickTargetRefContext);
|
|
112
76
|
var ref = function ref(el) {
|
|
@@ -126,13 +90,13 @@ var BlockMenuContent = function BlockMenuContent(_ref3) {
|
|
|
126
90
|
allRegisteredComponents: blockMenuComponents || []
|
|
127
91
|
})));
|
|
128
92
|
};
|
|
129
|
-
var BlockMenu = function BlockMenu(
|
|
130
|
-
var _editorView$dom,
|
|
131
|
-
var editorView =
|
|
132
|
-
api =
|
|
133
|
-
mountTo =
|
|
134
|
-
boundariesElement =
|
|
135
|
-
scrollableElement =
|
|
93
|
+
var BlockMenu = function BlockMenu(_ref3) {
|
|
94
|
+
var _editorView$dom, _ref4, _api$analytics2;
|
|
95
|
+
var editorView = _ref3.editorView,
|
|
96
|
+
api = _ref3.api,
|
|
97
|
+
mountTo = _ref3.mountTo,
|
|
98
|
+
boundariesElement = _ref3.boundariesElement,
|
|
99
|
+
scrollableElement = _ref3.scrollableElement;
|
|
136
100
|
var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['blockControls', 'userIntent'], function (states) {
|
|
137
101
|
var _states$blockControls, _states$blockControls2, _states$blockControls3, _states$userIntentSta, _states$blockControls4;
|
|
138
102
|
return {
|
|
@@ -165,7 +129,7 @@ var BlockMenu = function BlockMenu(_ref4) {
|
|
|
165
129
|
}
|
|
166
130
|
setMenuHeight(((_popupRef$current = popupRef.current) === null || _popupRef$current === void 0 ? void 0 : _popupRef$current.clientHeight) || FALLBACK_MENU_HEIGHT);
|
|
167
131
|
}, [isMenuOpen]);
|
|
168
|
-
var hasFocus = (
|
|
132
|
+
var hasFocus = (_ref4 = (editorView === null || editorView === void 0 ? void 0 : editorView.hasFocus()) || document.activeElement === targetHandleRef || popupRef.current && (popupRef.current.contains(document.activeElement) || popupRef.current === document.activeElement)) !== null && _ref4 !== void 0 ? _ref4 : false;
|
|
169
133
|
var selectedByShortcutOrDragHandle = !!isSelectedViaDragHandle || !!openedViaKeyboard;
|
|
170
134
|
|
|
171
135
|
// Use conditional hook based on feature flag
|
|
@@ -175,7 +139,6 @@ var BlockMenu = function BlockMenu(_ref4) {
|
|
|
175
139
|
menuTriggerBy: menuTriggerBy,
|
|
176
140
|
selectedByShortcutOrDragHandle: selectedByShortcutOrDragHandle,
|
|
177
141
|
hasFocus: hasFocus,
|
|
178
|
-
currentUserIntent: fg('platform_editor_toolbar_aifc_user_intent_fix') ? undefined : currentUserIntent,
|
|
179
142
|
openedViaKeyboard: openedViaKeyboard,
|
|
180
143
|
prevIsMenuOpenRef: prevIsMenuOpenRef
|
|
181
144
|
});
|
|
@@ -216,16 +179,16 @@ var BlockMenu = function BlockMenu(_ref4) {
|
|
|
216
179
|
closeMenu();
|
|
217
180
|
};
|
|
218
181
|
var closeMenu = function closeMenu() {
|
|
219
|
-
api === null || api === void 0 || api.core.actions.execute(function (
|
|
220
|
-
var _api$blockControls2, _api$
|
|
221
|
-
var tr =
|
|
182
|
+
api === null || api === void 0 || api.core.actions.execute(function (_ref5) {
|
|
183
|
+
var _api$blockControls2, _api$userIntent2;
|
|
184
|
+
var tr = _ref5.tr;
|
|
222
185
|
api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || _api$blockControls2.commands.toggleBlockMenu({
|
|
223
186
|
closeMenu: true
|
|
224
187
|
})({
|
|
225
188
|
tr: tr
|
|
226
189
|
});
|
|
227
190
|
onDropdownOpenChanged(false);
|
|
228
|
-
api === null || api === void 0 || (_api$
|
|
191
|
+
api === null || api === void 0 || (_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 || _api$userIntent2.commands.setCurrentUserIntent(currentUserIntent === 'blockMenuOpen' ? 'default' : currentUserIntent || 'default')({
|
|
229
192
|
tr: tr
|
|
230
193
|
});
|
|
231
194
|
return tr;
|
|
@@ -245,7 +208,7 @@ var BlockMenu = function BlockMenu(_ref4) {
|
|
|
245
208
|
}
|
|
246
209
|
return /*#__PURE__*/React.createElement(ErrorBoundary, {
|
|
247
210
|
component: ACTION_SUBJECT.BLOCK_MENU,
|
|
248
|
-
dispatchAnalyticsEvent: api === null || api === void 0 || (_api$
|
|
211
|
+
dispatchAnalyticsEvent: api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions.fireAnalyticsEvent,
|
|
249
212
|
fallbackComponent: null
|
|
250
213
|
}, /*#__PURE__*/React.createElement(PopupWithListeners, {
|
|
251
214
|
alignX: 'right',
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-block-menu",
|
|
3
|
-
"version": "6.0.
|
|
3
|
+
"version": "6.0.26",
|
|
4
4
|
"description": "BlockMenu plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
"@atlaskit/css": "^0.19.0",
|
|
33
33
|
"@atlaskit/dropdown-menu": "^16.4.0",
|
|
34
34
|
"@atlaskit/editor-plugin-analytics": "^7.0.0",
|
|
35
|
-
"@atlaskit/editor-plugin-block-controls": "^8.
|
|
35
|
+
"@atlaskit/editor-plugin-block-controls": "^8.1.0",
|
|
36
36
|
"@atlaskit/editor-plugin-decorations": "^7.0.0",
|
|
37
37
|
"@atlaskit/editor-plugin-selection": "^7.0.0",
|
|
38
38
|
"@atlaskit/editor-plugin-user-intent": "^5.0.0",
|
|
@@ -46,12 +46,12 @@
|
|
|
46
46
|
"@atlaskit/platform-feature-flags-react": "^0.4.0",
|
|
47
47
|
"@atlaskit/primitives": "^17.1.0",
|
|
48
48
|
"@atlaskit/prosemirror-history": "^0.2.0",
|
|
49
|
-
"@atlaskit/tmp-editor-statsig": "^
|
|
49
|
+
"@atlaskit/tmp-editor-statsig": "^17.0.0",
|
|
50
50
|
"@atlaskit/tokens": "^10.1.0",
|
|
51
51
|
"@babel/runtime": "^7.0.0"
|
|
52
52
|
},
|
|
53
53
|
"peerDependencies": {
|
|
54
|
-
"@atlaskit/editor-common": "^111.
|
|
54
|
+
"@atlaskit/editor-common": "^111.9.0",
|
|
55
55
|
"react": "^18.2.0",
|
|
56
56
|
"react-intl-next": "npm:react-intl@^5.18.1"
|
|
57
57
|
},
|
|
@@ -94,9 +94,6 @@
|
|
|
94
94
|
"platform-feature-flags": {
|
|
95
95
|
"platform_editor_adf_with_localid": {
|
|
96
96
|
"type": "boolean"
|
|
97
|
-
},
|
|
98
|
-
"platform_editor_toolbar_aifc_user_intent_fix": {
|
|
99
|
-
"type": "boolean"
|
|
100
97
|
}
|
|
101
98
|
}
|
|
102
99
|
}
|