# de-form

> Create forms by declarations

Latest version **0.0.4** (published 2017-10-16) · MIT license · 0 weekly downloads

## Install

```sh
npm install de-form
pnpm add de-form
yarn add de-form
bun add de-form
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.4 |
| Published | 2017-10-16 |
| First published | 2017-08-01 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Known vulnerabilities | 0 (+3 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Jakub Chadim |
| Maintainers | jakubchadim |

## Links

- npm: https://www.npmjs.com/package/de-form
- Repository: https://github.com/jakubchadim/de-form
- Homepage: https://github.com/jakubchadim/de-form.git#readme
- Issues: https://github.com/jakubchadim/de-form/issues
- npm.io page: https://npm.io/package/de-form

## Dependencies (1)

- [validator](https://npm.io/package/validator.md) ^7.0.0

## Recent versions

- 0.0.4 (latest) — 2017-10-16
- 0.0.3 — 2017-08-02
- 0.0.2 — 2017-08-01
- 0.0.1 — 2017-08-01

## README

# de-form
Create form by definitions

### Example
```javascript
import {createForm, Fields, Validators} from 'de-form'

const ERROR_MESSAGES = {
  REQUIRED: 'Reqired field'
}
const MIN_USER_NAME_LENGTH = 3

// ===========  Fields declaration  ============ //

const name = Fields.Text({
  label: 'Name',
  placeholder: 'Peter'
}, [
  Validators.minLength(`Minimal length is ${MIN_USER_NAME_LENGTH}`, MIN_USER_NAME_LENGTH)
]).isRequired()

const age = Fields.Text({
  label: 'Age'
}, [
  Validators.Number('Age must be number')
]).isRequired()

const password = Fields.Text({
  label: 'Password'
}).isRequired(ERROR_MESSAGES.REQUIRED)

const child = Fields.Shape({
  name,
  age
})

const children = Fields.ArrayOf(child)

const send = Fields.Submit({
  label: 'Save'
})

// =========== Create form  ============ //

const Form = createForm({
  name,
  age,
  password,
  children,
  send
})
```

Now we can call many actions on form object

```javascript
// ===========  Validate  ============ //

const values = {
  userName: 'Peter',
  age: 32,
  password: 'pw',
  childrens: [
    {
      name: 'Kid',
      age: 7
    }
  ]
}


console.log(Form.isValid(values))
console.log(Form.getErrors(values))
```

## Fields

### Props

Each field has own properties. For example Label, Placeholder etc... Properties can be used in renderer.

```javascript
const props = {
  label: 'Text field',
  placeholder: 'Enter something...'
}

Fields.Text(props)
```

### Validations

Fields can receive array of validation functions.

```javascript
const validations = [
  Validations.minLength('Min. length is 5.', 5)
]

Fields.Text(null, validations)
```

##### email(errorMessage)

##### isFilled(errorMessage)

##### length(errorMessage, length)

##### minLength(errorMessage, minLength)

##### maxLength(errorMessage, maxLength)

#### Custom validation

You can also write custom validations. Validation function returns error message or null.

```javascript
const customValidation = (value, values) => {
  return value !== 'Some value' ? 'Error' : null
}

Fields.Text(null, [
  customValidation
])
```

### Field Types

##### ArrayOf(field)

##### Shape({fields})

##### Text([props, validations])

##### Textarea([props, validations])

##### Email([props, validations])

##### Password([props, validations])

##### Checkbox([props, validations])

##### CheckboxList([props, validations])

##### Select([props, validations])

##### MultiSelect([props, validations])

##### Upload([props, validations])

##### MultiUpload([props, validations])

##### RadioList([props, validations])

##### Submit([props, validations])

##### Button([props, validations])

##### Hidden([props, validations])

---
_Source: https://npm.io/package/de-form · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._