/* @flow */
/** @jsx node */

import {
  node,
  type ElementNode,
  type ComponentNode,
} from "@krakenjs/jsx-pragmatic/src";

import { getLogoCDNUrl, SVGLogo, type SVGLogoProps } from "../../lib";
import { MARK } from "../../constants";

export const getPaylaterMarkRebrandSVG = (): ElementNode => {
  return (
    <svg
      width="44"
      height="29"
      viewBox="0 0 44 29"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <path d="M43.2027 2.6488V13.3246H40.7852V2.6488H43.2027Z" fill="black" />
      <path
        d="M39.8921 6.24872V13.3394H37.7425V12.7292C37.4713 12.9945 37.1607 13.1968 36.8156 13.3394C36.4688 13.4903 36.0941 13.5666 35.6915 13.5666C35.1853 13.5666 34.7169 13.4721 34.2863 13.283C33.8558 13.084 33.4811 12.8154 33.1622 12.4754C32.8434 12.1355 32.5903 11.7375 32.403 11.2848C32.2255 10.8222 32.1367 10.3247 32.1367 9.79571C32.1367 9.26673 32.2255 8.77423 32.403 8.32153C32.5903 7.85888 32.8434 7.45592 33.1622 7.11598C33.4811 6.77604 33.8558 6.51072 34.2863 6.32168C34.7169 6.12269 35.1853 6.02319 35.6915 6.02319C36.0941 6.02319 36.4688 6.09947 36.8156 6.25037C37.1624 6.39298 37.4713 6.59529 37.7425 6.86061V6.25037H39.8921V6.24872ZM36.0826 11.4108C36.5231 11.4108 36.883 11.2599 37.164 10.9565C37.4549 10.6547 37.5995 10.2667 37.5995 9.79405C37.5995 9.32145 37.4549 8.93342 37.164 8.63162C36.883 8.32982 36.5214 8.17726 36.0826 8.17726C35.6438 8.17726 35.2773 8.32816 34.9864 8.63162C34.7054 8.93342 34.5641 9.32145 34.5641 9.79405C34.5641 10.2667 34.7054 10.6547 34.9864 10.9565C35.2773 11.2583 35.6422 11.4108 36.0826 11.4108Z"
        fill="black"
      />
      <path
        d="M28.6896 2.64709C29.3272 2.64709 29.8696 2.73664 30.3199 2.91573C30.7702 3.09482 31.1498 3.34522 31.4588 3.66692C31.7776 3.99857 32.0258 4.37665 32.2033 4.80116C32.3807 5.22733 32.4695 5.68501 32.4695 6.17751C32.4695 6.67001 32.3807 7.1277 32.2033 7.55386C32.0258 7.98003 31.7776 8.35811 31.4588 8.6881C31.1498 9.0098 30.7702 9.2602 30.3199 9.43929C29.8696 9.61838 29.3272 9.70793 28.6896 9.70793H27.5227V13.3378H25.0625V2.64709H28.6879H28.6896ZM28.3379 7.51074C28.6666 7.51074 28.918 7.47758 29.0971 7.41125C29.2845 7.33497 29.439 7.24045 29.5606 7.12769C29.8137 6.89056 29.9402 6.57383 29.9402 6.17751C29.9402 5.78119 29.8137 5.46446 29.5606 5.22733C29.439 5.11457 29.2845 5.02338 29.0971 4.9587C28.9197 4.88242 28.6666 4.84594 28.3379 4.84594H27.5227V7.5124H28.3379V7.51074Z"
        fill="black"
      />
      <path
        d="M16.0016 6.2489H18.6722L20.485 9.65163H20.5129L22.1284 6.2489H24.6018L19.3033 16.9413H16.8431L19.2606 12.0495L16 6.2489H16.0016Z"
        fill="black"
      />
      <path
        d="M15.5249 6.24872V13.3394H13.3753V12.7292C13.1041 12.9945 12.7935 13.1968 12.4484 13.3394C12.1016 13.4903 11.7269 13.5666 11.3243 13.5666C10.8181 13.5666 10.3497 13.4721 9.91915 13.283C9.48857 13.084 9.11387 12.8154 8.79504 12.4754C8.47621 12.1355 8.22312 11.7375 8.03577 11.2848C7.85828 10.8222 7.76953 10.3247 7.76953 9.79571C7.76953 9.26673 7.85828 8.77423 8.03577 8.32153C8.22312 7.85888 8.47621 7.45592 8.79504 7.11598C9.11387 6.77604 9.48857 6.51072 9.91915 6.32168C10.3497 6.12269 10.8181 6.02319 11.3243 6.02319C11.7269 6.02319 12.1016 6.09947 12.4484 6.25037C12.7952 6.39298 13.1041 6.59529 13.3753 6.86061V6.25037H15.5249V6.24872ZM11.7154 11.4108C12.1559 11.4108 12.5158 11.2599 12.7985 10.9565C13.0894 10.6547 13.234 10.2667 13.234 9.79405C13.234 9.32145 13.0894 8.93342 12.7985 8.63162C12.5174 8.32982 12.1559 8.17726 11.7154 8.17726C11.275 8.17726 10.9101 8.32816 10.6193 8.63162C10.3382 8.93342 10.1969 9.32145 10.1969 9.79405C10.1969 10.2667 10.3382 10.6547 10.6193 10.9565C10.9101 11.2583 11.275 11.4108 11.7154 11.4108Z"
        fill="black"
      />
      <path
        d="M4.42231 2.64709C5.05996 2.64709 5.6023 2.73664 6.0526 2.91573C6.5029 3.09482 6.88254 3.34522 7.19151 3.66692C7.51033 3.99857 7.75849 4.37665 7.93598 4.80116C8.11348 5.22733 8.20222 5.68501 8.20222 6.17751C8.20222 6.67001 8.11348 7.1277 7.93598 7.55386C7.75849 7.98003 7.51033 8.35811 7.19151 8.6881C6.88254 9.0098 6.5029 9.2602 6.0526 9.43929C5.6023 9.61838 5.05996 9.70793 4.42231 9.70793H3.25546V13.3378H0.796875V2.64709H4.42231ZM4.07225 7.51074C4.40094 7.51074 4.65239 7.47758 4.83152 7.41125C5.01888 7.33497 5.17336 7.24045 5.29497 7.12769C5.54806 6.89056 5.67461 6.57383 5.67461 6.17751C5.67461 5.78119 5.54806 5.46446 5.29497 5.22733C5.17336 5.11457 5.01888 5.02338 4.83152 4.9587C4.65403 4.88242 4.40094 4.84594 4.07225 4.84594H3.25711V7.5124H4.07225V7.51074Z"
        fill="black"
      />
      <path
        d="M9.4502 26V19.214H11.1512C11.9072 19.214 12.4022 19.43 12.7622 19.799C13.1222 20.15 13.3382 20.654 13.3382 21.221C13.3382 21.779 13.1222 22.283 12.7622 22.643C12.4022 23.003 11.9072 23.219 11.1512 23.219H10.4132V26H9.4502ZM10.4132 22.319H11.0612C11.5562 22.319 11.8262 22.202 12.0242 21.995C12.2132 21.806 12.3392 21.527 12.3392 21.221C12.3392 20.906 12.2132 20.627 12.0242 20.438C11.8262 20.231 11.5562 20.123 11.0612 20.123H10.4132V22.319ZM15.3472 26.108C14.1142 26.108 13.1692 25.1 13.1692 23.84C13.1692 22.58 14.1142 21.572 15.3472 21.572C15.8872 21.572 16.3642 21.77 16.7242 22.112V21.68H17.5972V26H16.7242V25.568C16.3642 25.91 15.8872 26.108 15.3472 26.108ZM15.4462 25.226C16.2022 25.226 16.7782 24.632 16.7782 23.84C16.7782 23.048 16.2022 22.454 15.4462 22.454C14.6992 22.454 14.1232 23.048 14.1232 23.84C14.1232 24.632 14.6992 25.226 15.4462 25.226ZM18.4782 28.286L19.9812 25.307L17.9562 21.68H18.9912L20.4672 24.353H20.4762L21.7902 21.68H22.7802L19.4682 28.286H18.4782ZM25.014 26V19.214H25.977V25.091H28.047V26H25.014ZM30.3221 26.108C29.0891 26.108 28.1441 25.1 28.1441 23.84C28.1441 22.58 29.0891 21.572 30.3221 21.572C30.8621 21.572 31.3391 21.77 31.6991 22.112V21.68H32.5721V26H31.6991V25.568C31.3391 25.91 30.8621 26.108 30.3221 26.108ZM30.4211 25.226C31.1771 25.226 31.7531 24.632 31.7531 23.84C31.7531 23.048 31.1771 22.454 30.4211 22.454C29.6741 22.454 29.0981 23.048 29.0981 23.84C29.0981 24.632 29.6741 25.226 30.4211 25.226ZM33.9559 26V22.499H33.1639V21.68H33.9559V20.033H34.8739V21.68H35.8009V22.499H34.8739V26H33.9559ZM38.1356 26.108C36.8756 26.108 35.9216 25.109 35.9216 23.849C35.9216 22.553 36.8216 21.572 38.0276 21.572C39.2336 21.572 40.1246 22.553 40.1246 23.84C40.1246 23.948 40.1156 24.065 40.1066 24.173H36.8576C36.9476 24.794 37.4786 25.244 38.1446 25.244C38.6486 25.244 39.0716 24.983 39.2876 24.587L40.0436 25.028C39.6566 25.685 38.9636 26.108 38.1356 26.108ZM36.8576 23.426H39.1796C39.1256 22.832 38.6666 22.4 38.0366 22.4C37.3976 22.4 36.9206 22.832 36.8576 23.426ZM40.8379 26V21.68H41.7109V22.229C41.7469 22.175 41.7919 22.13 41.8369 22.085C42.1159 21.806 42.5119 21.635 42.9619 21.635C43.0609 21.635 43.1509 21.644 43.2499 21.653V22.526C43.1509 22.517 43.0609 22.508 42.9529 22.508C42.5929 22.508 42.2959 22.634 42.0889 22.85C41.8819 23.057 41.7559 23.336 41.7559 23.84V26H40.8379Z"
        fill="black"
      />
    </svg>
  );
};

export function PaylaterMarkRebrandExternalImage({
  ...props
}: {||}): ComponentNode<SVGLogoProps> {
  const cdnUrl = getLogoCDNUrl(MARK.PAYLATER_REBRAND);

  return (
    <SVGLogo
      {...props}
      name={MARK.PAYLATER_REBRAND}
      cdnUrl={cdnUrl}
      alt="PayPal PayLater"
      role="presentation"
    />
  );
}

export function PaylaterMarkRebrandInlineSVG({
  ...props
}: {||}): ComponentNode<SVGLogoProps> {
  const svg = getPaylaterMarkRebrandSVG();

  return (
    <SVGLogo
      {...props}
      name={MARK.PAYLATER_REBRAND}
      render={() => {
        return svg;
      }}
      alt="PayPal PayLater"
      role="presentation"
    />
  );
}

export const PaylaterMarkRebrand = PaylaterMarkRebrandInlineSVG;
