reactjs-credit-card/form/validThruMonth.js

This Package has react credit card form components and form validation system

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

import React, { useContext, useState } from 'react';
import { GetCardValidThruMonth, MonthList, parseProps } from '../utils/general';
import hunelContext from '../utils/HunelContext';
export default function ValidThruMonth(props) {
  const {
    setMonthRelativeWithYear,
    _validThruMonth,
    _validThruYear,
    pokeVirtualCardStates
  } = useContext(hunelContext);
  const [validThruMonth, setValidThruMonth] = useState(_validThruMonth);
  const [validThruYear, setValidThruYear] = useState(_validThruYear);
  const newProps = parseProps(props, 'value');

  function handleChange(e) {
    let {
      value
    } = e.target;
    value = GetCardValidThruMonth(value, validThruYear);
    pokeVirtualCardStates(3, value);
    setValidThruMonth(value);
  }

  function _handleValidYear(year) {
    setValidThruYear(year);
  }

  setMonthRelativeWithYear(_handleValidYear);
  var montList = MonthList(validThruYear).map(month => /*#__PURE__*/React.createElement("option", {
    value: month,
    key: month
  }, month < 10 ? `0${month}` : month));
  return /*#__PURE__*/React.createElement("select", _extends({
    onChange: e => {
      handleChange(e);
      if ('onChange' in newProps) newProps['onChange'](e);
    },
    value: validThruMonth
  }, parseProps(newProps, 'onChange')), montList);
}