@kiwicom/orbit-components/es/Tooltip/helpers/resolveTooltipArrowAlign.js

Orbit-components is a React component library which provides developers with the easiest possible way of building Kiwi.com’s products.

import { css } from "styled-components";
import { isHorizontal, isVertical } from "./isPosition";
import { isAlignCenter, isAlignEnd, isAlignStart } from "./isAlign";
import { TOOLTIP_ARROW_SIZE, TOOLTIP_PADDING } from "../consts"; // TODO: use tokens for 12px and 7px - paddings and sizeTooltipArrow

const resolveTooltipArrowAlign = ({
  position,
  align,
  tooltipWidth,
  tooltipHeight
}) => {
  if (isVertical(position)) {
    if (isAlignCenter(align)) {
      return css(["left:", "px;"], Math.floor(tooltipWidth / 2 - parseFloat(TOOLTIP_ARROW_SIZE)));
    }

    if (isAlignStart(align)) {
      return css(["left:", "px;"], parseFloat(TOOLTIP_PADDING));
    }

    if (isAlignEnd(align)) {
      return css(["right:", "px;"], parseFloat(TOOLTIP_PADDING));
    }
  } else if (isHorizontal(position)) {
    if (isAlignCenter(align)) {
      return css(["top:", "px;"], Math.floor(tooltipHeight / 2 - parseFloat(TOOLTIP_ARROW_SIZE)));
    }

    if (isAlignStart(align)) {
      return css(["top:", "px;"], parseFloat(TOOLTIP_PADDING));
    }

    if (isAlignEnd(align)) {
      return css(["bottom:", "px;"], parseFloat(TOOLTIP_PADDING));
    }
  }

  return null;
};

export default resolveTooltipArrowAlign;