npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

hero-validate

v1.1.8

Published

simple validation library for Javascript & Reactjs functional

Downloads

10

Readme

Installation

You can install hero-validate using npm or yarn package manager:

npm install hero-validate --save
#or
yarn add hero-validate

Usage

/// import code js to your project
const Validation = require('hero-validate');
/// create rule for your form
const rules = {
    name         : 'required|min:2|max:50',
    email        : "required|email",
    password     : "required|min:8|max:100",
};
/// custom message for your form
Validation.setMessages({
    name: {
        required: "Field Name is required --- override message",
        min: "Field :name can't be less than :min --- override message", /// replace value param
        max: ":name cant be greater than :max  --- override message :D ", /// replace value param :max
    },
    required: 'required override message', /// default message of rule required not define field 
    min: 'validator got parameter :min and value :value' /// default message of rule min not define field 
    ....
});

/// show all language support
console.log(Validation.languages)
/// you can setting locale for support 2 language : en - vi - ja
Validation.setLocale(Validation.languages.vi)

const data = {
  name    : 'Trương Thanh Hùng Đẹp Trai',
  email   : 'thanhhungdevgmail.com',
  password: 'ahihi@1',
};

const result = Validation.validate( data,  rules );
console.log(JSON.stringify(result))
/// {"hasError":true,"errors":{"email":["email phải là mail hợp lệ"],"password":["password phải lớn hơn hoặc bằng 8."]}}

result.isError('name', 'ruleName' ); // Boolean Get if given field has error, ruleName default null will get all

result.getError('name', '-'); // will Get first error message of field or join error string by - character. Default join string error by `,`

result.getAllError('name', "|"); //  will Get all error message of field or join error string by | character. Default join string error by `,`

Example Validate an object

import Validation from 'hero-validate'
/// create rule for your form
const rules = {
    email        : "required|email|min:8|max:20",
    password     : "required|min:7|max:100",
};
const message = {
    email: "email failure!!!",
    password: ":name failure..."
}
const data = {
  email: '[email protected]',
  password: 'hungfff'
}
/// custom message for your form
Validation.setMessages(message);
const result = Validation.validate( data,  rules );

will return obect error, if you need check hasError result.hasError

Custom rule Validation

  • Example 1 - object rule
import Validation from 'hero-validate'
/// create rule for your form
const rules = {
    password     : "required|min_length:7|max_length:100",
    confirm_password : {
        required: true,
        mycustom: function (value) {
            if (value !== data.password) {
                return {}; /// try return {} or string 
                // return "Password confirm is incorrect"
            }
            return true;
        },
    },
};
const message = {
    password: ":name failure...",
    mycustom: "try turn off mycustom"
}
const data = {
    password: 'hungfff',
    confirm_password: "fdsfds", /// name underscore
}
/// custom message for your form
Validation.setMessages(message);
const result = Validation.validate( data,  rules );
  • Example 2 - create function validate public
Validation.extend(
    'validate_address', /// underscore
    function (value, arg1, arg2, ...rest) {
        
        if (",#-/ !@$%^*(){}|[]\\".indexOf(value) >= 0) {
            return true
        }
        return {
            value: value,
            /// arg1, arg2, ...rest
        }
    },
    'Default Error Message: :name cant be :value'
);
// usage: { 
//    address1: 'validate_address:arg1,arg2|required',
//    address2: 'validate_address:arg1|required',
//    address3: 'validate_address:arg1,arg2,arg3|min:7',
// }

React Validation

demo code sanbox : https://codesandbox.io/embed/sweet-cache-x6keg?fontsize=14&hidenavigation=1&theme=dark

  • Example
import React, { useState, useEffect } from "react";
import Validator from "hero-validate";
/// create rule for your form
const rules = {
    email: "required|email|min:8|max:20",
    password: "required|min:7|max:40"
};
Validator.setLocale(Validator.languages.vi)
/// custom message for your form
Validator.setMessages({
    email: "sfsdfds :name ",
    password: {
        min: "sdfsdf password min"
    }
});

export default function TestMyValidate() {
    const [values, setValues] = useState({ email: "", password: "" });
    const [touched, setTouched] = useState({email: false, password: false});
    const [errors, setErrors] = useState(Validator.getEmpty());

    /// add function error custom
    const hasErr = (name) => {
        return touched[name] && errors.isError(name);
    };
    /// add function when value change
    const handleChange = (event) => {
        event.persist();
        setTouched({ ...touched, [event.target.name]: true });
        setValues({ ...values, [event.target.name]: event.target.value });
    };
    /// hook react
    useEffect(() => {
        setErrors(Validator.validate(values, rules));
    }, [values]);

    return (
        <div className="App">
            <form>
                <label htmlFor="email"> mail of u </label>
                <input
                    type="text"
                    className={hasErr("email") ? "error" : ""}
                    name="email"
                    value={values.email}
                    onChange={handleChange}
                />
                { hasErr("email") && (
                    <div className="text-red">{errors.getError("email")}</div>
                )}

                <label htmlFor="password"> password of you </label>
                <input
                    type="password"
                    className={hasErr("password") ? "error" : ""}
                    name="password"
                    value={values.password}
                    onChange={handleChange}
                />
                { hasErr("password") && (
                    <div className="text-red">{errors.getError("password")}</div>
                )}
            </form>
        </div>
    );
}

