@bellawatt/use-inputs

Opinionated Inputs Hook with Context, Query Strings, and Local Storage

Usage no npm install needed!

<script type="module">
  import bellawattUseInputs from 'https://cdn.skypack.dev/@bellawatt/use-inputs';
</script>

README

use-inputs

Opinionated Inputs Hook with Context, Query Strings, and Local Storage

NPM JavaScript Style Guide

Install

npm install --save @bellawatt/use-inputs

Usage

import React from 'react'
import { Inputs } from '@bellawatt/use-inputs'
import ChildComponent from './ChildComponent'

const ParentComponent = () => (
  <Inputs defaults={{name: 'Brandon'}}>
    <ChildComponent />
  </Inputs>
)

export default ParentComponent


import React from 'react'
import { useInputs } from '@bellawatt/use-inputs'

const ChildComponent = () => {
  const { setInput, name } = useInputs()

  return (
    <label>
      Name
      <input type="text" value={name} onChange={e => setInput({name: e.currentTarget.value})} />
    </label>
  )
}

export default ChildComponent

License

MIT © @bellawatt