1.0.0 • Published 4 years ago
material-ui-credit-card v1.0.0
material-ui-credit-card
a Material UI TextField for credit card numbers
Install
yarn add material-ui-credit-card
Usage
Basic
CreditCardField accepts the same props
as the Material UI TextField
import CreditCardField from 'material-ui-credit-card'
function MyComponent() {
return (
<CreditCardField
value={creditCard}
onChange={(e) => setCreditCard(e.currentTarget.value)}
/>
)
}
Custom braintree/credit-card-type
You can also pass in a custom CreditCardType if you'd like use the credit card type elsewhere or add your own credit card type
import CreditCardField from 'material-ui-credit-card'
import getCreditCardType from 'credit-card-type'
function MyComponent() {
const [creditCardNumber, setCreditCardNumber] = useState('')
const cardType = getCreditCardType(creditCardNumber)?.[0]
return (
<CreditCardField
value={creditCardNumber}
onChange={(e) => setCreditCardNumber(e.currentTarget.value)}
creditCardType={cardType}
/>
)
}
Development
This project was bootstrapped using create-react-library
$ git clone https://github.com/jackHedaya/material-ui-credit-card
$ cd material-ui-credit-card && yarn
- Continue instructions here
License
MIT © jackHedaya
1.0.0
4 years ago