Rule support


/**
 * Validates if given values is `undefined` `null` or empty string.
 * @message Parameter is required
 * @example ...'|required'
 */
'required';

/**
 * Tells validator to pass value in validator function as string
 * @example ...'|string'
 */
'string';

/**
 * Tells validator to pass value in validator function as number
 * @example ...'|number'
 */
'number';

/**
 * Rule for parameter that is not required
 * @example ...'|nullable'
 */
'nullable';

/**
 * Validates if given value contains only letters
 * @message Parameter can only contain leters
 * @example ...'|alpha|'
 * @param value
 * @return {boolean|{value}}
 */
alpha(value) {
    return /^[a-zA-Z]+$/.test(value) || { value };
},

/**
 * Validates if given value contains only letters and dashes
 * @message Parameter can only contain letters and dashes
 * @example ...'|alpha_dash|'
 * @param value
 * @return {boolean|{value}}
 */
alpha_dash(value) {
    return /^[A-Za-z\-]+$/.test(value) || { value };
},

/**
 * Validates if given value contains only digits and letters
 * @message Parameter can only contain digits and letters
 * @example ...'|alpha_numeric|'
 * @param value
 * @return {boolean|{value}}
 */
alpha_numeric(value) {
    return /^[A-Za-z0-9]+$/.test(value) || { value };
},

/**
 * Validates if given value is array
 * @message Parameter must be array
 * @example ...'|array|'
 * @param value
 * @return {boolean|{}}
 */
array(value) {
    return Array.isArray(value) || {};
},

/**
 * Returns error if given value is between given parameter, if value is not numeric compares string length
 * @message Parameter must be between From and To
 * @example ...'|between:20,40|'
 * @param value
 * @param from
 * @param to
 * @return {{from, to, value}|boolean}
 */
between(value, from, to) {
    if (typeof value === 'string') {
        if (value.length >= from && value.length <= to) {
            return true;
        }
    } else {
        if (value >= from && value <= to) {
            return true;
        }
    }
    return { from, to, value };
},

/**
 * Validates if given value is boolean
 * @message Parameter must be boolean
 * @example ...'|boolean|'
 * @param value
 * @return {boolean}
 */
boolean(value) {
    return typeof value === 'boolean' || {};
},

/**
 * Validates if checkbox is checked. Valid values: `'on', 1, 'true', true`
 * @message Parameter must be checked
 * @example ...'|checked|'
 * @param value
 * @return {boolean}
 */
checked(value) {
    return (
        value === 1 || value === 'on' || value === true || value === 'true' || {}
    );
},

/**
 * Validates if given value don't contains every given parameter
 * @message Parameter must contain "Value"
 * @example ...'|contains_all:foo,bar,2|'
 * @param value
 * @param values
 * @return {{value_to_contain: *}|boolean}
 */
contains_all(value, ...values) {
    if (!Array.isArray(value)) {
        value = String(value);
    }
    for (let i = 0, l = values.length; i < l; i++) {
        if (value.indexOf(values[i]) === -1) {
            return { value_to_contain: values[i] };
        }
    }
    return true;
},

/**
 * Validates if given value don't contains one of parameter
 * @message Parameter must contain "Value"
 * @example ...'|contains_one:foo,bar,2|'
 * @param value
 * @param values
 * @return {boolean|{value_to_contain: string}}
 */
contains_one(value, ...values) {
    if (!Array.isArray(value)) {
        value = String(value);
    }
    for (let i = 0, l = values.length; i < l; i++) {
        if (value.indexOf(values[i]) > -1) {
            return true;
        }
    }
    return { value_to_contain: values.join(',') };
},

/**
 * Validates if given value is valid date
 * @message Parameter must be valid date
 * @example ...'|date|'
 * @param value
 * @return {boolean}
 */
date(value) {
    return !isNaN(Date.parse(value)) || {};
},

/**
 * Validates if given value is correct email
 * @message Parameter must be correct e-mail
 * @example ...'|email|'
 * @param value
 * @return {boolean|{value}}
 */
email(value) {
    return emailRegex.test(value) || { value };
},

/**
 * @param value
 * @return {boolean|{value}}
 */
