react-inline-forms v0.0.1-alpha.1

react-inline-forms

React components for inline form editing

react-inline-forms allows to transform any bit of html into a form by simply clicking it, while keeping control on how you handle submission and change. It handles text and select inputs.

Installation

NPM:

$ npm install react-inline-forms

Yarn:

$ yarn add react-inline-forms

Example

import React, { Component } from 'react'
import { RIInput } from 'react-inline-forms'

class App extends Component {
  constructor(props) {
    super(props)

    this.state = {
      name: '',
    }

    this.handleSubmit = this.handleSubmit.bind(this)
  }

  handleSubmit() {
    // Needs to return a Promise

  }

  handleChange(e) {
    const name = e.target.name
    const value = e.target.value
  }


  render() {
    const { name } = this.state

    return (
      <div>
        <RIInput
          onFormSubmit={this.handleSubmit}
          onInputChange={this.handleChange}
        >
          <p>{name}</p>
        </RInput>
      </div>
    )
}