React Component Credit Card -
A Simple React component Credit Card
Getting Started
$ git clone -o your-component -b master --single-branch https://github.com/descomplica/react-credit-card.git your-component
Browser Support
We do care about it.
Latest ✔ | Latest ✔ | IE 9+ ✔ | Latest ✔ | Latest ✔ |
CommonJS
Install via NPM
$ npm install --save @descomplica/react-credit-card
Then:
import CreditCard from '@descomplica/react-credit-card'; … callback = (data) => { /* data { CardNumber: "4111111111111111", CvvNumber: "123", ExpMonth: "12", ExpYear: "2022", HolderName: "giovanni keppelen" } */ } render() { return ( <CreditCard success={callback} /> ); } …
With installments
… render() { return ( <CreditCard price={200.00} installments={6} success={callback} /> ); } …
Browser
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Credit Card Demo</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.1/react-with-addons.min.js" ></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.1/react-dom.min.js"></script> <script src="https://dnnsjdj5swfc3.cloudfront.net/front-end/libs/react-credit-card.js"></script> </head> <body> <div class="demo" id="demo"></div> <script> var CreditCard = CreditCard; var callback = function(data) { } ReactDOM.render( React.createElement(CreditCard, { success: callback }), document.getElementById('demo') ); </script> </body> </html>
Development
$ npm install $ npm start
Tests
react-credit-card is tested using Jasmine and Karma. To run the tests:
npm test
LICENSE
MIT: https://github.com/descomplica/react-credit-card/blob/master/LICENSE