phone(value) {
    value = String(value);
    return /^\d{7,}$/.test(value.replace(/[\s()+\-\.]|ext/gi, '')) || { value };
},

/**
 * Validates if given value ends with given suffix
 * @message Parameter must end with Value
 * @example ...'|ends_with:foo|'
 * @param value
 * @param suffix
 * @return {boolean|{suffix: string}}
 */
ends_with(value, suffix) {
    suffix = String(suffix);
    value = String(value);
    return (
        value.indexOf(suffix, value.length - suffix.length) !== -1 || { suffix }
    );
},

/**
 * Validates if given value equals to given parameter
 * @message Parameter must equal to Value
 * @example ...'|equals:foo|'
 * @param value
 * @param param
 * @return {boolean|{value}}
 */
equals(value, param) {
    return String(value) === String(param) || { value: param };
},

/**
 * Validates if given value is in given array
 * @message Parameter is invalid
 * @example ...'|in_array:1,2,a,b,c|'
 * @param value
 * @param arr
 * @return {boolean|{value: string}}
 */
in_array(value, ...arr) {
    return arr.indexOf(String(value)) > -1 || { value: arr.join(',') };
},

/**
 * Validates if given value is valid IP Address
 * @message Parameter must be valid ip adress
 * @example ...'|ip|'
 * @param value
 * @return {boolean|{value}}
 */
ip(value) {
    return ipRegex.test(value) || { value };
},

/**
 * Validates if given value is valid json
 * @message Parameter must be valid json
 * @example ...'|json|'
 * @param value
 * @return {{}|boolean}
 */
json(value) {
    try {
        JSON.parse(String(value));
        return true;
    } catch (e) {
        return {};
    }
},

/**
 * Returns error if given value is less than given parameter, if value is not numeric compares string length
 * @message Parameter cant be greater than Value
 * @example ...'|max:20|'
 * @param value
 * @param max
 * @return {{max}|boolean}
 */
max(value, max) {
    if (typeof value === 'string') {
        if (value.length <= max) return true;
    } else if (typeof value !== undefined) {
        if (value <= max) return true;
    }
    return { max };
},

/**
 * Returns error if given value is greater than given parameter, if value is not numeric compares string length
 * @message Parameter cant be less than Value
 * @example ...'|min:20|'
 * @param value
 * @param min
 * @return {{min}|boolean}
 */
min(value, min) {
    if (typeof value === 'string') {
        if (value.length >= min) return true;
    } else if (typeof value !== undefined) {
        if (value >= min) return true;
    }
    return { min };
},

/**
 * Returns error if given value is less than given parameter  -- compares string length
 * @message Parameter cant be greater than Value
 * @example ...'|max_length:20|'
 * @param value
 * @param max
 * @return {{max}|boolean}
 */
max_length(value, max) {
    if (typeof value === 'string') {
        if (value.length <= max) return true;
    }
    
    return { max };
},

/**
 * Returns error if given value is greater than given parameter -- compares string length
 * @message Parameter cant be less than Value
 * @example ...'|min_length:20|'
 * @param value
 * @param min
 * @return {{min}|boolean}
 */
min_length(value, min) {
    if (typeof value === 'string') {
        if (value.length >= min) return true;
    }
    
    return { min };
},

/**
 * Validates if given value don't equals to given parameter
 * @message Parameter can't be Value
 * @example ...'|not_equals:foo|'
 * @param value
 * @param param
 * @return {boolean|{value}}
 */
not_equals(value, param) {
    return String(value) !== String(param) || { value: param };
},

/**
 * Validates if given value is not in given array
 * @message Parameter cant be Value
 * @example ...'|not_in:1,2,a,b,c|'
 * @param value
 * @param arr
 * @return {boolean|{value}}
 */
not_in(value, ...arr) {
    return arr.indexOf(String(value)) === -1 || { value };
},

/**
 * Validates if given value contains only digits
 * @message Parameter can only contain numbers
 * @example ...'|numeric|'
 * @param value
 * @return {boolean|{value}}
 */
numeric(value) {
    return /^-?\d+$/.test(value) || { value };
},

/**
 * Validates if given value is object
 * @message Parameter must be object
 * @example ...'|object|'
 * @param value
 * @return {boolean|{value}}
 */
object(value) {
    return (typeof value === 'object' && !Array.isArray(value)) || { value };
},

/**
 * @param value
 * @param prefix
 * @return {boolean|{prefix: string}}
 */
starts_with(value, prefix) {
    prefix = String(prefix);
    value = String(value);
    return value.indexOf(prefix) === 0 || { prefix };
},

/**
 * Validates if given value is valid URl
 * @message Parameter must be valid URL
 * @example ...'|url|'
 * @param value
 * @return {{value}|boolean}
 */
url(value) {
    try {
        new URL(value);
        return true;
    } catch (e) {
        return { value };
    }
}