react-bank-card

react-card-bank checks your number prop and display on of these three folowwing logos if number is recognized ad credit card number:

Visa
MasterCard
Cb

You can hightlight specific field (to match with your form field).

There is also the card verso displayed following verso prop.

Getting started

You can download react-bank-card from the NPM registry via the npm or yarn commands

yarn add react-bank-card
npm install react-bank-card --save

If you don't use package manager and you want to include react-bank-card directly in your html, you could get it from the UNPKG CDN

https://unpkg.com/react-bank-card/dist/react-bank-card.min.js.

Usage

import React from "react"
import BankCard from "react-bank-card"

const App = () =>
  <ReactBankCard
    cvc="123"
    expiryMonth={10}
    expiryYear={19}
    number="4929588303328334"
    name="XuopleD"
    highlighted={{
      number: true,
      name: false,
      cvc: true,
      expiryMonth: false,
      expiryYear: false,
    }}
  />

Demo

See Demo page

Contributing

⇄ Pull/Merge requests and ★ Stars are always welcome.
For bugs and feature requests, please create an issue.
Pull requests must be accompanied by passing automated tests (npm test).

See CONTRIBUTING.md guidelines

Changelog

See changelog

License

This project is licensed under the MIT License - see the LICENCE.md file for details