> ## Documentation Index
> Fetch the complete documentation index at: https://divyang-chhantbar-fastforms-2.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.
# AI-Powered Form Generation
> Generate fully functional forms from natural language descriptions using Groq AI
FastForms uses AI to transform your plain English descriptions into complete, validated form schemas. Simply describe what you need, and the system generates all fields, validation rules, and options automatically.
## How It Works
The AI generation system is powered by the **Groq SDK** with the `llama-3.3-70b-versatile` model, designed specifically for structured JSON output.
Users enter a natural language prompt describing the form they need. For example:
* "Create a customer feedback form with name, email, rating, and comments"
* "Job application form with personal info, work experience, and file upload"
* "Event registration with attendee details and meal preferences"
The system sends your prompt to Groq AI with a specialized system prompt that ensures structured JSON output matching the form schema format.
```typescript theme={null}
// lib/aiFormGeneration.ts:38-46
const completion = await groq.chat.completions.create({
messages: [
{ role: "system", content: systemPrompt },
{ role: "user", content: userPrompt }
],
model: "llama-3.3-70b-versatile",
temperature: 0.7,
max_tokens: 2000,
response_format: { type: 'json_object' }
});
```
The generated JSON is validated using Zod to ensure all fields meet requirements before creating the form in the database.
```typescript theme={null}
// app/api/forms/generate/route.ts:22-23
const schema = await generateFormSchema(prompt);
const parsedSchema = validateFormSchema(schema);
```
The validated form is saved to PostgreSQL via Prisma with a unique slug and set to unpublished by default.
```typescript theme={null}
// app/api/forms/generate/route.ts:25-32
const form = await prisma.forms.create({
data: {
userId,
title: parsedSchema.title,
fields: parsedSchema.fields,
isPublished: false,
},
});
```
## Supported Field Types
The AI can generate 9 different field types, each with appropriate validation and options:
**Type:** `text`
Basic text input with optional placeholder and validation.
```json theme={null}
{
"id": "full_name",
"type": "text",
"label": "Full Name",
"required": true,
"placeholder": "Enter your full name"
}
```
**Type:** `email`
Email input with built-in HTML5 validation.
```json theme={null}
{
"id": "email_address",
"type": "email",
"label": "Email Address",
"required": true,
"placeholder": "you@example.com"
}
```
**Type:** `number`
Numeric input with optional min/max validation.
```json theme={null}
{
"id": "age",
"type": "number",
"label": "Age",
"required": true,
"validation": {
"min": 0,
"max": 100
}
}
```
**Type:** `date`
Date picker input.
```json theme={null}
{
"id": "birth_date",
"type": "date",
"label": "Date of Birth",
"required": true
}
```
**Type:** `textarea`
Multi-line text input for longer responses.
```json theme={null}
{
"id": "comments",
"type": "textarea",
"label": "Additional Comments",
"required": false,
"placeholder": "Share your thoughts..."
}
```
**Type:** `select`
Dropdown with predefined options.
```json theme={null}
{
"id": "country",
"type": "select",
"label": "Country",
"required": true,
"options": ["USA", "Canada", "UK", "Australia"]
}
```
**Type:** `radio`
Single selection from visible options.
```json theme={null}
{
"id": "rating",
"type": "radio",
"label": "How satisfied are you?",
"required": true,
"options": ["Very Satisfied", "Satisfied", "Neutral", "Unsatisfied"]
}
```
**Type:** `checkbox`
Multiple selections allowed.
```json theme={null}
{
"id": "interests",
"type": "checkbox",
"label": "Select your interests",
"required": false,
"options": ["Sports", "Music", "Reading", "Travel"]
}
```
**Type:** `file`
File upload input.
```json theme={null}
{
"id": "resume",
"type": "file",
"label": "Upload Resume",
"required": true
}
```
**Field Rendering Status**: While the validation schema supports all 9 field types, the current UI implementation fully supports `text`, `email`, `textarea`, `number`, `select`, `radio`, and `checkbox` types. The `date` and `file` types are validated but display as "Unsupported field type" in the form preview and public submission pages.
## Example Prompts
**Prompt:**
```
Create a customer feedback form with name, email,
satisfaction rating (1-5 stars), product quality rating,
and a comments section
```
**Generated Form:**
* Full Name (text, required)
* Email (email, required)
* Satisfaction Rating (radio, 1-5 stars)
* Product Quality (select, Excellent/Good/Fair/Poor)
* Comments (textarea, optional)
**Prompt:**
```
Event registration form with attendee name, email,
number of guests, meal preference (vegetarian,
non-vegetarian, vegan), and dietary restrictions
```
**Generated Form:**
* Attendee Name (text, required)
* Email Address (email, required)
* Number of Guests (number, required)
* Meal Preference (radio, 3 options)
* Dietary Restrictions (textarea, optional)
**Prompt:**
```
Job application form with personal details, position
applying for, years of experience, skills (checkboxes),
and resume upload
```
**Generated Form:**
* Full Name (text, required)
* Email (email, required)
* Position (select, multiple roles)
* Years of Experience (number, required)
* Skills (checkbox, multiple options)
* Resume (file, required)
## AI System Prompt
The AI uses a carefully crafted system prompt to ensure consistent, valid output:
```typescript theme={null}
// lib/aiFormGeneration.ts:10-34
const systemPrompt = `
You are a form schema generator.
Generate a JSON form schema based on the user's requirements.
Return ONLY valid JSON in the following format:
{
"title": "Form Title",
"fields": [
{
"id" : "unique_field_id",
"type": "text" | "number" | "email" | "date" | "select" | "checkbox" | "radio" | "textarea" | "file",
"label": "Field Label",
"required": true | false,
"placeholder": "Placeholder text",
"options": ["Option 1", "Option 2"] // Only for select, checkbox, radio types
"validation": {
"min" : 0,
"max" : 100,
}
} ]
}
Support the following field types: text, number, email, date, select, checkbox, radio.
Make IDs unique and descriptive.
Ensure the JSON is well-formed.
`;
```
The `response_format: { type: 'json_object' }` parameter ensures Groq always returns valid JSON, reducing parsing errors.
## Error Handling
The system handles multiple error scenarios:
**Common Errors:**
* Empty or missing prompt → 400 Bad Request
* Invalid JSON from AI → Form generation failed
* Schema validation failure → Specific validation error
* Unauthorized access → 401 Unauthorized
```typescript theme={null}
// lib/aiFormGeneration.ts:59-62
catch (error) {
console.log("Groq API error : ", error);
throw new Error("Error in generating form schema");
}
```
## Schema Validation
All generated schemas are validated using Zod before database insertion:
```typescript theme={null}
// lib/validations.ts:4-28
const FormFieldSchema = z.object({
id: z.string().min(1),
type: z.enum([
"text", "email", "date", "number", "textarea",
"select", "radio", "checkbox", "file"
]),
label: z.string().min(1),
placeholder: z.string().optional(),
required: z.boolean().optional(),
options: z.array(z.string()).optional(),
validation: z.object({
min: z.number().optional(),
max: z.number().optional(),
minLength: z.number().optional(),
maxLength: z.number().optional(),
}).optional(),
});
```
The validator ensures that select, radio, and checkbox fields always have options, and that all field IDs are unique.
## API Endpoint
**POST** `/api/forms/generate`
**Request Body:**
```json theme={null}
{
"prompt": "Create a contact form with name, email, and message"
}
```
**Response:**
```json theme={null}
{
"success": true,
"formId": "cm123abc",
"slug": "contact-form-abc123",
"title": "Contact Form",
"message": "Form generated successfully"
}
```
**Implementation:** `app/api/forms/generate/route.ts`