@nguyentc21/react-native-tooltip
Version:
Simple tooltip for React native app
51 lines • 2.49 kB
JavaScript
export default params => {
const {
tooltipContentLayout,
targetContentLayout,
dimension,
placement,
borderRadius,
safeAreaInsets
} = params;
const {
width,
height
} = dimension;
const minSidePadding = borderRadius + 8;
const {
pageX,
pageY
} = targetContentLayout;
let finalPlacement = placement;
const topFreeSpace = pageY - safeAreaInsets.top;
const bottomFreeSpace = height - pageY - targetContentLayout.height - safeAreaInsets.bottom;
const leftFreeSpace = pageX - safeAreaInsets.left;
const rightFreeSpace = width - pageX - targetContentLayout.width - safeAreaInsets.right;
if (placement === 'top' || placement === 'bottom') {
const smallerSideFreeSpace = leftFreeSpace < rightFreeSpace ? leftFreeSpace : rightFreeSpace;
const subFreeSpace = smallerSideFreeSpace + targetContentLayout.width * 0.5;
if (subFreeSpace < minSidePadding) {
finalPlacement = leftFreeSpace < rightFreeSpace ? 'right' : 'left';
} else {
if (placement === 'top' && tooltipContentLayout !== null && tooltipContentLayout !== void 0 && tooltipContentLayout.height && topFreeSpace < tooltipContentLayout.height && topFreeSpace < bottomFreeSpace) {
finalPlacement = 'bottom';
} else if (placement === 'bottom' && tooltipContentLayout !== null && tooltipContentLayout !== void 0 && tooltipContentLayout.height && bottomFreeSpace < tooltipContentLayout.height && bottomFreeSpace < topFreeSpace) {
finalPlacement = 'top';
}
}
} else if (placement === 'left' || placement === 'right') {
const smallerSideFreeSpace = topFreeSpace < bottomFreeSpace ? topFreeSpace : bottomFreeSpace;
const subFreeSpace = smallerSideFreeSpace + targetContentLayout.height * 0.5;
if (subFreeSpace < minSidePadding) {
finalPlacement = topFreeSpace < bottomFreeSpace ? 'bottom' : 'top';
} else {
if (placement === 'left' && tooltipContentLayout !== null && tooltipContentLayout !== void 0 && tooltipContentLayout.width && leftFreeSpace < tooltipContentLayout.width && leftFreeSpace < rightFreeSpace) {
finalPlacement = 'right';
} else if (placement === 'right' && tooltipContentLayout !== null && tooltipContentLayout !== void 0 && tooltipContentLayout.width && rightFreeSpace < tooltipContentLayout.width && rightFreeSpace < leftFreeSpace) {
finalPlacement = 'left';
}
}
}
return finalPlacement;
};
//# sourceMappingURL=findTooltipPlacement.js.map