import React from 'react';
import type { Size } from '../types';

export const getMastercardLogo = (size: Size) => {
    return size === 'regular' ? mastercardLogoRegular() : mastercardLogoSmall();
};

const mastercardLogoRegular = () => {
    return (
        <svg
            width="34"
            height="32"
            viewBox="0 0 34 32"
            fill="none"
            xmlns="http://www.w3.org/2000/svg"
        >
            <g clipPath="url(#clip0_244_13197)">
                <path
                    d="M21.607 7.61462H12.3606V24.3869H21.607V7.61462Z"
                    fill="#FF5F00"
                />
                <path
                    d="M12.9553 16.0003C12.9538 14.385 13.3164 12.7905 14.0157 11.3376C14.7149 9.88471 15.7325 8.61142 16.9913 7.61415C15.4325 6.37731 13.5603 5.60813 11.5888 5.39454C9.61729 5.18095 7.62604 5.53155 5.84263 6.40629C4.05921 7.28103 2.55559 8.64462 1.50362 10.3412C0.451656 12.0377 -0.106201 13.9988 -0.106201 16.0003C-0.106201 18.0017 0.451656 19.9628 1.50362 21.6594C2.55559 23.3559 4.05921 24.7195 5.84263 25.5942C7.62604 26.469 9.61729 26.8196 11.5888 26.606C13.5603 26.3924 15.4325 25.6232 16.9913 24.3864C15.7325 23.3891 14.715 22.1158 14.0157 20.6629C13.3165 19.21 12.9538 17.6156 12.9553 16.0003Z"
                    fill="#EB001B"
                />
                <path
                    d="M34.0814 16.0003C34.0815 18.0017 33.5237 19.9628 32.4718 21.6593C31.4199 23.3559 29.9163 24.7195 28.1329 25.5942C26.3495 26.469 24.3583 26.8196 22.3868 26.606C20.4154 26.3924 18.5432 25.6232 16.9844 24.3864C18.2421 23.3881 19.2589 22.1146 19.958 20.6619C20.6572 19.2093 21.0204 17.6153 21.0204 16.0003C21.0204 14.3852 20.6572 12.7913 19.958 11.3386C19.2589 9.88592 18.2421 8.61243 16.9844 7.61415C18.5432 6.3773 20.4154 5.60812 22.3868 5.39454C24.3583 5.18095 26.3495 5.53157 28.1329 6.40632C29.9163 7.28107 31.4199 8.64465 32.4718 10.3412C33.5237 12.0378 34.0815 13.9988 34.0814 16.0003Z"
                    fill="#F79E1B"
                />
                <path
                    d="M33.0867 22.6121V22.2688H33.2238V22.1988H32.8745V22.2688H33.0117V22.6121H33.0867ZM33.7649 22.6121V22.1981H33.6578L33.5347 22.4829L33.4115 22.1981H33.3043V22.6121H33.3799V22.2998L33.4954 22.5691H33.5738L33.6893 22.2992V22.6121H33.7649Z"
                    fill="#F79E1B"
                />
            </g>
            <defs>
                <clipPath id="clip0_244_13197">
                    <rect width="34" height="32" fill="white" />
                </clipPath>
            </defs>
        </svg>
    );
};

const mastercardLogoSmall = () => {
    return (
        <svg
            width="26"
            height="24"
            viewBox="0 0 26 24"
            fill="none"
            xmlns="http://www.w3.org/2000/svg"
        >
            <g clipPath="url(#clip0_248_13976)">
                <path
                    d="M16.5229 5.71094H9.45215V18.2901H16.5229V5.71094Z"
                    fill="#FF5F00"
                />
                <path
                    d="M9.90713 12.0002C9.90601 10.7888 10.1833 9.59293 10.718 8.50324C11.2528 7.41356 12.0309 6.4586 12.9935 5.71065C11.8014 4.78301 10.3698 4.20613 8.86217 4.04593C7.35456 3.88574 5.83184 4.14869 4.46805 4.80475C3.10426 5.46081 1.95443 6.48349 1.14999 7.75591C0.345542 9.02833 -0.0810547 10.4991 -0.0810547 12.0002C-0.0810547 13.5013 0.345542 14.9721 1.14999 16.2446C1.95443 17.517 3.10426 18.5397 4.46805 19.1957C5.83184 19.8518 7.35456 20.1147 8.86217 19.9545C10.3698 19.7943 11.8014 19.2175 12.9935 18.2898C12.0309 17.5419 11.2528 16.5869 10.7181 15.4972C10.1833 14.4075 9.90602 13.2117 9.90713 12.0002Z"
                    fill="#EB001B"
                />
                <path
                    d="M26.0622 12.0002C26.0623 13.5013 25.6357 14.9721 24.8313 16.2445C24.0269 17.5169 22.8771 18.5396 21.5134 19.1957C20.1496 19.8518 18.6269 20.1147 17.1193 19.9545C15.6117 19.7943 14.1801 19.2175 12.988 18.2898C13.9498 17.5411 14.7274 16.586 15.262 15.4965C15.7966 14.407 16.0744 13.2115 16.0744 12.0002C16.0744 10.789 15.7966 9.59349 15.262 8.50398C14.7274 7.41447 13.9498 6.45935 12.988 5.71064C14.1801 4.78301 15.6117 4.20612 17.1193 4.04593C18.6269 3.88574 20.1496 4.1487 21.5134 4.80477C22.8771 5.46083 24.0269 6.48352 24.8313 7.75593C25.6357 9.02835 26.0623 10.4992 26.0622 12.0002Z"
                    fill="#F79E1B"
                />
                <path
                    d="M25.3017 16.9591V16.7015H25.4065V16.6491H25.1394V16.7015H25.2443V16.9591H25.3017ZM25.8203 16.9591V16.6486H25.7384L25.6442 16.8621L25.55 16.6486H25.4681V16.9591H25.5259V16.7248L25.6142 16.9268H25.6742L25.7625 16.7243V16.9591H25.8203Z"
                    fill="#F79E1B"
                />
            </g>
            <defs>
                <clipPath id="clip0_248_13976">
                    <rect width="26" height="24" fill="white" />
                </clipPath>
            </defs>
        </svg>
    );
};
