@kiwicom/orbit-components/lib/primitives/TooltipPrimitive/helpers/resolveArrow.js

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

"use strict";

exports.__esModule = true;
exports.resolveColor = exports.resolveArrowStyle = exports.resolveArrowPlacement = void 0;

var _styledComponents = require("styled-components");

const resolveColor = ({
  error,
  help,
  theme
}) => {
  if (error) return theme.orbit.paletteRedNormal;
  if (help) return theme.orbit.paletteBlueNormal;
  return theme.orbit.paletteInkNormal;
};

exports.resolveColor = resolveColor;
const BORDER_SIZE = 6;

const resolveArrowPlacement = ({
  placement,
  theme
}) => {
  const horizontalPlacement = theme.rtl ? `${BORDER_SIZE}px` : `-${BORDER_SIZE}px`;

  if (placement) {
    if (placement.includes("top")) {
      return (0, _styledComponents.css)(["left:", ";bottom:0;"], horizontalPlacement);
    }

    if (placement.includes("left")) {
      return (0, _styledComponents.css)(["top:-", "px;right:", ";"], BORDER_SIZE, theme.rtl ? `-${BORDER_SIZE}px` : `1px`);
    }

    if (placement.includes("right")) {
      return (0, _styledComponents.css)(["top:-", "px;left:", ";"], BORDER_SIZE, theme.rtl ? `0px` : `-${BORDER_SIZE}px`);
    }

    return (0, _styledComponents.css)(["left:", ";top:-", "px;"], horizontalPlacement, BORDER_SIZE);
  }

  return null;
};

exports.resolveArrowPlacement = resolveArrowPlacement;

const resolveArrowStyle = ({
  placement,
  theme,
  error,
  help
}) => {
  if (placement) {
    if (placement.includes("top")) {
      return (0, _styledComponents.css)(["border-width:", "px ", "px 0 ", "px;border-color:", " transparent transparent transparent;"], BORDER_SIZE, BORDER_SIZE, BORDER_SIZE, resolveColor({
        theme,
        error,
        help
      }));
    }

    if (placement.includes("left")) {
      return (0, _styledComponents.css)(["border-width:", "px 0 ", "px ", "px;border-color:transparent transparent transparent ", ";"], BORDER_SIZE, BORDER_SIZE, BORDER_SIZE, resolveColor({
        theme,
        error,
        help
      }));
    }

    if (placement.includes("right")) {
      return (0, _styledComponents.css)(["border-width:", "px ", "px ", "px 0;border-color:transparent ", " transparent transparent;"], BORDER_SIZE, BORDER_SIZE, BORDER_SIZE, resolveColor({
        theme,
        error,
        help
      }));
    }

    return (0, _styledComponents.css)(["border-width:0 ", "px ", "px ", "px;border-color:transparent transparent ", " transparent;"], BORDER_SIZE, BORDER_SIZE, BORDER_SIZE, resolveColor({
      theme,
      error,
      help
    }));
  }

  return null;
};

exports.resolveArrowStyle = resolveArrowStyle;