@atlaskit/editor-plugin-breakout
Version:
Breakout plugin for @atlaskit/editor-core
101 lines (99 loc) • 5.52 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.handleKeyDown = void 0;
var _browser = require("@atlaskit/editor-common/browser");
var _utils = require("@atlaskit/editor-common/utils");
var _state = require("@atlaskit/editor-prosemirror/state");
var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
var _setBreakoutWidth = require("../editor-commands/set-breakout-width");
var _resizeWidth = require("./resize-width");
var KEYBOARD_RESIZE_STEP = 10;
var getKeyboardResizeWidth = function getKeyboardResizeWidth(currentWidth, step, api) {
var containerWidth = (0, _resizeWidth.getResizeContainerWidth)(api);
var resizeStartWidth = Math.min(currentWidth, containerWidth);
return (0, _resizeWidth.clampWidthToResizeBounds)(resizeStartWidth + step, containerWidth);
};
var getAncestorResizableNode = function getAncestorResizableNode(view, breakoutResizableNodes) {
var selection = view.state.selection;
if (selection instanceof _state.NodeSelection) {
var selectedNode = selection.node;
if (breakoutResizableNodes.has(selectedNode.type)) {
return {
node: selectedNode,
pos: selection.$from.pos
};
}
} else if (selection instanceof _state.TextSelection) {
var node = null;
var nodePos = null;
// only top level nodes are resizable
var resolvedPos = view.state.doc.resolve(selection.$from.pos);
var currentNode = resolvedPos.node(1);
if (breakoutResizableNodes.has(currentNode.type)) {
node = currentNode;
nodePos = resolvedPos.before(1);
return {
node: node,
pos: nodePos
};
}
}
return null;
};
var handleKeyDown = exports.handleKeyDown = function handleKeyDown(api) {
return function (view, event) {
var browser = (0, _browser.getBrowserInfo)();
var metaKey = browser.mac ? event.metaKey : event.ctrlKey;
var isBracketKey = event.code === 'BracketRight' || event.code === 'BracketLeft';
if (metaKey && event.altKey && isBracketKey) {
var _view$state$schema$no = view.state.schema.nodes,
expand = _view$state$schema$no.expand,
codeBlock = _view$state$schema$no.codeBlock,
layoutSection = _view$state$schema$no.layoutSection,
rule = _view$state$schema$no.rule,
panel = _view$state$schema$no.panel,
panel_c1 = _view$state$schema$no.panel_c1;
var breakoutResizableNodes = new Set();
if ((0, _isExperimentEnabled.isExperimentEnabled)('platform_editor_lovability_resize_extensions')) {
breakoutResizableNodes = (0, _utils.getBreakoutResizableNodeTypesNew)(view.state.schema);
} else {
breakoutResizableNodes = (0, _experiments.editorExperiment)('platform_synced_block', true) ? (0, _utils.getBreakoutResizableNodeTypes)(view.state.schema, (0, _expValEquals.expValEquals)('platform_editor_lovability_resize_dividers_panels', 'isEnabled', true)) : (0, _expValEquals.expValEquals)('platform_editor_lovability_resize_dividers_panels', 'isEnabled', true) ? new Set([expand, codeBlock, layoutSection, rule, panel, panel_c1]) : new Set([expand, codeBlock, layoutSection]);
}
var result = getAncestorResizableNode(view, breakoutResizableNodes);
if (result) {
var node = result.node,
pos = result.pos;
var breakoutMark = node === null || node === void 0 ? void 0 : node.marks.find(function (mark) {
return mark.type.name === 'breakout';
});
if (breakoutMark) {
var step = event.code === 'BracketRight' ? KEYBOARD_RESIZE_STEP : -KEYBOARD_RESIZE_STEP;
if ((0, _expValEquals.expValEquals)('platform_editor_lovability_breakout_resizing_fixes', 'isEnabled', true)) {
var newWidth = getKeyboardResizeWidth(breakoutMark.attrs.width, step, api);
if (newWidth !== breakoutMark.attrs.width) {
var _api$editorViewMode;
var isEditMode = (api === null || api === void 0 || (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 || (_api$editorViewMode = _api$editorViewMode.sharedState.currentState()) === null || _api$editorViewMode === void 0 ? void 0 : _api$editorViewMode.mode) === 'edit';
(0, _setBreakoutWidth.setBreakoutWidth)(newWidth, breakoutMark.attrs.mode, pos, isEditMode)(view.state, view.dispatch);
view.focus();
}
} else {
var _newWidth = breakoutMark.attrs.width + step;
if (_newWidth < _editorSharedStyles.akEditorFullWidthLayoutWidth && _newWidth > _editorSharedStyles.akEditorDefaultLayoutWidth) {
var _api$editorViewMode2;
var _isEditMode = (api === null || api === void 0 || (_api$editorViewMode2 = api.editorViewMode) === null || _api$editorViewMode2 === void 0 || (_api$editorViewMode2 = _api$editorViewMode2.sharedState.currentState()) === null || _api$editorViewMode2 === void 0 ? void 0 : _api$editorViewMode2.mode) === 'edit';
(0, _setBreakoutWidth.setBreakoutWidth)(breakoutMark.attrs.width + step, breakoutMark.attrs.mode, pos, _isEditMode)(view.state, view.dispatch);
view.focus();
}
}
return true;
}
}
}
return false;
};
};