kopia lustrzana https://gitlab.com/soapbox-pub/soapbox
46 wiersze
1.4 KiB
TypeScript
46 wiersze
1.4 KiB
TypeScript
/**
|
|
* This source code is derived from code from Meta Platforms, Inc.
|
|
* and affiliates, licensed under the MIT license located in the
|
|
* LICENSE file in the /src/features/compose/editor directory.
|
|
*/
|
|
|
|
const VERTICAL_GAP = 10;
|
|
const HORIZONTAL_OFFSET = 5;
|
|
|
|
export const setFloatingElemPosition = (
|
|
targetRect: ClientRect | null,
|
|
floatingElem: HTMLElement,
|
|
anchorElem: HTMLElement,
|
|
verticalGap: number = VERTICAL_GAP,
|
|
horizontalOffset: number = HORIZONTAL_OFFSET,
|
|
): void => {
|
|
const scrollerElem = anchorElem.parentElement;
|
|
|
|
if (targetRect === null || !scrollerElem) {
|
|
floatingElem.style.opacity = '0';
|
|
floatingElem.style.transform = 'translate(-10000px, -10000px)';
|
|
return;
|
|
}
|
|
|
|
const floatingElemRect = floatingElem.getBoundingClientRect();
|
|
const anchorElementRect = anchorElem.getBoundingClientRect();
|
|
const editorScrollerRect = scrollerElem.getBoundingClientRect();
|
|
|
|
let top = targetRect.top - floatingElemRect.height - verticalGap;
|
|
let left = targetRect.left - horizontalOffset;
|
|
|
|
if (top < editorScrollerRect.top) {
|
|
top += floatingElemRect.height + targetRect.height + verticalGap * 2;
|
|
}
|
|
|
|
if (left + floatingElemRect.width > editorScrollerRect.right) {
|
|
left = editorScrollerRect.right - floatingElemRect.width - horizontalOffset;
|
|
}
|
|
|
|
top -= anchorElementRect.top;
|
|
left -= anchorElementRect.left;
|
|
|
|
floatingElem.style.opacity = '1';
|
|
floatingElem.style.transform = `translate(${left}px, ${top}px)`;
|
|
};
|