Installation

Get started with @seanblock/form-builder in your React or Next.js project.

Package Installation

Install the package using your preferred package manager:

# npm
npm install @seanblock/form-builder

# yarn
yarn add @seanblock/form-builder

# pnpm
pnpm add @seanblock/form-builder

Dependencies

The form builder requires the following peer dependencies:

• react >= 18.0.0
• react-dom >= 18.0.0

The package includes these built-in dependencies (automatically installed):

• crypto-js - For secure encryption of sensitive data 🔒
• lucide-react - Icon library for UI components

TypeScript Support

The package includes TypeScript definitions out of the box. No additional @types packages needed!

Next.js Configuration

If you're using Next.js, make sure you have the following in your tsconfig.json:

{
  "compilerOptions": {
    "paths": {
      "@seanblock/form-builder": ["./node_modules/@seanblock/form-builder"],
      "@seanblock/form-builder/blocks": ["./node_modules/@seanblock/form-builder/blocks"]
    }
  }
}

Verify Installation

Create a simple test to verify everything is working:

import FormBuilderV3 from '@seanblock/form-builder';

export default function Test() {
  const config = {
    id: "test",
    type: "form",
    initialPage: "page1",
    pages: {
      page1: {
        id: "page1",
        blockType: "PageBlock",
        blocks: []
      }
    }
  };

  return <FormBuilderV3 config={config} context={{}} />;
}