Repository URL to install this package:
|
Version:
0.9.6 ▾
|
ui-component-library
/
src
/
components
/
atoms
/
Icons
/
PaymentsCardIcon
/
MasterCardIcon
/
MasterCardIcon.tsx
|
|---|
import React from 'react'
import Vector from 'atoms/Vector'
import { fromPropsToIdentifier } from 'atoms/Icons/deps'
const wording = {
title: 'Master card',
description: 'Master Card is one of the type of Payment card',
vectorClassName: 'mastercard',
}
function fromBreedToComponent(breed) {
switch (breed) {
case 'withBg':
return {
svgPath: (
<g fillRule="nonzero" fill="none">
<rect fill="#013474" width="750" height="471" rx="40" />
<path
d="M476.2 387.4c-83.2 0-151.2-68-151.2-151.2C325 153 392.2 85 475.4 85c84.8 0 152 68 152 151.2 0 83.2-67.2 151.2-151.2 151.2z"
fill="#ED8410"
/>
<path
d="M274.2 387.4c-83.2 0-151.2-68-151.2-151.2C123 153 190.2 85 273.4 85c84.8 0 152 68 152 151.2 0 83.2-67.2 151.2-151.2 151.2z"
fill="#E20620"
/>
<g fill="#FFF">
<path d="M327.8 274.4l2.4-13.6c-.8 0-2.4.8-4 .8-5.6 0-6.4-3.2-5.6-4.8l4.8-28h8.8l2.4-15.2h-8l1.6-9.6h-16s-9.6 52.8-9.6 59.2c0 9.6 5.6 13.6 12.8 13.6 4.8 0 8.8-1.6 10.4-2.4zM333.4 248.8c0 22.4 15.2 28 28 28 12 0 16.8-2.4 16.8-2.4l3.2-15.2s-8.8 4-16.8 4c-17.6 0-14.4-12.8-14.4-12.8H383s2.4-10.4 2.4-14.4c0-10.4-5.6-23.2-23.2-23.2-16.8-1.6-28.8 16-28.8 36zm28-23.2c8.8 0 7.2 10.4 7.2 11.2H351c0-.8 1.6-11.2 10.4-11.2zM463 274.4l3.2-17.6s-8 4-13.6 4c-11.2 0-16-8.8-16-18.4 0-19.2 9.6-29.6 20.8-29.6 8 0 14.4 4.8 14.4 4.8l2.4-16.8s-9.6-4-18.4-4c-18.4 0-36.8 16-36.8 46.4 0 20 9.6 33.6 28.8 33.6 6.4 0 15.2-2.4 15.2-2.4zM239.8 211.2c-11.2 0-19.2 3.2-19.2 3.2l-2.4 13.6s7.2-3.2 17.6-3.2c5.6 0 10.4.8 10.4 5.6 0 3.2-.8 4-.8 4h-7.2c-13.6 0-28.8 5.6-28.8 24 0 14.4 9.6 17.6 15.2 17.6 11.2 0 16-7.2 16.8-7.2l-.8 6.4H255l6.4-44c0-19.2-16-20-21.6-20zm3.2 36c0 2.4-1.6 15.2-11.2 15.2-4.8 0-6.4-4-6.4-6.4 0-4 2.4-9.6 14.4-9.6 2.4.8 3.2.8 3.2.8zM276.6 276c4 0 24 .8 24-20.8 0-20-19.2-16-19.2-24 0-4 3.2-5.6 8.8-5.6 2.4 0 11.2.8 11.2.8l2.4-14.4s-5.6-1.6-15.2-1.6c-12 0-24 4.8-24 20.8 0 18.4 20 16.8 20 24 0 4.8-5.6 5.6-9.6 5.6-7.2 0-14.4-2.4-14.4-2.4l-2.4 14.4c.8 1.6 4.8 3.2 18.4 3.2zM595.8 198.4l-3.2 21.6s-6.4-8-15.2-8c-14.4 0-27.2 17.6-27.2 38.4 0 12.8 6.4 26.4 20 26.4 9.6 0 15.2-6.4 15.2-6.4l-.8 5.6h16l12-76.8-16.8-.8zm-7.2 42.4c0 8.8-4 20-12.8 20-5.6 0-8.8-4.8-8.8-12.8 0-12.8 5.6-20.8 12.8-20.8 5.6 0 8.8 4 8.8 13.6zM152.6 275.2l9.6-57.6 1.6 57.6H175l20.8-57.6-8.8 57.6h16.8l12.8-76.8h-26.4l-16 47.2-.8-47.2h-23.2l-12.8 76.8zM400.6 275.2c4.8-26.4 5.6-48 16.8-44 1.6-10.4 4-14.4 5.6-18.4h-3.2c-7.2 0-12.8 9.6-12.8 9.6l1.6-8.8h-15.2L383 276h17.6v-.8zM499.8 211.2c-11.2 0-19.2 3.2-19.2 3.2l-2.4 13.6s7.2-3.2 17.6-3.2c5.6 0 10.4.8 10.4 5.6 0 3.2-.8 4-.8 4h-7.2c-13.6 0-28.8 5.6-28.8 24 0 14.4 9.6 17.6 15.2 17.6 11.2 0 16-7.2 16.8-7.2l-.8 6.4H515l6.4-44c.8-19.2-16-20-21.6-20zm4 36c0 2.4-1.6 15.2-11.2 15.2-4.8 0-6.4-4-6.4-6.4 0-4 2.4-9.6 14.4-9.6 2.4.8 2.4.8 3.2.8zM535 275.2c4.8-26.4 5.6-48 16.8-44 1.6-10.4 4-14.4 5.6-18.4h-3.2c-7.2 0-12.8 9.6-12.8 9.6l1.6-8.8h-15.2L517.4 276H535v-.8z" />
</g>
</g>
),
viewBox: '0 0 750 471',
}
default:
return {
svgPath: (
<React.Fragment>
<path fill="none" d="M0 0h146.8v120.41H0z" />
<path
fill="#231f20"
d="M36.35 105.26v-6a3.56 3.56 0 0 0-3.76-3.8 3.7 3.7 0 0 0-3.36 1.7 3.51 3.51 0 0 0-3.16-1.7 3.16 3.16 0 0 0-2.8 1.42V95.7h-2.08v9.56h2.1V100a2.24 2.24 0 0 1 2.34-2.54c1.38 0 2.08.9 2.08 2.52v5.32h2.1V100a2.25 2.25 0 0 1 2.34-2.54c1.42 0 2.1.9 2.1 2.52v5.32zm31.07-9.56H64v-2.9h-2.1v2.9H60v1.9h1.94v4.4c0 2.22.86 3.54 3.32 3.54a4.88 4.88 0 0 0 2.6-.74l-.6-1.78a3.84 3.84 0 0 1-1.84.54c-1 0-1.38-.64-1.38-1.6V97.6h3.4zm17.74-.24a2.82 2.82 0 0 0-2.52 1.4V95.7h-2.06v9.56h2.08V99.9c0-1.58.68-2.46 2-2.46a3.39 3.39 0 0 1 1.3.24l.64-2a4.45 4.45 0 0 0-1.48-.26zm-26.82 1a7.15 7.15 0 0 0-3.9-1c-2.42 0-4 1.16-4 3.06 0 1.56 1.16 2.52 3.3 2.82l1 .14c1.14.16 1.68.46 1.68 1 0 .74-.76 1.16-2.18 1.16a5.09 5.09 0 0 1-3.18-1l-1 1.62a6.9 6.9 0 0 0 4.14 1.24c2.76 0 4.36-1.3 4.36-3.12s-1.26-2.56-3.34-2.86l-1-.14c-.9-.12-1.62-.3-1.62-.94s.68-1.12 1.82-1.12a6.16 6.16 0 0 1 3 .82zm55.71-1a2.82 2.82 0 0 0-2.52 1.4V95.7h-2.06v9.56h2.08V99.9c0-1.58.68-2.46 2-2.46a3.39 3.39 0 0 1 1.3.24l.64-2a4.45 4.45 0 0 0-1.48-.26zm-26.8 5a4.83 4.83 0 0 0 5.1 5 5 5 0 0 0 3.44-1.14l-1-1.68a4.2 4.2 0 0 1-2.5.86 3.07 3.07 0 0 1 0-6.12 4.2 4.2 0 0 1 2.5.86l1-1.68a5 5 0 0 0-3.44-1.14 4.83 4.83 0 0 0-5.1 5zm19.48 0V95.7h-2.08v1.16a3.63 3.63 0 0 0-3-1.4 5 5 0 0 0 0 10 3.63 3.63 0 0 0 3-1.4v1.16h2.08zm-7.74 0a2.89 2.89 0 1 1 2.9 3.06 2.87 2.87 0 0 1-2.9-3.06zm-25.1-5a5 5 0 0 0 .14 10 5.81 5.81 0 0 0 3.97-1.3l-1-1.54a4.55 4.55 0 0 1-2.78 1 2.65 2.65 0 0 1-2.86-2.34h7.1v-.8c0-3-1.86-5-4.54-5zm0 1.86a2.37 2.37 0 0 1 2.42 2.32h-5a2.46 2.46 0 0 1 2.54-2.32zm52.11 3.16v-8.62h-2v5a3.63 3.63 0 0 0-3-1.4 5 5 0 0 0 0 10 3.63 3.63 0 0 0 3-1.4v1.16h2zm3.47 3.39a1 1 0 0 1 .38.07 1 1 0 0 1 .31.2 1 1 0 0 1 .21.3.93.93 0 0 1 0 .74 1 1 0 0 1-.21.3 1 1 0 0 1-.31.2.94.94 0 0 1-.38.08 1 1 0 0 1-.9-.58.94.94 0 0 1 0-.74 1 1 0 0 1 .21-.3 1 1 0 0 1 .31-.2 1 1 0 0 1 .41-.07zm0 1.69a.71.71 0 0 0 .29-.06.75.75 0 0 0 .23-.16.74.74 0 0 0 0-1 .74.74 0 0 0-.23-.16.72.72 0 0 0-.29-.06.75.75 0 0 0-.29.06.73.73 0 0 0-.24.16.74.74 0 0 0 0 1 .74.74 0 0 0 .24.16.74.74 0 0 0 .32.06zm.06-1.19a.4.4 0 0 1 .26.08.25.25 0 0 1 .09.21.24.24 0 0 1-.07.18.35.35 0 0 1-.21.09l.29.33h-.23l-.27-.33h-.09v.33h-.19v-.88zm-.22.17v.24h.22a.21.21 0 0 0 .12 0 .1.1 0 0 0 0-.09.1.1 0 0 0 0-.09.21.21 0 0 0-.12 0zm-11-4.06a2.89 2.89 0 1 1 2.9 3.06 2.87 2.87 0 0 1-2.9-3.06zm-70.23 0V95.7H46v1.16a3.63 3.63 0 0 0-3-1.4 5 5 0 0 0 0 10 3.63 3.63 0 0 0 3-1.4v1.16h2.08zm-7.74 0a2.89 2.89 0 1 1 2.9 3.06 2.87 2.87 0 0 1-2.92-3.06z"
/>
<path fill="#ff5f00" d="M57.65 22.85h31.5v56.61h-31.5z" />
<path
fill="#eb001b"
d="M59.65 51.16A35.94 35.94 0 0 1 73.4 22.85a36 36 0 1 0 0 56.61 35.94 35.94 0 0 1-13.75-28.3z"
/>
<g fill="#f79e1b">
<path d="M131.65 51.16a36 36 0 0 1-58.25 28.3 36 36 0 0 0 0-56.61 36 36 0 0 1 58.25 28.3zM128.21 73.46V72.3h.47v-.24h-1.19v.24h.51v1.16zm2.31 0v-1.4h-.36l-.42 1-.42-1H129v1.4h.26v-1.05l.39.91h.27l.39-.91v1.06z" />
</g>
</React.Fragment>
),
viewBox: '0 0 146.8 120.41',
}
}
}
class MasterPaymentCardIcon extends React.PureComponent {
static defaultProps = {
width: '50px',
height: '50px',
viewBox: '',
}
render() {
const { breed } = this.props
const { svgPath, viewBox } = fromBreedToComponent(breed)
const identifier = fromPropsToIdentifier(wording)
return (
<Vector
{...this.props}
{...wording}
viewBox={viewBox}
namespace={identifier}
>
{svgPath}
</Vector>
)
}
}
export { MasterPaymentCardIcon }
export default MasterPaymentCardIcon