@atlaskit/editor-plugin-block-controls
Version:
Block controls plugin for @atlaskit/editor-core
59 lines (58 loc) • 3.43 kB
JavaScript
import { DRAG_HANDLE_SELECTOR } from '@atlaskit/editor-common/styles';
import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
export const handleMouseDown = api => (view, event) => {
if (!(event.target instanceof HTMLElement)) {
return false;
}
if (!view.editable) {
const targetPos = view.posAtDOM(event.target, 0);
// always fetch top level position for mouseDown to avoid drag handle positions being incorrect
const rootPos = view.state.doc.resolve(targetPos).before(1);
const rootNode = view.state.doc.nodeAt(rootPos);
if (!rootNode) {
return false;
}
if (expValEquals('platform_editor_native_anchor_with_dnd', 'isEnabled', true)) {
var _rootNode$type$name, _rootNode$type$name2;
const anchorName = api === null || api === void 0 ? void 0 : api.core.actions.getAnchorIdForNode(rootNode, rootPos);
// don't show the handles if we can't find an anchor
if (!anchorName) {
return false;
}
api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.showDragHandleAt(rootPos, anchorName, (_rootNode$type$name = rootNode.type.name) !== null && _rootNode$type$name !== void 0 ? _rootNode$type$name : '', undefined, rootPos, anchorName, (_rootNode$type$name2 = rootNode.type.name) !== null && _rootNode$type$name2 !== void 0 ? _rootNode$type$name2 : ''));
} else {
var _rootNode$type$name3, _rootNode$type$name4;
api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.showDragHandleAt(rootPos, '', (_rootNode$type$name3 = rootNode.type.name) !== null && _rootNode$type$name3 !== void 0 ? _rootNode$type$name3 : '', undefined, rootPos, '', (_rootNode$type$name4 = rootNode.type.name) !== null && _rootNode$type$name4 !== void 0 ? _rootNode$type$name4 : ''));
}
} else {
const isDragHandle = event.target.closest(editorExperiment('platform_editor_block_menu', true) ? DRAG_HANDLE_SELECTOR : '[data-editor-block-ctrl-drag-handle]') !== null;
api === null || api === void 0 ? void 0 : api.core.actions.execute(({
tr
}) => {
api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(isDragHandle)({
tr
});
/**
* When block menu is enabled, reset intent back to 'default' as editor-plugin-block-menu sets the user intent to 'blockMenuOpen', and setting here
* causes flickering as this runs before editor-plugin-block-menu.
*/
if (editorExperiment('platform_editor_block_menu', true)) {
// if target is drag handle, block menu will be opened
if (!isDragHandle) {
var _api$userIntent;
api === null || api === void 0 ? void 0 : (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.commands.setCurrentUserIntent('default')({
tr
});
}
} else {
var _api$userIntent2;
(_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 ? void 0 : _api$userIntent2.commands.setCurrentUserIntent(isDragHandle ? 'dragHandleSelected' : 'default')({
tr
});
}
return tr;
});
}
return false;
};