54. Form Builder

interface FormField {
  id: string;
  type: "text" | "email" | "number" | "textarea" | "select";
  label: string;
  name: string;
  placeholder?: string;
  required?: boolean;
  options?: string[]; // For select fields
  min?: number; // For number fields
  max?: number; // For number fields
}

interface FormData {
  [fieldName: string]: string | number;
}

const fields: FormField[] = [
  { id: "1", type: "text", label: "Name", name: "name", required: true },
  { id: "2", type: "email", label: "Email", name: "email", required: true },
  { id: "3", type: "number", label: "Age", name: "age", min: 0, max: 120 },
];

<FormBuilder fields={fields} onSubmit={(data) => console.log(data)} />