https://github.com/bendrucker/zip-input

ZIP input component for virtual-dom
https://github.com/bendrucker/zip-input

Last synced: about 1 month ago
JSON representation

ZIP input component for virtual-dom

• Host: GitHub
• URL: https://github.com/bendrucker/zip-input
• Owner: bendrucker
• License: mit
• Created: 2015-08-01T16:51:16.000Z (over 9 years ago)
• Default Branch: master
• Last Pushed: 2019-08-19T21:47:26.000Z (about 5 years ago)
• Last Synced: 2024-09-19T19:10:40.157Z (about 2 months ago)
• Language: JavaScript
• Homepage:
• Size: 10.7 KB
• Stars: 3
• Watchers: 3
• Forks: 0
• Open Issues: 1
• Metadata Files:
  • Readme: readme.md
  • License: license

Awesome Lists containing this project

• awesome-virtual-dom - zip-input

README

        
# zip-input [![Build Status](https://travis-ci.org/bendrucker/zip-input.svg?branch=master)](https://travis-ci.org/bendrucker/zip-input) [![Greenkeeper badge](https://badges.greenkeeper.io/bendrucker/zip-input.svg)](https://greenkeeper.io/)

> ZIP input component for virtual-dom

* Validates inputs using [zippo](https://github.com/bendrucker/zippo)

* Strips non-numeric characters

* Limits to 5 characters

* Triggers the [large numeric keypad](https://github.com/bendrucker/numeric-pattern) on mobile

## Install

```

$ npm install --save zip-input

```

## Usage

```js

var ZipInput = require('zip-input')

var zipInput = ZipInput()

function render (state) {

  var vtree = ZipInput.render(state)

  //=> use virtual-dom to patch vtree into real DOM

}

zipInput(render)

```

## API

#### `ZipInput(data)` -> `function`

Create a new ZIP input observable state.

##### data

Type: `object`

The initial state of the input.

###### value

Type: `string`

The ZIP code.

#### `ZipInput.validate(state)` -> `boolean`

Validate the current ZIP code value.

#### `ZipInput.render(state, options) -> object`

Render a ZIP input state to a vtree object. `options` extend the defaults and are passed to [virtual-hyperscript](https://github.com/Matt-Esch/virtual-dom/tree/master/virtual-hyperscript)

## License

MIT © [Ben Drucker](http://bendrucker.me)