A React component containing the dev tools for the React binding of Form Signals.

Features

• TypeScript - Written in TypeScript with full type support for optimal DX.
• Reactivity - Reactivity without abstractions thanks to Preact Signals.
• Validation - Built-in validation support, including adapters for validation schema libraries.
• Transformations - Transform values for the specific needs of your input fields.
• Field Groups - Group fields together to manage parts of a form independently.
• Async Data - Easily manage async initialisation, validation and submission.
• Arrays + Dynamic Objects - Utilize arrays and dynamic objects within your forms.
• React - React bindings for easy integration with React.
• Dev Tools - Offers a dev tools component to debug your forms.

Install

npm install @formsignals/dev-tools-react

If you have not installed the React bindings of the form library, check out @formsignals/form-react installation.

Quickstart

Just add the FormDevTools component to your React app within the FormProvider you want to debug.

import { useForm } from '@formsignals/form-react';
import { FormDevTools } from '@formsignals/dev-tools-react';

export default function App() {
  const form = useForm()

  return (
    <form.FormProvider>
      <FormDevTools />
      {/* Your app here */}
    </form.FormProvider>
  );
}

Preview