D98c_dynamic-forms NPM

d98c_dynamic-forms

React Dynamic Form with Formik and Yup validations

Install

npm install --save d98c_dynamic-forms

Usage

import React, { Component } from 'react'

import DynamicForm from 'd98c_dynamic-forms'

class Example extends Component {
  render() {
    return (
      <DynamicForm
        formInputs={formInputs}
        onSubmit={(values) => console.log(values)}
      />
    )
  }
}

Input Required Object

You should provide an object array with the data for the input fields, following the next schema.

const formInputs = [
 {
    name: string,
    value: string | number | boolean,

    placeholder?: string,
    label?: string,
    inline?: 'true' | 'false',

    type: 'text' | 'radio-group' | 'email' | 'password' | 'select' | 'checkbox' | 'header',
    typeValue?: 'string' /* default */ | 'boolean' | 'number' | '',
    options?: [
      {
        value: string | number
        desc: string
      }
    ],
    //See validations section
    validations: [
      {
        type: 'required'
        value?: string
        message: string
      }
    ]
  }
]