@cerebral/forms - npm Package Compare versions

Comparing version 3.2.1 to 3.2.2-1523952156059

package.json

 {
   "name": "@cerebral/forms",
-  "version": "3.2.1",
+  "version": "3.2.2-1523952156059",
   "description": "A computed form",
@@ -29,3 +29,3 @@ "main": "lib/index.js",
   "dependencies": {
-    "cerebral": "^4.2.1"
+    "cerebral": "^4.2.2-1523952156059"
   },
@@ -32,0 +32,0 @@ "nyc": {

README.md

 # @cerebral/forms
 
 ## Install
+
 **NPM**
@@ -9,2 +10,3 @@
 ## Description
+
 Forms are one of the most complex state management challenges out there. Before Cerebral was created I spent a lot of time developing [formsy-react](https://github.com/formsy/formsy-react), which is a library that tries to solve forms with internal state. With the release of Cerebral we got a chance to explore the space of solving forms complexity with external state instead. To this day I have a hard time recommending a solution and you should **not** see this addon as "the official way of managing forms with Cerebral". There is nothing wrong thinking of a form as a very complex input where you only pass data into Cerebral on the submit of the form.
@@ -15,3 +17,3 @@
 ```javascript
-import {Controller} from 'cerebral'
+import { Controller } from 'cerebral'
 import FormsProvider from '@cerebral/forms'
@@ -24,3 +26,3 @@
       rules: {
-        myAddedRule (value, arg, get) {
+        myAddedRule(value, arg, get) {
           // value of the field
@@ -41,4 +43,6 @@ value
       errorMessages: {
-        minLength (value, minLength) {
-          return `The length is ${value.length}, should be equal or more than ${minLength}`
+        minLength(value, minLength) {
+          return `The length is ${
+            value.length
+          }, should be equal or more than ${minLength}`
         }
@@ -52,2 +56,3 @@ }
 ## compute
+
 To use a form you use the **form** computed, pointing to the form. Typically:
@@ -57,9 +62,10 @@
 import React from 'react'
-import {connect} from '@cerebral/react'
-import {form} from '@cerebral/forms'
+import { connect } from '@cerebral/react'
+import { form } from '@cerebral/forms'
 
-export default connect({
-  form: form(state`path.to.form`)
-},
-  function MyForm ({form}) {
+export default connect(
+  {
+    form: form(state`path.to.form`)
+  },
+  function MyForm({ form }) {
     // Value of some field
@@ -91,9 +97,10 @@ form.someField.value
 import React from 'react'
-import {connect} from '@cerebral/react'
-import {field} from '@cerebral/forms'
+import { connect } from '@cerebral/react'
+import { field } from '@cerebral/forms'
 
-export default connect({
-  field: field(state`path.to.form.name`)
-},
-  function MyField ({field}) {
+export default connect(
+  {
+    field: field(state`path.to.form.name`)
+  },
+  function MyField({ field }) {
     // Value of some field
@@ -112,2 +119,3 @@ field.value
 ## defaultValue
+
 You can define a default value for your fields. When the form is **reset**, it will put back the default value:
@@ -127,2 +135,3 @@
 ## field
+
 A field is just an object with a `value` property:
@@ -141,2 +150,3 @@
 ## form
+
 A form is just an object in the state tree:
@@ -146,3 +156,4 @@
 {
-  myForm: {}
+  myForm: {
+  }
 }
@@ -152,2 +163,3 @@ ```
 ## isRequired
+
 Define field as required. This will make the field invalid if there is no value. By default forms identifies a value or not
@@ -168,2 +180,3 @@ using the **isValue** rule. You can change this rule if you want, look below.
 ## isValueRules
+
 You can change what defines a field as having a value. For example if your value is an array, you can use the **minLength** rule to
@@ -185,2 +198,3 @@ define a required minimum of 3 items in the array.
 ## nesting
+
 You can nest this however you want, even with array:
@@ -208,10 +222,12 @@
 ### isValidForm
+
 Diverge execution based on validity of a form.
 
 ```js
-import {state} from 'cerebral/tags'
-import {isValidForm} from '@cerebral/forms/operators'
+import { state } from 'cerebral/tags'
+import { isValidForm } from '@cerebral/forms/operators'
 
 export default [
-  isValidForm(state`my.form`), {
+  isValidForm(state`my.form`),
+  {
     true: [],
@@ -224,30 +240,29 @@ false: []
 ### resetForm
+
 Reset a form.
 
 ```js
-import {state} from 'cerebral/tags'
-import {resetForm} from '@cerebral/forms/operators'
+import { state } from 'cerebral/tags'
+import { resetForm } from '@cerebral/forms/operators'
 
-export default [
-  resetForm(state`my.form`)
-]
+export default [resetForm(state`my.form`)]
 ```
 
 ### setField
+
 When you change the value of a field you will need to use this operator. Note that you point to the field, not the field value.
 
 ```js
-import {state, props} from 'cerebral/tags'
-import {setField} from '@cerebral/forms/operators'
+import { state, props } from 'cerebral/tags'
+import { setField } from '@cerebral/forms/operators'
 
-export default [
-  setField(state`my.form.field`, props`value`)
-]
+export default [setField(state`my.form.field`, props`value`)]
 ```
 
 ## provider
+
 You can also access your forms in actions.
 
 ```js
-function myAction ({forms}) {
+function myAction({ forms }) {
   const form = forms.get('path.to.form')
@@ -258,6 +273,7 @@ }
 ### reset
+
 Reset the form to its default values (or empty string by default).
 
 ```js
-function myAction ({forms}) {
+function myAction({ forms }) {
   forms.reset('path.to.form')
@@ -268,6 +284,7 @@ }
 ### toJSON
+
 Typically you want to convert your forms to a plain value structure.
 
 ```js
-function myAction ({forms}) {
+function myAction({ forms }) {
   const form = forms.toJSON('path.to.form')
@@ -290,8 +307,9 @@ }
 ### updateErrorMessages
+
 Dynamically update global error messages:
 
 ```js
-function myAction ({forms}) {
+function myAction({ forms }) {
   forms.updateErrorMessages({
-    someRule () {}
+    someRule() {}
   })
@@ -302,8 +320,9 @@ }
 ### updateRules
+
 Dynamically update available rules:
 
 ```js
-function myAction ({forms}) {
+function myAction({ forms }) {
   forms.updateRules({
-    someNewRule () {}
+    someNewRule() {}
   })
@@ -314,2 +333,3 @@ }
 ## validationRules
+
 You add validation rules on the field:
@@ -329,2 +349,3 @@
 ### equals:Value
+
 ```js
@@ -348,2 +369,3 @@ {
 ### equalsField:Field
+
 ```js
@@ -367,2 +389,3 @@ {
 ### isAlpha
+
 ```js
@@ -386,2 +409,3 @@ {
 ### isAlphanumeric
+
 ```js
@@ -405,2 +429,3 @@ {
 ### isEmail
+
 ```js
@@ -424,2 +449,3 @@ {
 ### isEmpty
+
 ```js
@@ -443,2 +469,3 @@ {
 ### isExisty
+
 ```js
@@ -462,2 +489,3 @@ {
 ### isFalse
+
 ```js
@@ -481,2 +509,3 @@ {
 ### isFloat
+
 ```js
@@ -499,4 +528,4 @@ {
 
+### isInt
 
-### isInt
 ```js
@@ -520,2 +549,3 @@ {
 ### isLength:Number
+
 ```js
@@ -538,4 +568,4 @@ {
 
+### isNumeric
 
-### isNumeric
 ```js
@@ -559,2 +589,3 @@ {
 ### isSpecialWords
+
 ```js
@@ -578,2 +609,3 @@ {
 ### isTrue
+
 ```js
@@ -597,2 +629,3 @@ {
 ### isUndefined
+
 ```js
@@ -616,2 +649,3 @@ {
 ### isUrl
+
 ```js
@@ -635,2 +669,3 @@ {
 ### isWords
+
 ```js
@@ -654,2 +689,3 @@ {
 ### isValue
+
 ```js
@@ -677,2 +713,3 @@ {
 ### maxLength:Number
+
 ```js
@@ -696,2 +733,3 @@ {
 ### minLength:Number
+
 ```js
@@ -715,2 +753,3 @@ {
 ### regexp
+
 ```js
@@ -717,0 +756,0 @@ {

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

65859

increased by0.17%

Number of lines in readme file

725

increased by5.69%

Worsened metrics

Number of package files

35

decreased by-2.78%

Number of low quality alerts

2

increased by100%

Dependency changes

• Updatedcerebral@^4.2.2-1523952156059