# doz-formfield

> All form elements component for DOZ

Latest version **1.0.0** (published 2020-06-23) · MIT license · 0 weekly downloads

## Install

```sh
npm install doz-formfield
pnpm add doz-formfield
yarn add doz-formfield
bun add doz-formfield
```

## Health

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

Positive: no vulnerabilities.

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

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.0 |
| Published | 2020-06-23 |
| First published | 2019-03-12 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 99.6 KB |
| Known vulnerabilities | 0 (+24 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 2 |
| Author | Pietro Lembo |
| Maintainers | p.lembo |
| Keywords | doz, component |

## Links

- npm: https://www.npmjs.com/package/doz-formfield
- Repository: https://github.com/dozjs-cmp/doz-formfield
- Homepage: https://github.com/dozjs-cmp/doz-formfield#readme
- Issues: https://github.com/dozjs-cmp/doz-formfield/issues
- npm.io page: https://npm.io/package/doz-formfield

## Dependencies (2)

- [axios](https://npm.io/package/axios.md) ^0.18.0
- [typis](https://npm.io/package/typis.md) ^1.1.1

## Recent versions

- 1.0.0 (latest) — 2020-06-23
- 0.5.0 — 2019-05-23
- 0.4.0 — 2019-05-14
- 0.3.0 — 2019-05-13
- 0.2.1 — 2019-05-13
- 0.2.0 — 2019-05-13
- 0.1.9 — 2019-05-07
- 0.1.8 — 2019-04-10
- 0.1.7 — 2019-04-10
- 0.1.6 — 2019-04-10
- 0.1.5 — 2019-03-22
- 0.1.4 — 2019-03-14
- 0.1.3 — 2019-03-12
- 0.1.2 — 2019-03-12

## README

# doz-formfield
All form elements component for DOZ

## Install
```
npm install --save doz-formfield
```

Live <a href="https://dozjs-cmp.github.io/doz-formfield/dist/">here</a>

## Usage

Globally
```javascript
import Doz from 'doz'

new Doz({
        root: '#app',
        template(h) {
            return h`
                <div>
                    <doz-formfield type="text" label="Insert your name" name="name" required="true"/>
                </div>
                <div>
                    <doz-formfield type="text" label="Insert your surname" name="surname" required="true"/>
                </div>
                <div>
                    <doz-formfield type="select" label="Male or female" name="select" options='["male","female"]' required="true"/>
                </div>
                <div>
                    <doz-formfield type="textarea" label="Insert a message" name="textarea" required="true"/>
                </div>
                <div>
                    <doz-formfield type="url" label="Url Type" name="url" value="http://www.google.it"/>
                </div>
            `
        }
    });
```

Locally
```javascript
import Doz from 'doz'
import DozFormfield from 'doz-formfield/lib'

Doz.component('my-wrapper', {
    components: {
        'also-a-custom-name': DozFormfield
    },
    template() {
        return `
            <also-a-custom-name 
                type="checkbox" 
                label="True or flase" name="checkbox" 
                required="true"
            />
        `
    }
});

new Doz({
    root: '#app',
    template: `
        <my-wrapper></my-wrapper>
    `
})
```

## Props
| Name | Default | Description |
| ---- | ------- | ----------- |
| type | text | The type of the component (text, textarea, select, checkbox, url) |
| name | | Input name |
| classField | | CSS field class |
| value | | The initial value for the component |
| required | false | Set the required field |
| disabled | false | Set the disabled field |
| forceupdate | false | Set the forceupdate field |
| showOpenUrl | true | If the type is url, it gives the possibility to open the link |

## Events

| Name | Args | Description |
| ---- | ------- | ----------- |

## Changelog
You can view the changelog <a target="_blank" href="https://github.com/dozjs-cmp/doz-formfield/blob/master/CHANGELOG.md">here</a>

## License
doz-formfield is open-sourced software licensed under the <a target="_blank" href="http://opensource.org/licenses/MIT">MIT license</a>

## Author
Pietro Lembo

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