rn-validation v1.1.0

rn-validation

Supporting component helping validating values

Features

• Provide validation rules
• Able to create custom validation rules
• Easy to use

Installation

npm install rn-validation

or

yarn add rn-validation

Usage

import { createRef } from 'react';
import { ValidationGroup, Validator, ValidationRules } from 'rn-validation';

const validation = createRef();

<ValidationGroup
  ref={validation}
  onValidated={({ validated, validatedErrors }) => {
    if (validated) {
      alert('Validated successfully!');
    } else {
      alert(validatedErrors[0].firstValidatedErrorMessage);
    }
  }}
>
  <Validator
    getValidatedValue={() => value}
    validations={[
      ValidationRules.isNotEmpty,
      ValidationRules.isLengthLessThanOrEqualTo(20),
    ]}
    errorMessages={['Cannot be empty', 'Value length cannot exceed 20']}
  >
    {({ validated, firstValidatedErrorMessage }) => {
      return (
        <View>
          <TextInput
            value={value}
            style={{ borderWidth: 1, borderColor: validated ? 'grey' : 'red' }}
          />
          {validated ? null : <Text>{firstValidatedErrorMessage}</Text>}
        </View>
      );
    }}
  </Validator>
</ValidationGroup>;

// Call the method to start validating all validators inside the group
validation.current.validate();

ValidationGroup

Props

Methods

Validator

Props

Methods

ValidationRules

• isNotEmpty
• isLengthLessThan
• isLengthLessThanOrEqualTo
• isLengthBetween
• isEqual
• isExactlyEqual
• matchRegExp
• isBetween
• isLessThan
• isLessThanOrEqualTo
• isGreaterThan
• isGreaterThanOrEqualTo
• requireNumericDigits
• isEmail
• isNotEmptyTrim

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT