cardy

cardy

A credit card utility belt for browser and Node.js apps

Try out the demo

Installation

npm install cardy

Usage

Browser (ES6)

Validation

import cardy from 'cardy';

// Validate a card number
const numberValidationResult = cardy.number.validate('4111111111111111');

// Validate an expiration date
const expirationValidationResult = cardy.expiration.validate('01/2020');

Formatting

import cardy from 'cardy';

// Format a card number
const formattedNumber = cardy.number.format('4111111111111111');

// Format an expiration date
const formattedExpiration = cardy.expiration.format('01/2020');

Input Masking

import cardy from 'cardy';

// Credit card input field in your app
const numberInput = document.querySelector('#card-number-input');

numberInput.addEventListener('input', (e) => {
  numberInput.value = cardy.number.mask(numberInput.value);
});

// Expiration date input field in your app
const expirationInput = document.querySelector('#card-expiration-input');

expirationInput.addEventListener('input', (e) => {
  expirationInput.value = cardy.expiration.mask(expirationInput.value);
});

// Security code input field in your app
const securityCodeInput = document.querySelector('#card-security-code-input');

securityCodeInput.addEventListener('input', (e) => {
  securityCodeInput.value = cardy.code.mask(securityCodeInput.value);

  // Optionally, enforce the security code length by passing a valid `codeSize`
  // value, which you can obtain from `card.number.validate()`
  securityCodeInput.value = cardy.code.mask(securityCodeInput.value, 3);
});

Node.js

Validation

const cardy = require('cardy');

// Validate a card number
const numberValidationResult = cardy.number.validate('4111111111111111');

// Validate an expiration date
const expirationValidationResult = cardy.expiration.validate('01/2020');

Formatting

const cardy = require('cardy');

// Format a card number
const formattedNumber = cardy.number.format('4111111111111111');

// Format an expiration date
const formattedExpiration = cardy.expiration.format('01/2020');

Credits

• Depends on card-validator
• Icon by Flaticon