cee-validate - npm Package Compare versions

Comparing version 0.1.14 to 0.1.15

dist/cee-validate.es5.js

@@ -0,1 +1,2 @@
+import 'vue';
 import { Component, Vue } from 'vue-property-decorator';
@@ -51,2 +52,14 @@ import dayjs from 'dayjs-ext';
 
+/**
+ * Check value's constructor name.
+ * @param {*} value
+ * @param {String} constructor
+ * @returns {Boolean}
+ *
+ * @author Victor Luiz Cavalcanti <[e-mail],>
+ */
+var is = function (value, constructor) {
+    return Object.prototype.toString.call(value) === "[object " + constructor + "]";
+};
+
 var Field = /** @class */ (function () {
@@ -73,3 +86,3 @@ function Field(options) {
         get: function () {
-            if (!this._vm || !this._vm.$validator)
+            if (!this._vm || !is(this._vm.$validator, 'ScopedValidator'))
                 return function () { return []; };
@@ -244,9 +257,9 @@ return this._vm.$validator.validate.bind(this._vm.$validator);
 /**
- * Validate if the given value is not empty
+ * Checks if all characters in a given value are alphanumeric (letters
+ * and numbers), ignores whitespace.
  *
- * @param {Any} value - The value of the input to be validated.
+ * @param {String} value - the input value to be tested.
+ * @returns {boolean}
  *
- * @returns {boolean} True if the given value is not empty, false otherwise.
- *
- * @author Erik Isidore, Viniazvd
+ * @author Viniazvd, Erik Isidore
  * @version 0.1
@@ -256,16 +269,30 @@ */
     validate: function (value) {
-        if (Array.isArray(value))
-            return !!value.length;
-        if (typeof value === 'object')
-            return !!Object.keys(value).length;
-        if (typeof value === 'string')
-            return !!value.trim().length;
-        if (typeof value === 'number')
-            return !!value;
-        return !!value;
+        return /^\s*([0-9a-zA-Z]*)\s*$/.test(value);
     },
-    message: 'Campo obrigatório.'
+    message: 'Deve conter apenas letras e números'
 };
-RuleContainer.add('required', rule);
+RuleContainer.add('alphanumeric', rule);
 
+/**
+ * Executes a callback or an array of callbacks with `value` as an argument
+ * and returns true if every callback passes
+ *
+ * @param {Any} value - the input value to be validated.
+ * @param {Function | Array<Function>} - The callback or array of callbacks
+ * to be called on the value.
+ * @returns {boolean} - Returns true if every callback passes, false otherwise.
+ *
+ * @author Viniazvd, Erik Isidore
+ * @version 0.1
+ */
+var rule$1 = {
+    validate: function (value, callbacks) {
+        return Array.isArray(callbacks)
+            ? callbacks.every(function (f) { return f(value); })
+            : callbacks(value);
+    },
+    message: 'Campo inválido'
+};
+RuleContainer.add('custom', rule$1);
+
 var commonjsGlobal = typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
@@ -293,3 +320,2 @@
  * string, otherwise this parameter is completely ignored.
- *
  * @returns {boolean} True if the given value is valid, false otherwise.
@@ -300,3 +326,3 @@ *
  */
-var rule$1 = {
+var rule$2 = {
     validate: function (value, format) {
@@ -309,13 +335,78 @@ if (format === void 0) { format = 'DD/MM/YYYY'; }
 };
-RuleContainer.add('date_format', rule$1);
+RuleContainer.add('date_format', rule$2);
 
+/**
+ * Checks if all characters in a given value are numeric, ignores whitespace.
+ *
+ * @param {String} value - The input value to be validated.
+ * @returns {Boolean}
+ *
+ * @author Viniazvd, Erik Isidore
+ * @version 0.1
+ */
+var rule$3 = {
+    validate: function (value) {
+        return /^\s*([0-9]*)\s*$/.test(value);
+    },
+    message: 'Deve conter apenas números.'
+};
+RuleContainer.add('numeric', rule$3);
+
+/**
+ * Receives a value and a regular expression and returns the result of
+ * executing the regex on the value.
+ *
+ * @param {String} value - Input value.
+ * @param {Regex} regex - Regular expression object.
+ * @returns {boolean}
+ *
+ * @author Erik Isidore
+ * @version 0.1
+ */
+var rule$4 = {
+    validate: function (value, regex) {
+        if (!is(value, 'String') || !is(regex, 'RegExp'))
+            return false;
+        return !!value && regex.test(value);
+    },
+    message: 'Format inválido.'
+};
+RuleContainer.add('regex', rule$4);
+
+/**
+ * Validate if the given value is not empty
+ *
+ * @param {Any} value - The value of the input to be validated.
+ * @returns {boolean} True if the given value is not empty, false otherwise.
+ *
+ * @author Viniazvd, Erik Isidore
+ * @version 0.1
+ */
+var rule$5 = {
+    validate: function (value) {
+        if (Array.isArray(value))
+            return !!value.length;
+        if (typeof value === 'object')
+            return !!Object.keys(value).length;
+        if (typeof value === 'string')
+            return !!value.trim().length;
+        if (typeof value === 'number')
+            return !!value;
+        return !!value;
+    },
+    message: 'Campo obrigatório.'
+};
+RuleContainer.add('required', rule$5);
+
 var ScopedValidator = /** @class */ (function () {
-    function ScopedValidator(vm) {
+    function ScopedValidator(vm, options) {
         this.scopes = [];
         this.validations = {};
+        this.options = {};
         this._vm = vm;
         this.fields = new FieldBag();
-        if (vm.$options.validation)
-            this.init(vm.$options.validation);
+        this.options = options;
+        console.log('scopedValidator.options: ', options);
     }
+    // Maybe this $nextTick isn't really necessary, we have to re-evaluate that
     ScopedValidator.prototype.init = function (template) {
@@ -380,13 +471,11 @@ this._vm.$nextTick(this.initFields.bind(this, template));
     };
-    /*
-    registerGetters () {
-      const Vue = this._vm.$options._base
-      const options = this._vm.$options
-  
-      if (!options.computed) options.computed = { }
-  
-      Vue.util.defineReactive(this, 'validations', this.validations)
-      options.computed['$validations'] = () => this.validations
-    }
-    */
+    ScopedValidator.prototype.registerGetters = function () {
+        var _this = this;
+        var Vue$$1 = this._vm.$options._base;
+        var options = this._vm.$options;
+        if (!options.computed)
+            options.computed = {};
+        Vue$$1.util.defineReactive(this, 'validations', this.validations);
+        options.computed['$validations'] = function () { return _this.validations; };
+    };
     ScopedValidator.prototype.validate = function (fieldName, scope) {
@@ -429,2 +518,3 @@ var field = this.fields.get(fieldName, scope);
     }
+    FormValidator_1 = FormValidator;
     // In the future we'll use this function to pass mixin options
@@ -434,12 +524,16 @@ // and make some checkings before instantiating the ScopedValidator
         var _this = this;
-        // Get Vue constructor
-        var Vue$$1 = this.$options._base;
-        this.$validator = new ScopedValidator(this);
-        // Setup computed properties on the component
-        if (!this.$options.computed)
-            this.$options.computed = {};
-        Vue$$1.util.defineReactive(this.$validator, 'validations', this.$validator.validations);
-        this.$options.computed['$validations'] = function () { return _this.$validator.validations; };
+        this.$validator = {
+            init: function (template) {
+                console.log('initializing.... ', _this, ' template: ', template);
+                console.log('options', FormValidator_1.options);
+                _this.$validator = new ScopedValidator(_this, FormValidator_1.options);
+                _this.$validator.init(template);
+            }
+        };
+        if (this.$options.validation)
+            this.$validator.init(this.$options.validation);
     };
-    FormValidator = __decorate([
+    var FormValidator_1;
+    FormValidator.options = {};
+    FormValidator = FormValidator_1 = __decorate([
         Component
@@ -449,4 +543,2 @@ ], FormValidator);
 }(Vue));
-
-export default FormValidator;
 //# sourceMappingURL=cee-validate.es5.js.map

dist/cee-validate.umd.js

 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('vue-property-decorator'), require('dayjs-ext')) :
-    typeof define === 'function' && define.amd ? define(['vue-property-decorator', 'dayjs-ext'], factory) :
-    (global['dist/cee-validate'] = global['dist/cee-validate'] || {}, global['dist/cee-validate'].umd = global['dist/cee-validate'].umd || {}, global['dist/cee-validate'].umd.js = factory(global.vuePropertyDecorator,global.dayjs));
-}(this, (function (vuePropertyDecorator,dayjs) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(require('vue'), require('vue-property-decorator'), require('dayjs-ext')) :
+    typeof define === 'function' && define.amd ? define(['vue', 'vue-property-decorator', 'dayjs-ext'], factory) :
+    (factory(global.Vue,global.vuePropertyDecorator,global.dayjs));
+}(this, (function (Vue,vuePropertyDecorator,dayjs) { 'use strict';
 
+    Vue = Vue && Vue.hasOwnProperty('default') ? Vue['default'] : Vue;
     dayjs = dayjs && dayjs.hasOwnProperty('default') ? dayjs['default'] : dayjs;
@@ -56,2 +57,14 @@
 
+    /**
+     * Check value's constructor name.
+     * @param {*} value
+     * @param {String} constructor
+     * @returns {Boolean}
+     *
+     * @author Victor Luiz Cavalcanti <[e-mail],>
+     */
+    var is = function (value, constructor) {
+        return Object.prototype.toString.call(value) === "[object " + constructor + "]";
+    };
+
     var Field = /** @class */ (function () {
@@ -78,3 +91,3 @@ function Field(options) {
             get: function () {
-                if (!this._vm || !this._vm.$validator)
+                if (!this._vm || !is(this._vm.$validator, 'ScopedValidator'))
                     return function () { return []; };
@@ -249,9 +262,9 @@ return this._vm.$validator.validate.bind(this._vm.$validator);
     /**
-     * Validate if the given value is not empty
+     * Checks if all characters in a given value are alphanumeric (letters
+     * and numbers), ignores whitespace.
      *
-     * @param {Any} value - The value of the input to be validated.
+     * @param {String} value - the input value to be tested.
+     * @returns {boolean}
      *
-     * @returns {boolean} True if the given value is not empty, false otherwise.
-     *
-     * @author Erik Isidore, Viniazvd
+     * @author Viniazvd, Erik Isidore
      * @version 0.1
@@ -261,16 +274,30 @@ */
         validate: function (value) {
-            if (Array.isArray(value))
-                return !!value.length;
-            if (typeof value === 'object')
-                return !!Object.keys(value).length;
-            if (typeof value === 'string')
-                return !!value.trim().length;
-            if (typeof value === 'number')
-                return !!value;
-            return !!value;
+            return /^\s*([0-9a-zA-Z]*)\s*$/.test(value);
         },
-        message: 'Campo obrigatório.'
+        message: 'Deve conter apenas letras e números'
     };
-    RuleContainer.add('required', rule);
+    RuleContainer.add('alphanumeric', rule);
 
+    /**
+     * Executes a callback or an array of callbacks with `value` as an argument
+     * and returns true if every callback passes
+     *
+     * @param {Any} value - the input value to be validated.
+     * @param {Function | Array<Function>} - The callback or array of callbacks
+     * to be called on the value.
+     * @returns {boolean} - Returns true if every callback passes, false otherwise.
+     *
+     * @author Viniazvd, Erik Isidore
+     * @version 0.1
+     */
+    var rule$1 = {
+        validate: function (value, callbacks) {
+            return Array.isArray(callbacks)
+                ? callbacks.every(function (f) { return f(value); })
+                : callbacks(value);
+        },
+        message: 'Campo inválido'
+    };
+    RuleContainer.add('custom', rule$1);
+
     var commonjsGlobal = typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
@@ -298,3 +325,2 @@
      * string, otherwise this parameter is completely ignored.
-     *
      * @returns {boolean} True if the given value is valid, false otherwise.
@@ -305,3 +331,3 @@ *
      */
-    var rule$1 = {
+    var rule$2 = {
         validate: function (value, format) {
@@ -314,13 +340,78 @@ if (format === void 0) { format = 'DD/MM/YYYY'; }
     };
-    RuleContainer.add('date_format', rule$1);
+    RuleContainer.add('date_format', rule$2);
 
+    /**
+     * Checks if all characters in a given value are numeric, ignores whitespace.
+     *
+     * @param {String} value - The input value to be validated.
+     * @returns {Boolean}
+     *
+     * @author Viniazvd, Erik Isidore
+     * @version 0.1
+     */
+    var rule$3 = {
+        validate: function (value) {
+            return /^\s*([0-9]*)\s*$/.test(value);
+        },
+        message: 'Deve conter apenas números.'
+    };
+    RuleContainer.add('numeric', rule$3);
+
+    /**
+     * Receives a value and a regular expression and returns the result of
+     * executing the regex on the value.
+     *
+     * @param {String} value - Input value.
+     * @param {Regex} regex - Regular expression object.
+     * @returns {boolean}
+     *
+     * @author Erik Isidore
+     * @version 0.1
+     */
+    var rule$4 = {
+        validate: function (value, regex) {
+            if (!is(value, 'String') || !is(regex, 'RegExp'))
+                return false;
+            return !!value && regex.test(value);
+        },
+        message: 'Format inválido.'
+    };
+    RuleContainer.add('regex', rule$4);
+
+    /**
+     * Validate if the given value is not empty
+     *
+     * @param {Any} value - The value of the input to be validated.
+     * @returns {boolean} True if the given value is not empty, false otherwise.
+     *
+     * @author Viniazvd, Erik Isidore
+     * @version 0.1
+     */
+    var rule$5 = {
+        validate: function (value) {
+            if (Array.isArray(value))
+                return !!value.length;
+            if (typeof value === 'object')
+                return !!Object.keys(value).length;
+            if (typeof value === 'string')
+                return !!value.trim().length;
+            if (typeof value === 'number')
+                return !!value;
+            return !!value;
+        },
+        message: 'Campo obrigatório.'
+    };
+    RuleContainer.add('required', rule$5);
+
     var ScopedValidator = /** @class */ (function () {
-        function ScopedValidator(vm) {
+        function ScopedValidator(vm, options) {
             this.scopes = [];
             this.validations = {};
+            this.options = {};
             this._vm = vm;
             this.fields = new FieldBag();
-            if (vm.$options.validation)
-                this.init(vm.$options.validation);
+            this.options = options;
+            console.log('scopedValidator.options: ', options);
         }
+        // Maybe this $nextTick isn't really necessary, we have to re-evaluate that
         ScopedValidator.prototype.init = function (template) {
@@ -385,13 +476,11 @@ this._vm.$nextTick(this.initFields.bind(this, template));
         };
-        /*
-        registerGetters () {
-          const Vue = this._vm.$options._base
-          const options = this._vm.$options
-      
-          if (!options.computed) options.computed = { }
-      
-          Vue.util.defineReactive(this, 'validations', this.validations)
-          options.computed['$validations'] = () => this.validations
-        }
-        */
+        ScopedValidator.prototype.registerGetters = function () {
+            var _this = this;
+            var Vue$$1 = this._vm.$options._base;
+            var options = this._vm.$options;
+            if (!options.computed)
+                options.computed = {};
+            Vue$$1.util.defineReactive(this, 'validations', this.validations);
+            options.computed['$validations'] = function () { return _this.validations; };
+        };
         ScopedValidator.prototype.validate = function (fieldName, scope) {
@@ -434,2 +523,3 @@ var field = this.fields.get(fieldName, scope);
         }
+        FormValidator_1 = FormValidator;
         // In the future we'll use this function to pass mixin options
@@ -439,12 +529,16 @@ // and make some checkings before instantiating the ScopedValidator
             var _this = this;
-            // Get Vue constructor
-            var Vue = this.$options._base;
-            this.$validator = new ScopedValidator(this);
-            // Setup computed properties on the component
-            if (!this.$options.computed)
-                this.$options.computed = {};
-            Vue.util.defineReactive(this.$validator, 'validations', this.$validator.validations);
-            this.$options.computed['$validations'] = function () { return _this.$validator.validations; };
+            this.$validator = {
+                init: function (template) {
+                    console.log('initializing.... ', _this, ' template: ', template);
+                    console.log('options', FormValidator_1.options);
+                    _this.$validator = new ScopedValidator(_this, FormValidator_1.options);
+                    _this.$validator.init(template);
+                }
+            };
+            if (this.$options.validation)
+                this.$validator.init(this.$options.validation);
         };
-        FormValidator = __decorate([
+        var FormValidator_1;
+        FormValidator.options = {};
+        FormValidator = FormValidator_1 = __decorate([
             vuePropertyDecorator.Component
@@ -455,5 +549,3 @@ ], FormValidator);
 
-    return FormValidator;
-
 })));
 //# sourceMappingURL=cee-validate.umd.js.map

dist/types/core/scopedValidator.d.ts

@@ -14,3 +14,4 @@ import { Vue as VueComponent } from 'vue-property-decorator';
     validations: object;
-    constructor(vm: VueComponent);
+    private options;
+    constructor(vm: VueComponent, options: object);
     init(template: FormTemplate): void;
@@ -20,2 +21,3 @@ initFields(template: FormTemplate): void;
     getFieldEl(field: FieldTemplate, scope?: string): Element;
+    registerGetters(): void;
     validate(fieldName: string, scope?: string): void;
@@ -22,0 +24,0 @@ validateAll(scope?: string): void;

dist/types/index.d.ts

@@ -1,7 +0,1 @@
-import { Vue } from 'vue-property-decorator';
-import ScopedValidator from './core/scopedValidator';
-export default class FormValidator extends Vue {
-    $validator: ScopedValidator;
-    $validations: object;
-    beforeCreate(): void;
-}
+export {};

dist/types/rules/index.d.ts

@@ -0,2 +1,6 @@
+export { default as alphanumeric } from './alphanumeric';
+export { default as custom } from './custom';
+export { default as dateFormat } from './dateFormat';
+export { default as numeric } from './numeric';
+export { default as regex } from './regex';
 export { default as required } from './required';
-export { default as date_format } from './date_format';

dist/types/rules/required.d.ts

@@ -0,1 +1,2 @@
+import { ValidationRule } from '../types';
 /**
@@ -5,12 +6,8 @@ * Validate if the given value is not empty
  * @param {Any} value - The value of the input to be validated.
- *
  * @returns {boolean} True if the given value is not empty, false otherwise.
  *
- * @author Erik Isidore, Viniazvd
+ * @author Viniazvd, Erik Isidore
  * @version 0.1
  */
-declare const rule: {
-    validate: (value: any) => boolean;
-    message: string;
-};
+declare const rule: ValidationRule;
 export default rule;

package.json

 {
   "name": "cee-validate",
-  "version": "0.1.14",
+  "version": "0.1.15",
   "description": "A model-based form validation library for vue inspired by vuelidate and vee-validate.",
@@ -5,0 +5,0 @@ "module": "dist/cee-validate.es5.js",

README.md

@@ -1,29 +0,135 @@
-# convenia-validator-ex
+<h1 align="center">vue-convenia-validator</h1>
 
-## Project setup
-```
-yarn install
-```
+vue-convenia-validator is a model-based form validation library for Vue.js
+inspired by Vuelidate and VeeValidate. Unlike Vuelidate and VeeValidate,
+vue-convenia-validator is meant to be used as a mixin rather than as a plugin.
 
-### Compiles and hot-reloads for development
+
+### Installation
+
+#### npm
+
 ```
-yarn run serve
+npm install cee-validate --save
 ```
 
-### Compiles and minifies for production
+#### yarn
+
 ```
-yarn run build
+yarn add cee-validate
 ```
 
-### Run your tests
+### Usage
+
+vue-convenia-validator is a model-based, template-independent validation library,
+which means that it is completely decoupled from how you build your templates.
+In order to use your component has to define a `validation` option object
+defining the validation rules for your form(s):
+
+```vue
+<template>
+  <div id="vue-app">
+    <form>
+      <input name="fullName" type="text" v-model="fullName" />
+      <input name="birthday" type="text" v-model="birthday" />
+    </form>
+  </div>
+<template>
+
+<script>
+import FormValidator from 'cee-validate'
+
+export default {
+  mixins: [ FormValidator ],
+
+  data () {
+    return {
+      fullName: '',
+      birthday: ''
+    }
+  }
+
+  validation: {
+    fullName: 'required',
+    birthday: 'required|date_format:DD/MM/YYYY'
+  }
+}
+<script>
 ```
-yarn run test
-```
 
-### Lints and fixes files
+The `name` attribute on the `<input />` fields here is necessary for the mixin
+to be able to listen for certain events on the form elements. The `name`
+attribute is only necessary on the `<form>` tag when using scoped forms:
+
+```vue
+<template>
+  <div id="vue-app">
+    <form name="formOne">
+      <input name="fullName" type="text" v-model="formOne.fullName" />
+      <input name="birthday" type="text" v-model="formOne.birthday" />
+    </form>
+
+    <form name="formTwo">
+      <input name="fullName" type="text" v-model="formTwo.fullName" />
+      <input name="birthday" type="text" v-model="formTwo.birthday" />
+      <input name="age" type="number" v-model="formTwo.age" />
+    </form>
+  </div>
+<template>
+
+<script>
+import FormValidator from 'cee-validate'
+
+export default {
+  mixins: [ FormValidator ],
+
+  data () {
+    return {
+      formOne: {
+        fullName: '',
+        birthday: ''
+      },
+      formTwo: {
+        fullName: '',
+        birthday: ''
+      }
+    }
+  }
+
+  validation: {
+    formOne: {
+      fullName: 'required',
+      birthday: 'required|date_format:DD/MM/YYYY'
+    },
+    formTwo: {
+      fullName: 'required',
+      birthday: 'required|date_format:DD/MM/YYYY'
+      age: 'numeric'
+    }
+  }
+}
+<script>
 ```
-yarn run lint
-```
 
-### Customize configuration
-See [Configuration Reference](https://cli.vuejs.org/config/).
+### To-do
+
+- Implement rules
+  - [x] alphanumeric - Checks if all characters in a string are alphanumeric.
+  - [x] custom - Executes a callback or array of callbacks with input value as argument.
+  - [x] dateFormat - Checks if value is a valid date.
+  - [x] numeric - Check if all characters in a string are numbers.
+  - [x] regex - Tests a RegExp on value.
+  - [x] required - Checks if value isn't empty.
+  - [ ] dateBetween - Checks if date is in between two date values.
+  - [ ] dateBefore - Checks if given date comes before another date.
+  - [ ] dateAfter - Cheks if given date comes after another date.
+  - [ ] between - Checks if number is in between two values.
+  - [ ] email - Checks if value is a valid email address.
+  - [ ] url - Checks if value is a valid URL address.
+  - [ ] ip - Checks if value is a valid IP address.
+  - [ ] creditCard - Checks if value is a valid credit card number.
+
+- Implement unit tests
+- Improve project documentaion
+- Implement option to customize validation error messages
+- Implement vue directive

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

140186

increased by18.76%

Number of package files

22

increased by46.67%

Lines of code

1268

increased by24.44%

Number of lines in readme file

135

increased by350%

No dependency changes