Wondering what’s next for npm?Check out our public roadmap! »

    @shaaditech/react-cc-validator

    0.0.1 • Public • Published

    react-cc-validator

    Credit/Debit card number validator input written in react. Demo

    Travis Codecov npm

    Greenkeeper badge

    Install

    • Add package in project using yarn add @shaaditech/react-cc-validator

    • Import

    import CardNumberValidator from '@shaaditech/react-cc-validator';

    API

    Usage

    You can refer to /example

    const YourComponent = () => (
      <div>
        <CardNumberValidator>
          {({ isValid, cardType, getInputProps }) => (
            <div>
              <input type="text" {...getInputProps()} />
              <div>{ isValid && cardType }</div>
              {isValid || <div>Card number is invalid</div>}
            </div>
          )}
        </CardNumberValidator>
      </div>
    );

    Types

    // The props that can be passed to CardNumberValidator compopent
    type PropTypes = {
      children: PassedProps => ReactNode,
      validCardTypes: Array<String>,
      format: Boolean,
    };
     
    // The props to be passed to the input element
    type InputProps = {
      onChange: Function,
      value: String,
    };
     
    // The props passed down to the render component
    type PassedProps = {
      ...InputProps,
      isValid: Boolean,
      cardType: String,
      getInputProps: () => InputProps,
    };

    Install

    npm i @shaaditech/react-cc-validator

    DownloadsWeekly Downloads

    26

    Version

    0.0.1

    License

    MIT

    Unpacked Size

    803 kB

    Total Files

    28

    Last publish

    Collaborators

    • avatar
    • avatar
    • avatar