Skip to content

A schema-driven form wizard library for React with validation, conditional logic, and theming

License

Notifications You must be signed in to change notification settings

GrandeVx/better-form

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

54 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Better Form Logo

Better Form

The most powerful form wizard library for React
Learn more »

Website · Issues

npm npm version GitHub stars

About the Project

Better Form is a schema-driven form wizard library for React. It provides multi-step forms, validation, conditional logic, and theming out of the box. Define complex forms with JSON configuration and let Better Form handle the rest—step navigation, field visibility, validation, and state management.

Why Better Form

Building multi-step forms in React is tedious. Existing solutions like React Hook Form or Formik are great for simple forms, but wizards require manual step management, conditional logic, and progress tracking. Better Form solves this with a declarative JSON schema approach—define your form structure once, and everything works automatically.

Quick Start

npm install @better_form/core
import { WizardContainer, AutoStep, type WizardConfig } from '@better_form/core';
import '@better_form/core/styles';

const config: WizardConfig = {
  id: 'my-form',
  steps: [
    {
      id: 'personal',
      title: 'Personal Info',
      fields: [
        { id: 'name', type: 'text', label: 'Name', required: true },
        { id: 'email', type: 'email', label: 'Email', required: true },
      ],
    },
  ],
};

function MyForm() {
  return (
    <WizardContainer config={config} onSubmit={(data) => console.log(data)}>
      <AutoStep />
    </WizardContainer>
  );
}

Features

  • Schema-Driven - Define forms with JSON/TypeScript configuration
  • Multi-Step Wizard - Built-in step management and progress tracking
  • Conditional Logic - Show/hide fields and steps based on form values
  • Validation - Required, patterns, min/max, and custom validators
  • Theming - Full customization with CSS variables or theme presets
  • TypeScript - Complete type safety with inference
  • Plugin System - Extend with custom field types

Documentation

Visit docs.better-form.eu for full documentation, guides, and API reference.

Contribution

Better Form is a free and open source project licensed under the MIT License. You are free to do whatever you want with it.

You could help continuing its development by:

Security

If you discover a security vulnerability within Better Form, please open an issue on GitHub.

All reports will be promptly addressed, and you'll be credited accordingly.

About

A schema-driven form wizard library for React with validation, conditional logic, and theming

Topics

Resources

License

Stars

Watchers

Forks