/* @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 getCreditMarkRebrandSVG = (): ElementNode => {
  return (
    <svg
      width="44"
      height="29"
      viewBox="0 0 44 29"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <g clip-path="url(#clip0_4039_58599)">
        <path
          d="M43.2027 3.6488V14.3246H40.7852V3.6488H43.2027Z"
          fill="black"
        />
        <path
          d="M39.8921 7.24872V14.3394H37.7425V13.7292C37.4713 13.9945 37.1607 14.1968 36.8156 14.3394C36.4688 14.4903 36.0941 14.5666 35.6915 14.5666C35.1853 14.5666 34.7169 14.4721 34.2863 14.283C33.8558 14.084 33.4811 13.8154 33.1622 13.4754C32.8434 13.1355 32.5903 12.7375 32.403 12.2848C32.2255 11.8222 32.1367 11.3247 32.1367 10.7957C32.1367 10.2667 32.2255 9.77423 32.403 9.32153C32.5903 8.85888 32.8434 8.45592 33.1622 8.11598C33.4811 7.77604 33.8558 7.51072 34.2863 7.32168C34.7169 7.12269 35.1853 7.02319 35.6915 7.02319C36.0941 7.02319 36.4688 7.09947 36.8156 7.25037C37.1624 7.39298 37.4713 7.59529 37.7425 7.86061V7.25037H39.8921V7.24872ZM36.0826 12.4108C36.5231 12.4108 36.883 12.2599 37.164 11.9565C37.4549 11.6547 37.5995 11.2667 37.5995 10.7941C37.5995 10.3215 37.4549 9.93342 37.164 9.63162C36.883 9.32982 36.5214 9.17726 36.0826 9.17726C35.6438 9.17726 35.2773 9.32816 34.9864 9.63162C34.7054 9.93342 34.5641 10.3215 34.5641 10.7941C34.5641 11.2667 34.7054 11.6547 34.9864 11.9565C35.2773 12.2583 35.6422 12.4108 36.0826 12.4108Z"
          fill="black"
        />
        <path
          d="M28.6896 3.64709C29.3272 3.64709 29.8696 3.73664 30.3199 3.91573C30.7702 4.09482 31.1498 4.34522 31.4588 4.66692C31.7776 4.99857 32.0258 5.37665 32.2033 5.80116C32.3807 6.22733 32.4695 6.68501 32.4695 7.17751C32.4695 7.67001 32.3807 8.1277 32.2033 8.55386C32.0258 8.98003 31.7776 9.35811 31.4588 9.6881C31.1498 10.0098 30.7702 10.2602 30.3199 10.4393C29.8696 10.6184 29.3272 10.7079 28.6896 10.7079H27.5227V14.3378H25.0625V3.64709H28.6879H28.6896ZM28.3379 8.51074C28.6666 8.51074 28.918 8.47758 29.0971 8.41125C29.2845 8.33497 29.439 8.24045 29.5606 8.12769C29.8137 7.89056 29.9402 7.57383 29.9402 7.17751C29.9402 6.78119 29.8137 6.46446 29.5606 6.22733C29.439 6.11457 29.2845 6.02338 29.0971 5.9587C28.9197 5.88242 28.6666 5.84594 28.3379 5.84594H27.5227V8.5124H28.3379V8.51074Z"
          fill="black"
        />
        <path
          d="M16.0016 7.2489H18.6722L20.485 10.6516H20.5129L22.1284 7.2489H24.6018L19.3033 17.9413H16.8431L19.2606 13.0495L16 7.2489H16.0016Z"
          fill="black"
        />
        <path
          d="M15.5249 7.24872V14.3394H13.3753V13.7292C13.1041 13.9945 12.7935 14.1968 12.4484 14.3394C12.1016 14.4903 11.7269 14.5666 11.3243 14.5666C10.8181 14.5666 10.3497 14.4721 9.91915 14.283C9.48857 14.084 9.11387 13.8154 8.79504 13.4754C8.47621 13.1355 8.22312 12.7375 8.03577 12.2848C7.85828 11.8222 7.76953 11.3247 7.76953 10.7957C7.76953 10.2667 7.85828 9.77423 8.03577 9.32153C8.22312 8.85888 8.47621 8.45592 8.79504 8.11598C9.11387 7.77604 9.48857 7.51072 9.91915 7.32168C10.3497 7.12269 10.8181 7.02319 11.3243 7.02319C11.7269 7.02319 12.1016 7.09947 12.4484 7.25037C12.7952 7.39298 13.1041 7.59529 13.3753 7.86061V7.25037H15.5249V7.24872ZM11.7154 12.4108C12.1559 12.4108 12.5158 12.2599 12.7985 11.9565C13.0894 11.6547 13.234 11.2667 13.234 10.7941C13.234 10.3215 13.0894 9.93342 12.7985 9.63162C12.5174 9.32982 12.1559 9.17726 11.7154 9.17726C11.275 9.17726 10.9101 9.32816 10.6193 9.63162C10.3382 9.93342 10.1969 10.3215 10.1969 10.7941C10.1969 11.2667 10.3382 11.6547 10.6193 11.9565C10.9101 12.2583 11.275 12.4108 11.7154 12.4108Z"
          fill="black"
        />
        <path
          d="M4.42231 3.64709C5.05996 3.64709 5.6023 3.73664 6.0526 3.91573C6.5029 4.09482 6.88254 4.34522 7.19151 4.66692C7.51033 4.99857 7.75849 5.37665 7.93598 5.80116C8.11348 6.22733 8.20222 6.68501 8.20222 7.17751C8.20222 7.67001 8.11348 8.1277 7.93598 8.55386C7.75849 8.98003 7.51033 9.35811 7.19151 9.6881C6.88254 10.0098 6.5029 10.2602 6.0526 10.4393C5.6023 10.6184 5.05996 10.7079 4.42231 10.7079H3.25546V14.3378H0.796875V3.64709H4.42231ZM4.07225 8.51074C4.40094 8.51074 4.65239 8.47758 4.83152 8.41125C5.01888 8.33497 5.17336 8.24045 5.29497 8.12769C5.54806 7.89056 5.67461 7.57383 5.67461 7.17751C5.67461 6.78119 5.54806 6.46446 5.29497 6.22733C5.17336 6.11457 5.01888 6.02338 4.83152 5.9587C4.65403 5.88242 4.40094 5.84594 4.07225 5.84594H3.25711V8.5124H4.07225V8.51074Z"
          fill="black"
        />
        <path
          d="M41.5816 26.8921V23.3888H40.7891V22.5693H41.5816V20.9213H42.5002V22.5693H43.4277V23.3888H42.5002V26.8921H41.5816Z"
          fill="black"
        />
        <path
          d="M39.4156 21.9126C39.0733 21.9126 38.7852 21.6154 38.7852 21.2822C38.7852 20.9399 39.0733 20.6608 39.4156 20.6608C39.7578 20.6608 40.037 20.9399 40.037 21.2822C40.037 21.6154 39.7578 21.9126 39.4156 21.9126ZM38.9563 26.8927V22.57H39.8748V26.8927H38.9563Z"
          fill="black"
        />
        <path
          d="M35.3044 27.0003C34.0706 27.0003 33.125 25.9916 33.125 24.7308C33.125 23.47 34.0706 22.4614 35.3044 22.4614C35.8267 22.4614 36.286 22.6505 36.6372 22.9747V19.8857H37.5558V26.8922H36.6823V26.4599C36.322 26.8022 35.8447 27.0003 35.3044 27.0003ZM35.4035 26.1177C36.1599 26.1177 36.7363 25.5233 36.7363 24.7308C36.7363 23.9383 36.1599 23.3439 35.4035 23.3439C34.656 23.3439 34.0796 23.9383 34.0796 24.7308C34.0796 25.5233 34.656 26.1177 35.4035 26.1177Z"
          fill="black"
        />
        <path
          d="M30.4342 27.0003C29.1734 27.0003 28.2188 26.0007 28.2188 24.7399C28.2188 23.4431 29.1192 22.4614 30.326 22.4614C31.5328 22.4614 32.4244 23.4431 32.4244 24.7309C32.4244 24.8389 32.4153 24.956 32.4063 25.0641H29.1553C29.2454 25.6855 29.7766 26.1358 30.4431 26.1358C30.9474 26.1358 31.3708 25.8746 31.5869 25.4784L32.3433 25.9196C31.956 26.5771 31.2627 27.0003 30.4342 27.0003ZM29.1553 24.3166H31.4788C31.4248 23.7222 30.9655 23.29 30.3351 23.29C29.6957 23.29 29.2184 23.7222 29.1553 24.3166Z"
          fill="black"
        />
        <path
          d="M25.4258 26.892V22.5692H26.2993V23.1185C26.3354 23.0645 26.3804 23.0195 26.4254 22.9745C26.7046 22.6953 27.1008 22.5242 27.5511 22.5242C27.6502 22.5242 27.7403 22.5332 27.8393 22.5422V23.4157C27.7403 23.4067 27.6502 23.3977 27.5421 23.3977C27.1819 23.3977 26.8847 23.5238 26.6776 23.7399C26.4704 23.9471 26.3444 24.2263 26.3444 24.7306V26.892H25.4258Z"
          fill="black"
        />
        <path
          d="M22.4942 27C20.504 27 19 25.442 19 23.4968C19 21.5515 20.504 19.9935 22.4942 19.9935C23.1787 19.9935 23.8091 20.1827 24.3314 20.5159V21.5605C23.8541 21.1553 23.2417 20.9121 22.5483 20.9121C21.0983 20.9121 19.9996 22.0288 19.9996 23.4968C19.9996 24.9647 21.0983 26.0814 22.5483 26.0814C23.2417 26.0814 23.8541 25.8383 24.3314 25.433V26.4777C23.8091 26.8109 23.1787 27 22.4942 27Z"
          fill="black"
        />
      </g>
      <defs>
        <clipPath id="clip0_4039_58599">
          <rect
            width="44"
            height="26"
            fill="white"
            transform="translate(0 1)"
          />
        </clipPath>
      </defs>
    </svg>
  );
};

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

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

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

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

export const CreditMarkRebrand = CreditMarkRebrandInlineSVG;
