How to use the card-validator.number function in card-validator

CreditCardForm.prototype._validateNumber = function (value) {
  var validationResult = validator.number(value, {
    luhnValidateUnionPay: true,
    maxLength: this.configuration.fields.number.maxCardLength
  });
  var card = validationResult.card;
  var possibleCardTypes, possibleCardType;

  // NEXT_MAJOR_VERSION credit-card-type fixed the mastercard enum
  // but we still pass master-card in the braintree API
  // in a major version bump, we can remove this and
  // this will be mastercard instead of master-card
  if (card && card.type === 'mastercard') {
    card.type = 'master-card';
  }

  possibleCardTypes = this.getCardTypes(value).filter(function (cardType) {
    return card && cardType.type === card.type;

test(value) {
                    const { card } = number((this.parent as HostedInputValues).cardNumber);

                    return cvv(value, card && card.code ? card.code.size : undefined).isValid;
                },
            });

                test: value => number(value).isValid,
            });

onCardNumberChange(event, value) {
    const numberValidation = valid.number(_.camelCase(value));
    const niceType = numberValidation.card ? numberValidation.card.niceType : null;

    this.setState({
      number: value,
      cardNiceType: niceType
    });
  },

protected _notifyChange(value: string): void {
        const cardInfo = number(value).card;
        const prevCardInfo = this._previousValue && number(this._previousValue).card;

        if (get(prevCardInfo, 'type') === get(cardInfo, 'type')) {
            return;
        }

        this._eventPoster.post({
            type: HostedInputEventType.CardTypeChanged,
            payload: {
                cardType: cardInfo ? cardInfo.type : undefined,
            },
        });
    }

protected _notifyChange(value: string): void {
        const cardInfo = number(value).card;
        const prevCardInfo = this._previousValue && number(this._previousValue).card;

        if (get(prevCardInfo, 'type') === get(cardInfo, 'type')) {
            return;
        }

        this._eventPoster.post({
            type: HostedInputEventType.CardTypeChanged,
            payload: {
                cardType: cardInfo ? cardInfo.type : undefined,
            },
        });
    }

function cardInfoUpdated(event) {
  var name = document.getElementById("full-name").value;
  var expDate = document.getElementById("exp-date").value;
  var number = document.getElementById("cc-number").value;

  var validationResult = cardValidator.number(number);
  var expDateValidation = cardValidator.expirationDate({ month: expDate.substring(5) , year: expDate.substring(0, 4) });

  var readyToSave = validationResult.isValid && expDateValidation.isValid && name.length > 0;
  document.getElementById("add-card-confirm-button").disabled = !readyToSave;

  var formattedNumber = formatCardNumber(number);
  if (number !== formattedNumber) {
    document.getElementById("cc-number").value = formattedNumber;
  }
}

validateValues = (formValues) => {
    const numberValidation = valid.number(formValues.number);
    const expiryValidation = valid.expirationDate(formValues.expiry);
    const maxCVCLength = (numberValidation.card || FALLBACK_CARD).code.size;
    const cvcValidation = valid.cvv(formValues.cvc, maxCVCLength);

    const validationStatuses = pick({
      number: toStatus(numberValidation),
      expiry: toStatus(expiryValidation),
      cvc: toStatus(cvcValidation),
      name: !!formValues.name ? "valid" : "incomplete",
      postalCode: this._validatePostalCode(formValues.postalCode),
    }, this._displayedFields);

    return {
      valid: every(values(validationStatuses), status => status === "valid"),
      status: validationStatuses,
    };

localCards.forEach(card => {
      var validationResult = cardValidator.number(card.cardNumber);
      if (!!validationResult && validationResult.isValid) {
        var content = document.createElement("div");
        var cardIcon = document.createElement("i");
        switch (validationResult.card.type) {
          case "visa":
            cardIcon.className = "cc-icons fab fa-cc-visa";
            break;
          case "master-card":
            cardIcon.className = "cc-icons fab fa-cc-mastercard";
            break;
          case "american-express":
            cardIcon.className = "cc-icons fab fa-cc-amex";
            break;
          default:
            cardIcon.className = "cc-icons fa fa-credit-card";
            break;

IconWrapper: IconWrapperOverride,
        ...overrides
      } = Object.freeze({IconWrapper: null}),
      size = SIZE.default,
      onChange,
      value,
      'aria-label': ariaLabel = 'Please enter a debit or credit card number.',
      ...restProps
    } = this.props;

    const [IconWrapper, iconWrapperProps] = getOverrides(
      IconWrapperOverride,
      StyledIconWrapper,
    );

    const validatedValue = valid.number(value);
    let gaps: number[] = [];
    let type: ?string = undefined;
    if (validatedValue.card) {
      gaps = validatedValue.card.gaps || [];
      type = validatedValue.card.type;
    }

    const getBeforeComponent = theme => {
      const iconSize = {
        [SIZE.compact]: theme.sizing.scale800,
        [SIZE.default]: theme.sizing.scale900,
        [SIZE.large]: theme.sizing.scale1000,
      };
      return () => (
        
          {React.createElement(