Skip to content

cedricdelpoux/react-bank-card

Repository files navigation

react-bank-card

npm package Travis Codecov Module formats

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

react-bank-card

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