@atlaskit/editor-plugin-block-controls
Version:
Block controls plugin for @atlaskit/editor-core
45 lines (42 loc) • 2.78 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.getRightPositionForRootElement = exports.getLeftPositionForRootElement = void 0;
var _consts = require("../../ui/consts");
// Adapted from `src/pm-plugins/utils/drag-handle-positions.ts`
// CHANGES - removed parentNodeType, use only for positioning widgets for top level element
// CHANGES - removed layout
// CHANGES - added overrides for constants for widget dimensions
var getLeftPositionForRootElement = exports.getLeftPositionForRootElement = function getLeftPositionForRootElement(dom, nodeType, widgetDimensions, innerContainer, macroInteractionUpdates) {
if (!dom) {
return 'auto';
}
if (!innerContainer) {
return "".concat(dom.offsetLeft - (0, _consts.rootElementGap)(nodeType) - widgetDimensions.width, "px");
}
// There is a showMacroInteractionDesignUpdates prop in extension node wrapper that can add a relative span under the top level div
// We need to adjust the left offset position of the drag handle to account for the relative span
var relativeSpan = macroInteractionUpdates ? dom.querySelector('span.relative') : null;
var leftAdjustment = relativeSpan ? relativeSpan.offsetLeft : 0;
return getComputedStyle(innerContainer).transform === 'none' ? "".concat(innerContainer.offsetLeft + leftAdjustment - (0, _consts.rootElementGap)(nodeType) - widgetDimensions.width, "px") : "".concat(innerContainer.offsetLeft + leftAdjustment - innerContainer.offsetWidth / 2 - (0, _consts.rootElementGap)(nodeType) - widgetDimensions.width, "px");
};
/**
* Left position (in px) for a widget on the right edge of the block.
* Mirrors getLeftPositionForRootElement: when innerContainer is set (table, mediaSingle,
* extension, blockCard, embedCard) use it for the right edge so the button aligns to the
* content box and does not overlap; otherwise use the block (dom).
*/
var getRightPositionForRootElement = exports.getRightPositionForRootElement = function getRightPositionForRootElement(dom, nodeType, widgetDimensions, innerContainer, macroInteractionUpdates) {
if (!dom) {
return 'auto';
}
var relativeSpan = macroInteractionUpdates ? dom.querySelector('span.relative') : null;
var leftAdjustment = relativeSpan ? relativeSpan.offsetLeft : 0;
var gap = (0, _consts.rootElementGap)(nodeType);
var width = widgetDimensions.width;
if (!innerContainer) {
return "".concat(dom.offsetLeft + leftAdjustment + dom.offsetWidth - gap - width, "px");
}
return getComputedStyle(innerContainer).transform === 'none' ? "".concat(innerContainer.offsetLeft + leftAdjustment + innerContainer.offsetWidth - gap - width, "px") : "".concat(innerContainer.offsetLeft + leftAdjustment + innerContainer.offsetWidth / 2 - gap - width, "px");
};