[2.0.0] Breaking changes: validate => validators

Author: isnifer

CHANGELOG.md

@@ -1,3 +1,29 @@
+## 2.0.0
+
+### BREAKING CHANGES
+
+- Every Form Control now accepts `validators`—Array prop instead of `validate`
+
+```js
+// Now
+import { Input, validators } from '@detools/vue-form'
+
+<Input
+  validators={[validators.isRequired()]}
+/>
+
+// Before
+import { Input, validations } from '@detools/vue-form'
+
+<Input
+  validate={validations.validate([validations.isRequired()])}
+/>
+```
+
+### Updated
+
+- `isRequired` validator now supports Arrays, Objects.
+
 ## 1.5.0
 
 ### Added

README.md

@@ -78,6 +78,7 @@ See demo at [https://detools.github.io/vue-form](https://detools.github.io/vue-f
 
 ## Changelog
 
+- [2.0.0](/CHANGELOG.md#200)
 - [1.5.0](/CHANGELOG.md#150)
 - [1.4.4](/CHANGELOG.md#144)
 - [1.4.3](/CHANGELOG.md#143)
@@ -91,7 +92,7 @@ See demo at [https://detools.github.io/vue-form](https://detools.github.io/vue-f
   - `<Upload />`
   - `<Rate />`
 - Add validation examples
-  - [Field level sync validation](https://detools.github.io/vue-form/#inline-validations-form)
+  - [Field level sync validation](https://detools.github.io/vue-form/#inline-validators-form)
   - Form level sync validation
   - Field level async validation
   - Form level async validation

VueForm/ConnectedCheckbox.js

@@ -24,10 +24,7 @@ export default {
     checked: String,
     indeterminate: String,
 
-    validate: {
-      type: Function,
-      default: noop,
-    },
+    validators: Array,
 
     handleFocus: {
       type: Function,
@@ -52,7 +49,7 @@ export default {
   data() {
     const $registerFormComponent = resolveRegisterFormComponent(this)
 
-    return $registerFormComponent(this.name, this.value, this.validate)
+    return $registerFormComponent(this.name, this.value, this.validators)
   },
 
   destroyed() {

VueForm/ConnectedCheckboxGroup.js

@@ -43,10 +43,7 @@ export default {
     max: Number, // maximum number of checkbox checked
     border: Boolean,
 
-    validate: {
-      type: Function,
-      default: noop,
-    },
+    validators: Array,
 
     handleFocus: {
       type: Function,
@@ -82,7 +79,7 @@ export default {
       initialValue = castArray(initialValue)
     }
 
-    return $registerFormComponent(this.name, initialValue, this.validate)
+    return $registerFormComponent(this.name, initialValue, this.validators)
   },
 
   destroyed() {

VueForm/ConnectedDatePicker.js

@@ -72,10 +72,7 @@ export default {
     prefixIcon: String,
     clearIcon: String,
 
-    validate: {
-      type: Function,
-      default: noop,
-    },
+    validators: Array,
 
     handleFocus: {
       type: Function,
@@ -101,7 +98,7 @@ export default {
   data() {
     const $registerFormComponent = resolveRegisterFormComponent(this)
 
-    return $registerFormComponent(this.name, this.value, this.validate)
+    return $registerFormComponent(this.name, this.value, this.validators)
   },
 
   destroyed() {

VueForm/ConnectedInput.js

@@ -37,10 +37,7 @@ export default {
     form: String,
     tabindex: Number,
 
-    validate: {
-      type: Function,
-      default: noop,
-    },
+    validators: Array,
 
     handleFocus: {
       type: Function,
@@ -67,7 +64,7 @@ export default {
     const $registerFormComponent = resolveRegisterFormComponent(this)
 
     return {
-      ...$registerFormComponent(this.name, this.value, this.validate),
+      ...$registerFormComponent(this.name, this.value, this.validators),
       touched: false,
     }
   },

VueForm/ConnectedInputNumber.js

@@ -24,10 +24,7 @@ export default {
     controls: Boolean,
     controlsPosition: String,
 
-    validate: {
-      type: Function,
-      default: noop,
-    },
+    validators: Array,
 
     handleFocus: {
       type: Function,
@@ -53,7 +50,7 @@ export default {
   data() {
     const $registerFormComponent = resolveRegisterFormComponent(this)
 
-    return $registerFormComponent(this.name, this.value, this.validate)
+    return $registerFormComponent(this.name, this.value, this.validators)
   },
 
   destroyed() {

VueForm/ConnectedRadio.js

@@ -16,10 +16,7 @@ export default {
     border: Boolean,
     size: String,
 
-    validate: {
-      type: Function,
-      default: noop,
-    },
+    validators: Array,
 
     handleFocus: {
       type: Function,
@@ -44,7 +41,7 @@ export default {
   data() {
     const $registerFormComponent = resolveRegisterFormComponent(this)
 
-    return $registerFormComponent(this.name, this.value, this.validate)
+    return $registerFormComponent(this.name, this.value, this.validators)
   },
 
   destroyed() {

VueForm/ConnectedRadioGroup.js

@@ -37,10 +37,7 @@ export default {
     disabled: Boolean,
     border: Boolean,
 
-    validate: {
-      type: Function,
-      default: noop,
-    },
+    validators: Array,
 
     handleFocus: {
       type: Function,
@@ -66,7 +63,7 @@ export default {
   data() {
     const $registerFormComponent = resolveRegisterFormComponent(this)
 
-    return $registerFormComponent(this.name, this.value, this.validate)
+    return $registerFormComponent(this.name, this.value, this.validators)
   },
 
   destroyed() {

VueForm/ConnectedSelect.js

@@ -61,10 +61,7 @@ export default {
     popperAppendToBody: Boolean,
     automaticDropdown: Boolean,
 
-    validate: {
-      type: Function,
-      default: noop,
-    },
+    validators: Array,
 
     handleFocus: {
       type: Function,
@@ -101,7 +98,7 @@ export default {
       }
     }
 
-    return $registerFormComponent(this.name, initialValue, this.validate)
+    return $registerFormComponent(this.name, initialValue, this.validators)
   },
 
   destroyed() {