@atlaskit/editor-plugin-block-controls 16.0.0 → 16.0.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/pm-plugins/interaction-tracking/handle-mouse-move.js +3 -4
- package/dist/cjs/pm-plugins/interaction-tracking/pm-plugin.js +65 -20
- package/dist/es2019/pm-plugins/interaction-tracking/handle-mouse-move.js +3 -4
- package/dist/es2019/pm-plugins/interaction-tracking/pm-plugin.js +65 -20
- package/dist/esm/pm-plugins/interaction-tracking/handle-mouse-move.js +3 -4
- package/dist/esm/pm-plugins/interaction-tracking/pm-plugin.js +65 -20
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,21 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-block-controls
|
|
2
2
|
|
|
3
|
+
## 16.0.2
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies
|
|
8
|
+
|
|
9
|
+
## 16.0.1
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- [`47b2ae576b031`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/47b2ae576b031) -
|
|
14
|
+
[ux] Under the `cc_maui_remix_button_hover_corridor` experiment, replace the Remix button's
|
|
15
|
+
rendered hover corridor and fixed right-margin exclusion with the existing click-wrapper hover
|
|
16
|
+
tracking. Hide block controls over the marked object sidebar container and its control surfaces.
|
|
17
|
+
- Updated dependencies
|
|
18
|
+
|
|
3
19
|
## 16.0.0
|
|
4
20
|
|
|
5
21
|
### Patch Changes
|
|
@@ -79,7 +79,7 @@ var classifyRightMarginPosition = function classifyRightMarginPosition(view, eve
|
|
|
79
79
|
if (event.clientX <= found.rect.right) {
|
|
80
80
|
return null;
|
|
81
81
|
}
|
|
82
|
-
return event.clientX > getRightMarginBoundary(view) ? {
|
|
82
|
+
return event.clientX > getRightMarginBoundary(view) && !(0, _expValEqualsNoExposure.expValEqualsNoExposure)('cc_maui_remix_button_hover_corridor', 'isEnabled', true) ? {
|
|
83
83
|
type: 'gap'
|
|
84
84
|
} : {
|
|
85
85
|
type: 'active',
|
|
@@ -159,9 +159,8 @@ var processHoverSide = function processHoverSide(view, api) {
|
|
|
159
159
|
return;
|
|
160
160
|
}
|
|
161
161
|
|
|
162
|
-
//
|
|
163
|
-
//
|
|
164
|
-
// only empty margin remains reserved for Rovo in that case.
|
|
162
|
+
// Keep the existing fixed Rovo gap in the control cohort. The treatment uses explicitly marked
|
|
163
|
+
// control surfaces instead, so the rest of the right margin remains hoverable.
|
|
165
164
|
if ((marginZone === null || marginZone === void 0 ? void 0 : marginZone.type) === 'gap' || event.clientX > getRightMarginBoundary(view) && (!blockElement || !(0, _expValEqualsNoExposure.expValEqualsNoExposure)('cc_maui_remix_button_hover_corridor', 'isEnabled', true))) {
|
|
166
165
|
if (!(state !== null && state !== void 0 && state.isMouseOut)) {
|
|
167
166
|
(0, _commands.clearHoverSide)(view);
|
|
@@ -7,7 +7,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.interactionTrackingPluginKey = exports.getInteractionTrackingState = exports.createInteractionTrackingPlugin = void 0;
|
|
8
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
9
|
var _bindEventListener = require("bind-event-listener");
|
|
10
|
+
var _blockControlsSuppression = require("@atlaskit/editor-common/block-controls-suppression");
|
|
10
11
|
var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
|
|
12
|
+
var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
|
|
13
|
+
var _unsafeExpValNoExposure = require("@atlaskit/platform-feature-experiments/unsafe-exp-val-no-exposure");
|
|
11
14
|
var _state = require("@atlaskit/editor-prosemirror/state");
|
|
12
15
|
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
|
|
13
16
|
var _constants = require("./constants");
|
|
@@ -47,6 +50,15 @@ var isOverActiveClickArea = function isOverActiveClickArea(target, clientX) {
|
|
|
47
50
|
var innerWidth = (_target$ownerDocument = (_target$ownerDocument2 = target.ownerDocument.defaultView) === null || _target$ownerDocument2 === void 0 ? void 0 : _target$ownerDocument2.innerWidth) !== null && _target$ownerDocument !== void 0 ? _target$ownerDocument : Number.POSITIVE_INFINITY;
|
|
48
51
|
return clientX <= innerWidth - _constants.RIGHT_MARGIN_ROVO_GAP_PX;
|
|
49
52
|
};
|
|
53
|
+
var isOverTreatmentClickArea = function isOverTreatmentClickArea(target, editorContentArea, clientX) {
|
|
54
|
+
if (!(target instanceof Element) || !(editorContentArea instanceof HTMLElement)) {
|
|
55
|
+
return false;
|
|
56
|
+
}
|
|
57
|
+
if (!target.closest(CLICK_AREA_SELECTOR)) {
|
|
58
|
+
return false;
|
|
59
|
+
}
|
|
60
|
+
return clientX > editorContentArea.getBoundingClientRect().right;
|
|
61
|
+
};
|
|
50
62
|
var interactionTrackingPluginKey = exports.interactionTrackingPluginKey = new _state.PluginKey('interactionTrackingPlugin');
|
|
51
63
|
var createInteractionTrackingPlugin = exports.createInteractionTrackingPlugin = function createInteractionTrackingPlugin() {
|
|
52
64
|
var rightSideControlsEnabled = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
|
@@ -119,20 +131,24 @@ var createInteractionTrackingPlugin = exports.createInteractionTrackingPlugin =
|
|
|
119
131
|
mouseLeaveTimeoutId = null;
|
|
120
132
|
}
|
|
121
133
|
|
|
122
|
-
//
|
|
123
|
-
// (the Rovo gap is excluded so controls still clear there).
|
|
134
|
+
// Preserve the existing hover targets for the control cohort.
|
|
124
135
|
if (rightSideControlsEnabled && (isMovingToBlockControlsArea(event.relatedTarget) || isOverActiveClickArea(event.relatedTarget, event.clientX))) {
|
|
125
136
|
return;
|
|
126
137
|
}
|
|
138
|
+
if (rightSideControlsEnabled && (0, _isExperimentEnabled.isExperimentEnabled)('cc_maui_remix_button_hover_corridor') && isOverTreatmentClickArea(event.relatedTarget, editorContentArea, event.clientX)) {
|
|
139
|
+
return;
|
|
140
|
+
}
|
|
127
141
|
mouseLeaveTimeoutId = setTimeout(function () {
|
|
128
142
|
mouseLeaveTimeoutId = null;
|
|
129
|
-
// Re-check
|
|
130
|
-
// or the active right margin.
|
|
143
|
+
// Re-check the control cohort's existing hover targets after the debounce.
|
|
131
144
|
if (rightSideControlsEnabled && typeof document !== 'undefined') {
|
|
132
145
|
var el = document.elementFromPoint(lastMousePosition.x, lastMousePosition.y);
|
|
133
146
|
if (el && (isMovingToBlockControlsArea(el) || isOverActiveClickArea(el, lastMousePosition.x))) {
|
|
134
147
|
return;
|
|
135
148
|
}
|
|
149
|
+
if (el && (0, _isExperimentEnabled.isExperimentEnabled)('cc_maui_remix_button_hover_corridor') && isOverTreatmentClickArea(el, editorContentArea, lastMousePosition.x)) {
|
|
150
|
+
return;
|
|
151
|
+
}
|
|
136
152
|
}
|
|
137
153
|
(0, _handleMouseMove.handleMouseLeave)(view, rightSideControlsEnabled);
|
|
138
154
|
}, MOUSE_LEAVE_DEBOUNCE_MS);
|
|
@@ -143,25 +159,54 @@ var createInteractionTrackingPlugin = exports.createInteractionTrackingPlugin =
|
|
|
143
159
|
mouseLeaveTimeoutId = null;
|
|
144
160
|
}
|
|
145
161
|
};
|
|
162
|
+
var handleDocumentMouseMove = function handleDocumentMouseMove(event) {
|
|
163
|
+
lastMousePosition = {
|
|
164
|
+
x: event.clientX,
|
|
165
|
+
y: event.clientY
|
|
166
|
+
};
|
|
167
|
+
// Catches block controls in portals that handleDOMEvents.mousemove misses.
|
|
168
|
+
var isOverKnownHoverTarget = (editorContentArea === null || editorContentArea === void 0 ? void 0 : editorContentArea.contains(event.target)) || isMovingToBlockControlsArea(event.target);
|
|
169
|
+
var overClickArea = event.target instanceof Element && !!event.target.closest(CLICK_AREA_SELECTOR);
|
|
170
|
+
if (isOverKnownHoverTarget || overClickArea) {
|
|
171
|
+
(0, _handleMouseMove.handleMouseMove)(view, event, rightSideControlsEnabled, api);
|
|
172
|
+
}
|
|
173
|
+
};
|
|
174
|
+
var handleTreatmentDocumentMouseMove = function handleTreatmentDocumentMouseMove(event) {
|
|
175
|
+
if ((0, _blockControlsSuppression.isBlockControlsSuppressionTarget)(event.target)) {
|
|
176
|
+
var _interactionTrackingP;
|
|
177
|
+
lastMousePosition = {
|
|
178
|
+
x: event.clientX,
|
|
179
|
+
y: event.clientY
|
|
180
|
+
};
|
|
181
|
+
cancelScheduledMouseLeave();
|
|
182
|
+
if (!((_interactionTrackingP = interactionTrackingPluginKey.getState(view.state)) !== null && _interactionTrackingP !== void 0 && _interactionTrackingP.isMouseOut)) {
|
|
183
|
+
(0, _handleMouseMove.handleMouseLeave)(view, rightSideControlsEnabled);
|
|
184
|
+
}
|
|
185
|
+
return;
|
|
186
|
+
}
|
|
187
|
+
handleDocumentMouseMove(event);
|
|
188
|
+
};
|
|
146
189
|
if (editorContentArea) {
|
|
147
190
|
if (rightSideControlsEnabled && typeof document !== 'undefined') {
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
var overClickArea = event.target instanceof Element && !!event.target.closest(CLICK_AREA_SELECTOR);
|
|
157
|
-
if (editorContentArea.contains(event.target) || isMovingToBlockControlsArea(event.target) || overClickArea) {
|
|
158
|
-
(0, _handleMouseMove.handleMouseMove)(view, event, rightSideControlsEnabled, api);
|
|
191
|
+
// RemixButtonDecoration fires exposure when the control is visible; this
|
|
192
|
+
// mount-time split only selects the appropriate interaction listener.
|
|
193
|
+
if ((0, _unsafeExpValNoExposure.UNSAFE_expValNoExposure)('cc_maui_remix_button_hover_corridor', 'isEnabled', false) === true) {
|
|
194
|
+
unbindDocumentMouseMove = (0, _bindEventListener.bind)(document, {
|
|
195
|
+
type: 'mousemove',
|
|
196
|
+
listener: handleTreatmentDocumentMouseMove,
|
|
197
|
+
options: {
|
|
198
|
+
passive: true
|
|
159
199
|
}
|
|
160
|
-
}
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
200
|
+
});
|
|
201
|
+
} else {
|
|
202
|
+
unbindDocumentMouseMove = (0, _bindEventListener.bind)(document, {
|
|
203
|
+
type: 'mousemove',
|
|
204
|
+
listener: handleDocumentMouseMove,
|
|
205
|
+
options: {
|
|
206
|
+
passive: true
|
|
207
|
+
}
|
|
208
|
+
});
|
|
209
|
+
}
|
|
165
210
|
}
|
|
166
211
|
unbindMouseEnter = (0, _bindEventListener.bind)(editorContentArea, {
|
|
167
212
|
type: 'mouseenter',
|
|
@@ -60,7 +60,7 @@ const classifyRightMarginPosition = (view, event) => {
|
|
|
60
60
|
if (event.clientX <= found.rect.right) {
|
|
61
61
|
return null;
|
|
62
62
|
}
|
|
63
|
-
return event.clientX > getRightMarginBoundary(view) ? {
|
|
63
|
+
return event.clientX > getRightMarginBoundary(view) && !expValEqualsNoExposure('cc_maui_remix_button_hover_corridor', 'isEnabled', true) ? {
|
|
64
64
|
type: 'gap'
|
|
65
65
|
} : {
|
|
66
66
|
type: 'active',
|
|
@@ -140,9 +140,8 @@ const processHoverSide = (view, api) => {
|
|
|
140
140
|
return;
|
|
141
141
|
}
|
|
142
142
|
|
|
143
|
-
//
|
|
144
|
-
//
|
|
145
|
-
// only empty margin remains reserved for Rovo in that case.
|
|
143
|
+
// Keep the existing fixed Rovo gap in the control cohort. The treatment uses explicitly marked
|
|
144
|
+
// control surfaces instead, so the rest of the right margin remains hoverable.
|
|
146
145
|
if ((marginZone === null || marginZone === void 0 ? void 0 : marginZone.type) === 'gap' || event.clientX > getRightMarginBoundary(view) && (!blockElement || !expValEqualsNoExposure('cc_maui_remix_button_hover_corridor', 'isEnabled', true))) {
|
|
147
146
|
if (!(state !== null && state !== void 0 && state.isMouseOut)) {
|
|
148
147
|
clearHoverSide(view);
|
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
import { bind } from 'bind-event-listener';
|
|
2
|
+
import { isBlockControlsSuppressionTarget } from '@atlaskit/editor-common/block-controls-suppression';
|
|
2
3
|
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
4
|
+
import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
|
|
5
|
+
import { UNSAFE_expValNoExposure } from '@atlaskit/platform-feature-experiments/unsafe-exp-val-no-exposure';
|
|
3
6
|
import { PluginKey } from '@atlaskit/editor-prosemirror/state';
|
|
4
7
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
5
8
|
import { RIGHT_MARGIN_ROVO_GAP_PX } from './constants';
|
|
@@ -36,6 +39,15 @@ const isOverActiveClickArea = (target, clientX) => {
|
|
|
36
39
|
const innerWidth = (_target$ownerDocument = (_target$ownerDocument2 = target.ownerDocument.defaultView) === null || _target$ownerDocument2 === void 0 ? void 0 : _target$ownerDocument2.innerWidth) !== null && _target$ownerDocument !== void 0 ? _target$ownerDocument : Number.POSITIVE_INFINITY;
|
|
37
40
|
return clientX <= innerWidth - RIGHT_MARGIN_ROVO_GAP_PX;
|
|
38
41
|
};
|
|
42
|
+
const isOverTreatmentClickArea = (target, editorContentArea, clientX) => {
|
|
43
|
+
if (!(target instanceof Element) || !(editorContentArea instanceof HTMLElement)) {
|
|
44
|
+
return false;
|
|
45
|
+
}
|
|
46
|
+
if (!target.closest(CLICK_AREA_SELECTOR)) {
|
|
47
|
+
return false;
|
|
48
|
+
}
|
|
49
|
+
return clientX > editorContentArea.getBoundingClientRect().right;
|
|
50
|
+
};
|
|
39
51
|
export const interactionTrackingPluginKey = new PluginKey('interactionTrackingPlugin');
|
|
40
52
|
export const createInteractionTrackingPlugin = (rightSideControlsEnabled = false, api) => {
|
|
41
53
|
return new SafePlugin({
|
|
@@ -107,20 +119,24 @@ export const createInteractionTrackingPlugin = (rightSideControlsEnabled = false
|
|
|
107
119
|
mouseLeaveTimeoutId = null;
|
|
108
120
|
}
|
|
109
121
|
|
|
110
|
-
//
|
|
111
|
-
// (the Rovo gap is excluded so controls still clear there).
|
|
122
|
+
// Preserve the existing hover targets for the control cohort.
|
|
112
123
|
if (rightSideControlsEnabled && (isMovingToBlockControlsArea(event.relatedTarget) || isOverActiveClickArea(event.relatedTarget, event.clientX))) {
|
|
113
124
|
return;
|
|
114
125
|
}
|
|
126
|
+
if (rightSideControlsEnabled && isExperimentEnabled('cc_maui_remix_button_hover_corridor') && isOverTreatmentClickArea(event.relatedTarget, editorContentArea, event.clientX)) {
|
|
127
|
+
return;
|
|
128
|
+
}
|
|
115
129
|
mouseLeaveTimeoutId = setTimeout(() => {
|
|
116
130
|
mouseLeaveTimeoutId = null;
|
|
117
|
-
// Re-check
|
|
118
|
-
// or the active right margin.
|
|
131
|
+
// Re-check the control cohort's existing hover targets after the debounce.
|
|
119
132
|
if (rightSideControlsEnabled && typeof document !== 'undefined') {
|
|
120
133
|
const el = document.elementFromPoint(lastMousePosition.x, lastMousePosition.y);
|
|
121
134
|
if (el && (isMovingToBlockControlsArea(el) || isOverActiveClickArea(el, lastMousePosition.x))) {
|
|
122
135
|
return;
|
|
123
136
|
}
|
|
137
|
+
if (el && isExperimentEnabled('cc_maui_remix_button_hover_corridor') && isOverTreatmentClickArea(el, editorContentArea, lastMousePosition.x)) {
|
|
138
|
+
return;
|
|
139
|
+
}
|
|
124
140
|
}
|
|
125
141
|
handleMouseLeave(view, rightSideControlsEnabled);
|
|
126
142
|
}, MOUSE_LEAVE_DEBOUNCE_MS);
|
|
@@ -131,25 +147,54 @@ export const createInteractionTrackingPlugin = (rightSideControlsEnabled = false
|
|
|
131
147
|
mouseLeaveTimeoutId = null;
|
|
132
148
|
}
|
|
133
149
|
};
|
|
150
|
+
const handleDocumentMouseMove = event => {
|
|
151
|
+
lastMousePosition = {
|
|
152
|
+
x: event.clientX,
|
|
153
|
+
y: event.clientY
|
|
154
|
+
};
|
|
155
|
+
// Catches block controls in portals that handleDOMEvents.mousemove misses.
|
|
156
|
+
const isOverKnownHoverTarget = (editorContentArea === null || editorContentArea === void 0 ? void 0 : editorContentArea.contains(event.target)) || isMovingToBlockControlsArea(event.target);
|
|
157
|
+
const overClickArea = event.target instanceof Element && !!event.target.closest(CLICK_AREA_SELECTOR);
|
|
158
|
+
if (isOverKnownHoverTarget || overClickArea) {
|
|
159
|
+
handleMouseMove(view, event, rightSideControlsEnabled, api);
|
|
160
|
+
}
|
|
161
|
+
};
|
|
162
|
+
const handleTreatmentDocumentMouseMove = event => {
|
|
163
|
+
if (isBlockControlsSuppressionTarget(event.target)) {
|
|
164
|
+
var _interactionTrackingP;
|
|
165
|
+
lastMousePosition = {
|
|
166
|
+
x: event.clientX,
|
|
167
|
+
y: event.clientY
|
|
168
|
+
};
|
|
169
|
+
cancelScheduledMouseLeave();
|
|
170
|
+
if (!((_interactionTrackingP = interactionTrackingPluginKey.getState(view.state)) !== null && _interactionTrackingP !== void 0 && _interactionTrackingP.isMouseOut)) {
|
|
171
|
+
handleMouseLeave(view, rightSideControlsEnabled);
|
|
172
|
+
}
|
|
173
|
+
return;
|
|
174
|
+
}
|
|
175
|
+
handleDocumentMouseMove(event);
|
|
176
|
+
};
|
|
134
177
|
if (editorContentArea) {
|
|
135
178
|
if (rightSideControlsEnabled && typeof document !== 'undefined') {
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
const overClickArea = event.target instanceof Element && !!event.target.closest(CLICK_AREA_SELECTOR);
|
|
145
|
-
if (editorContentArea.contains(event.target) || isMovingToBlockControlsArea(event.target) || overClickArea) {
|
|
146
|
-
handleMouseMove(view, event, rightSideControlsEnabled, api);
|
|
179
|
+
// RemixButtonDecoration fires exposure when the control is visible; this
|
|
180
|
+
// mount-time split only selects the appropriate interaction listener.
|
|
181
|
+
if (UNSAFE_expValNoExposure('cc_maui_remix_button_hover_corridor', 'isEnabled', false) === true) {
|
|
182
|
+
unbindDocumentMouseMove = bind(document, {
|
|
183
|
+
type: 'mousemove',
|
|
184
|
+
listener: handleTreatmentDocumentMouseMove,
|
|
185
|
+
options: {
|
|
186
|
+
passive: true
|
|
147
187
|
}
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
188
|
+
});
|
|
189
|
+
} else {
|
|
190
|
+
unbindDocumentMouseMove = bind(document, {
|
|
191
|
+
type: 'mousemove',
|
|
192
|
+
listener: handleDocumentMouseMove,
|
|
193
|
+
options: {
|
|
194
|
+
passive: true
|
|
195
|
+
}
|
|
196
|
+
});
|
|
197
|
+
}
|
|
153
198
|
}
|
|
154
199
|
unbindMouseEnter = bind(editorContentArea, {
|
|
155
200
|
type: 'mouseenter',
|
|
@@ -74,7 +74,7 @@ var classifyRightMarginPosition = function classifyRightMarginPosition(view, eve
|
|
|
74
74
|
if (event.clientX <= found.rect.right) {
|
|
75
75
|
return null;
|
|
76
76
|
}
|
|
77
|
-
return event.clientX > getRightMarginBoundary(view) ? {
|
|
77
|
+
return event.clientX > getRightMarginBoundary(view) && !expValEqualsNoExposure('cc_maui_remix_button_hover_corridor', 'isEnabled', true) ? {
|
|
78
78
|
type: 'gap'
|
|
79
79
|
} : {
|
|
80
80
|
type: 'active',
|
|
@@ -154,9 +154,8 @@ var processHoverSide = function processHoverSide(view, api) {
|
|
|
154
154
|
return;
|
|
155
155
|
}
|
|
156
156
|
|
|
157
|
-
//
|
|
158
|
-
//
|
|
159
|
-
// only empty margin remains reserved for Rovo in that case.
|
|
157
|
+
// Keep the existing fixed Rovo gap in the control cohort. The treatment uses explicitly marked
|
|
158
|
+
// control surfaces instead, so the rest of the right margin remains hoverable.
|
|
160
159
|
if ((marginZone === null || marginZone === void 0 ? void 0 : marginZone.type) === 'gap' || event.clientX > getRightMarginBoundary(view) && (!blockElement || !expValEqualsNoExposure('cc_maui_remix_button_hover_corridor', 'isEnabled', true))) {
|
|
161
160
|
if (!(state !== null && state !== void 0 && state.isMouseOut)) {
|
|
162
161
|
clearHoverSide(view);
|
|
@@ -2,7 +2,10 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
|
2
2
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
3
3
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
4
4
|
import { bind } from 'bind-event-listener';
|
|
5
|
+
import { isBlockControlsSuppressionTarget } from '@atlaskit/editor-common/block-controls-suppression';
|
|
5
6
|
import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
|
|
7
|
+
import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
|
|
8
|
+
import { UNSAFE_expValNoExposure } from '@atlaskit/platform-feature-experiments/unsafe-exp-val-no-exposure';
|
|
6
9
|
import { PluginKey } from '@atlaskit/editor-prosemirror/state';
|
|
7
10
|
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
|
|
8
11
|
import { RIGHT_MARGIN_ROVO_GAP_PX } from './constants';
|
|
@@ -41,6 +44,15 @@ var isOverActiveClickArea = function isOverActiveClickArea(target, clientX) {
|
|
|
41
44
|
var innerWidth = (_target$ownerDocument = (_target$ownerDocument2 = target.ownerDocument.defaultView) === null || _target$ownerDocument2 === void 0 ? void 0 : _target$ownerDocument2.innerWidth) !== null && _target$ownerDocument !== void 0 ? _target$ownerDocument : Number.POSITIVE_INFINITY;
|
|
42
45
|
return clientX <= innerWidth - RIGHT_MARGIN_ROVO_GAP_PX;
|
|
43
46
|
};
|
|
47
|
+
var isOverTreatmentClickArea = function isOverTreatmentClickArea(target, editorContentArea, clientX) {
|
|
48
|
+
if (!(target instanceof Element) || !(editorContentArea instanceof HTMLElement)) {
|
|
49
|
+
return false;
|
|
50
|
+
}
|
|
51
|
+
if (!target.closest(CLICK_AREA_SELECTOR)) {
|
|
52
|
+
return false;
|
|
53
|
+
}
|
|
54
|
+
return clientX > editorContentArea.getBoundingClientRect().right;
|
|
55
|
+
};
|
|
44
56
|
export var interactionTrackingPluginKey = new PluginKey('interactionTrackingPlugin');
|
|
45
57
|
export var createInteractionTrackingPlugin = function createInteractionTrackingPlugin() {
|
|
46
58
|
var rightSideControlsEnabled = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
|
@@ -113,20 +125,24 @@ export var createInteractionTrackingPlugin = function createInteractionTrackingP
|
|
|
113
125
|
mouseLeaveTimeoutId = null;
|
|
114
126
|
}
|
|
115
127
|
|
|
116
|
-
//
|
|
117
|
-
// (the Rovo gap is excluded so controls still clear there).
|
|
128
|
+
// Preserve the existing hover targets for the control cohort.
|
|
118
129
|
if (rightSideControlsEnabled && (isMovingToBlockControlsArea(event.relatedTarget) || isOverActiveClickArea(event.relatedTarget, event.clientX))) {
|
|
119
130
|
return;
|
|
120
131
|
}
|
|
132
|
+
if (rightSideControlsEnabled && isExperimentEnabled('cc_maui_remix_button_hover_corridor') && isOverTreatmentClickArea(event.relatedTarget, editorContentArea, event.clientX)) {
|
|
133
|
+
return;
|
|
134
|
+
}
|
|
121
135
|
mouseLeaveTimeoutId = setTimeout(function () {
|
|
122
136
|
mouseLeaveTimeoutId = null;
|
|
123
|
-
// Re-check
|
|
124
|
-
// or the active right margin.
|
|
137
|
+
// Re-check the control cohort's existing hover targets after the debounce.
|
|
125
138
|
if (rightSideControlsEnabled && typeof document !== 'undefined') {
|
|
126
139
|
var el = document.elementFromPoint(lastMousePosition.x, lastMousePosition.y);
|
|
127
140
|
if (el && (isMovingToBlockControlsArea(el) || isOverActiveClickArea(el, lastMousePosition.x))) {
|
|
128
141
|
return;
|
|
129
142
|
}
|
|
143
|
+
if (el && isExperimentEnabled('cc_maui_remix_button_hover_corridor') && isOverTreatmentClickArea(el, editorContentArea, lastMousePosition.x)) {
|
|
144
|
+
return;
|
|
145
|
+
}
|
|
130
146
|
}
|
|
131
147
|
handleMouseLeave(view, rightSideControlsEnabled);
|
|
132
148
|
}, MOUSE_LEAVE_DEBOUNCE_MS);
|
|
@@ -137,25 +153,54 @@ export var createInteractionTrackingPlugin = function createInteractionTrackingP
|
|
|
137
153
|
mouseLeaveTimeoutId = null;
|
|
138
154
|
}
|
|
139
155
|
};
|
|
156
|
+
var handleDocumentMouseMove = function handleDocumentMouseMove(event) {
|
|
157
|
+
lastMousePosition = {
|
|
158
|
+
x: event.clientX,
|
|
159
|
+
y: event.clientY
|
|
160
|
+
};
|
|
161
|
+
// Catches block controls in portals that handleDOMEvents.mousemove misses.
|
|
162
|
+
var isOverKnownHoverTarget = (editorContentArea === null || editorContentArea === void 0 ? void 0 : editorContentArea.contains(event.target)) || isMovingToBlockControlsArea(event.target);
|
|
163
|
+
var overClickArea = event.target instanceof Element && !!event.target.closest(CLICK_AREA_SELECTOR);
|
|
164
|
+
if (isOverKnownHoverTarget || overClickArea) {
|
|
165
|
+
handleMouseMove(view, event, rightSideControlsEnabled, api);
|
|
166
|
+
}
|
|
167
|
+
};
|
|
168
|
+
var handleTreatmentDocumentMouseMove = function handleTreatmentDocumentMouseMove(event) {
|
|
169
|
+
if (isBlockControlsSuppressionTarget(event.target)) {
|
|
170
|
+
var _interactionTrackingP;
|
|
171
|
+
lastMousePosition = {
|
|
172
|
+
x: event.clientX,
|
|
173
|
+
y: event.clientY
|
|
174
|
+
};
|
|
175
|
+
cancelScheduledMouseLeave();
|
|
176
|
+
if (!((_interactionTrackingP = interactionTrackingPluginKey.getState(view.state)) !== null && _interactionTrackingP !== void 0 && _interactionTrackingP.isMouseOut)) {
|
|
177
|
+
handleMouseLeave(view, rightSideControlsEnabled);
|
|
178
|
+
}
|
|
179
|
+
return;
|
|
180
|
+
}
|
|
181
|
+
handleDocumentMouseMove(event);
|
|
182
|
+
};
|
|
140
183
|
if (editorContentArea) {
|
|
141
184
|
if (rightSideControlsEnabled && typeof document !== 'undefined') {
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
var overClickArea = event.target instanceof Element && !!event.target.closest(CLICK_AREA_SELECTOR);
|
|
151
|
-
if (editorContentArea.contains(event.target) || isMovingToBlockControlsArea(event.target) || overClickArea) {
|
|
152
|
-
handleMouseMove(view, event, rightSideControlsEnabled, api);
|
|
185
|
+
// RemixButtonDecoration fires exposure when the control is visible; this
|
|
186
|
+
// mount-time split only selects the appropriate interaction listener.
|
|
187
|
+
if (UNSAFE_expValNoExposure('cc_maui_remix_button_hover_corridor', 'isEnabled', false) === true) {
|
|
188
|
+
unbindDocumentMouseMove = bind(document, {
|
|
189
|
+
type: 'mousemove',
|
|
190
|
+
listener: handleTreatmentDocumentMouseMove,
|
|
191
|
+
options: {
|
|
192
|
+
passive: true
|
|
153
193
|
}
|
|
154
|
-
}
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
194
|
+
});
|
|
195
|
+
} else {
|
|
196
|
+
unbindDocumentMouseMove = bind(document, {
|
|
197
|
+
type: 'mousemove',
|
|
198
|
+
listener: handleDocumentMouseMove,
|
|
199
|
+
options: {
|
|
200
|
+
passive: true
|
|
201
|
+
}
|
|
202
|
+
});
|
|
203
|
+
}
|
|
159
204
|
}
|
|
160
205
|
unbindMouseEnter = bind(editorContentArea, {
|
|
161
206
|
type: 'mouseenter',
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/editor-plugin-block-controls",
|
|
3
|
-
"version": "16.0.
|
|
3
|
+
"version": "16.0.2",
|
|
4
4
|
"description": "Block controls plugin for @atlaskit/editor-core",
|
|
5
5
|
"author": "Atlassian Pty Ltd",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -34,7 +34,7 @@
|
|
|
34
34
|
"@atlaskit/editor-plugin-selection": "^15.0.0",
|
|
35
35
|
"@atlaskit/editor-plugin-show-diff": "^13.0.0",
|
|
36
36
|
"@atlaskit/editor-plugin-toolbar": "^12.0.0",
|
|
37
|
-
"@atlaskit/editor-plugin-type-ahead": "^16.
|
|
37
|
+
"@atlaskit/editor-plugin-type-ahead": "^16.1.0",
|
|
38
38
|
"@atlaskit/editor-plugin-user-intent": "^13.0.0",
|
|
39
39
|
"@atlaskit/editor-plugin-width": "^16.0.0",
|
|
40
40
|
"@atlaskit/editor-prosemirror": "^8.0.0",
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
"@atlaskit/pragmatic-drag-and-drop-react-drop-indicator": "^4.1.0",
|
|
51
51
|
"@atlaskit/primitives": "^22.2.0",
|
|
52
52
|
"@atlaskit/theme": "^28.0.0",
|
|
53
|
-
"@atlaskit/tmp-editor-statsig": "^
|
|
53
|
+
"@atlaskit/tmp-editor-statsig": "^148.0.0",
|
|
54
54
|
"@atlaskit/tokens": "^16.7.0",
|
|
55
55
|
"@atlaskit/tooltip": "^24.0.0",
|
|
56
56
|
"@babel/runtime": "^7.0.0",
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
"uuid": "^3.1.0"
|
|
62
62
|
},
|
|
63
63
|
"peerDependencies": {
|
|
64
|
-
"@atlaskit/editor-common": "^119.
|
|
64
|
+
"@atlaskit/editor-common": "^119.5.0",
|
|
65
65
|
"react": "^18.2.0 || ^19.2.0",
|
|
66
66
|
"react-dom": "^18.2.0 || ^19.2.0",
|
|
67
67
|
"react-intl": "^5.25.1 || ^6.0.0 || ^7.0.0"
|