LexiFill 📝

Intelligent Document Auto-Fill System

LexiFill is a modern web application that streamlines the process of filling out legal documents and templates. Upload any document with placeholders, and LexiFill will intelligently extract them, create a user-friendly form, and generate a completed document ready for use.

🌟 Features

• Smart Placeholder Detection - Automatically identifies placeholders in multiple formats:

  • [PLACEHOLDER] - Standard bracket format ✅
  • {{PLACEHOLDER}} - Double curly brace format ✅
  • $[_______] - Currency placeholders (partial support) ⚠️
  • _____________ - Underscore/blank line format (No support yet)

• AI-Powered Analysis - Uses Google Gemini AI to:

  • Generate conversational questions for each placeholder
  • Determine the appropriate input type (text, date, currency)
  • Provide contextual hints based on surrounding text
  • Prioritize fields intelligently

• Interactive Form Builder - Creates dynamic forms with:

  • Text inputs for names and addresses
  • Date pickers for dates
  • Currency inputs with proper formatting
  • Contextual hints for each field

• Document Preview - Real-time preview of your filled document

• AI Chat Assistant - Interactive chatbot that helps you:

  • Understand complex legal terminology
  • Get guidance on how to fill specific fields
  • Ask questions about the document in natural language
  • Receive contextual suggestions based on the document type
  • Navigate through the form efficiently

• Export Options - Download completed documents in various formats

🚀 Getting Started

Prerequisites

• Node.js (v16 or higher)
• npm or yarn
• Google Gemini API key (optional - enhances analysis quality, but app works without it using pattern matching fallback)

Installation

1. Clone the repository:

git clone https://github.com/Nisarg20/LexiFill.git
cd LexiFill

2. Install dependencies:

npm install
# or
yarn install

3. Create a .env file in the root directory:

VITE_GEMINI_API_KEY=your_gemini_api_key_here

4. Start the development server:

npm run dev
# or
yarn dev

5. Open your browser and navigate to http://localhost:5173

🔑 Getting Your Gemini API Key

1. Visit Google AI Studio
2. Click "Create API Key"
3. Copy the generated key
4. Add it to your .env file as VITE_GEMINI_API_KEY

Note: The application works in two modes:

• With API key: Gemini AI provides intelligent analysis, conversational questions, and context-aware hints
• Without API key: Falls back to pattern-based analysis using keyword matching (less sophisticated but functional)

📖 How to Use

Step 1: Upload Your Document

• Click the upload area or drag and drop a .docx file
• Supported formats: Word documents (.docx)

Step 2: Review Detected Placeholders

• LexiFill automatically extracts all placeholders
• Each placeholder is analyzed for context
• Fields are prioritized (company names first, then amounts, dates, etc.)

Step 3: Fill Out the Form

• Answer each question in the generated form
• Use the hints provided for guidance
• All fields are validated based on their type
• Need help? Click the chat icon to open the AI assistant
  • Ask questions about specific fields
  • Get explanations for legal terms
  • Request examples or clarifications

Step 4: Generate Document

• Click "Generate Document" when ready
• Preview the completed document
• Download your filled document

🏗️ Architecture

LexiFill follows a modern client-side architecture with AI integration:

System Flow

1. Document Upload → User uploads a .docx file through the FileUpload component
2. Text Extraction → Mammoth.js extracts raw text content from the document
3. Placeholder Detection → Custom regex patterns identify placeholders in various formats (REQUIRED step)
   • Supports [PLACEHOLDER], {{PLACEHOLDER}}, and $[_____] formats
   • Extracts paragraph context for each placeholder
4. AI Analysis (Optional with Fallback) → Google Gemini API analyzes detected placeholders to:
   • Generate conversational questions for each placeholder
   • Determine appropriate input types (text, date, currency)
   • Extract contextual hints from surrounding text
   • Prioritize fields based on importance
   • Fallback: If no API key or AI fails, uses pattern-based analysis (keyword matching)
5. Form Generation → PlaceholderForm component dynamically creates input fields
6. User Input → User fills out the generated form with real values
7. Document Generation → Original document is recreated with placeholders replaced
8. Preview & Export → User can preview and download the completed document

Component Architecture

App.tsx (Main Container)
├── FileUpload.tsx
│   └── Handles document upload and initial extraction
├── PlaceholderForm.tsx
│   ├── Generates dynamic form fields
│   ├── Validates user input
│   └── Manages form state
├── DocumentPreview.tsx
│   └── Shows real-time preview of filled document
└── ChatAssistant.tsx
    ├── AI-powered conversational interface
    └── Helps users fill out complex forms

Data Flow

User Document 
    ↓
Mammoth.js (Extract Text)
    ↓
Regex Patterns (Extract Placeholders) ← ALWAYS RUNS
    ↓
Found Placeholders with Context
    ↓
    ├─→ [Has API Key?] 
    │        ↓ YES
    │   Gemini AI Analysis
    │        ↓
    │   [Success?]
    │        ↓ YES              ↓ NO
    │   Enhanced Metadata   →  Fallback
    │                            Pattern
    └─→ [No API Key] → Fallback Matching
                       Pattern 
                       Matching
    ↓
Form Fields → User Input → Filled Document

Two Analysis Modes

Mode 1: AI-Powered (with Gemini API key)

• Gemini analyzes each placeholder with its paragraph context
• Generates natural, conversational questions
• Provides context-aware hints from surrounding text
• Intelligently determines field types and priorities
• Falls back to pattern matching if API call fails

Mode 2: Pattern Matching (without API key or as fallback)

• Uses keyword-based analysis (determinePlaceholderType())
• Generates questions from placeholder text (generateQuestion())
• Provides generic hints based on field type (generateHint())
• Less sophisticated but fully functional

State Management

• React useState hooks manage component-level state
• Props drilling for sharing data between components
• No external state management library (Redux/Context) needed due to simple architecture

🛠️ Technology Stack

Frontend

• React - UI framework
• TypeScript - Type-safe JavaScript
• Vite - Build tool and dev server

Document Processing

• Mammoth.js - Extract text from Word documents
• python-docx (planned) - Generate filled documents

AI & Intelligence

• Regex Pattern Extraction - Primary placeholder detection using custom patterns (always runs)
• Google Gemini API - Optional AI-powered analysis for enhanced question generation and field typing
• Pattern-based Fallback - Keyword matching system when AI is unavailable

Styling

• CSS Modules - Scoped component styling
• Modern, responsive design

📁 Project Structure

LexiFill/
├── src/
│   ├── components/
│   │   ├── FileUpload.tsx          # Document upload component
│   │   ├── PlaceholderForm.tsx     # Dynamic form generator
│   │   ├── DocumentPreview.tsx     # Preview component
│   │   └── ChatAssistant.tsx       # AI chat helper
│   ├── utils/
│   │   └── extractPlaceholders.ts  # Core extraction logic
│   ├── App.tsx                      # Main application
│   ├── main.tsx                     # Entry point
│   └── index.css                    # Global styles
├── public/                          # Static assets
├── .env                             # Environment variables
├── package.json                     # Dependencies
├── tsconfig.json                    # TypeScript config
├── vite.config.ts                   # Vite configuration
└── README.md                        # This file

🧪 Testing Documents

The repository includes sample legal documents for testing:

• NDA Template - Non-Disclosure Agreement with [PLACEHOLDER] format
• Employment Agreement - Uses {{PLACEHOLDER}} format
• Service Agreement - Contains underscore blanks
• Lease Agreement - Mixed format with checkboxes

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

1. Fork the repository
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

📝 Supported Document Types

Currently Supported

• ✅ Word Documents (.docx)
• ✅ Templates with standard placeholders

🐛 Known Issues & Limitations

• Gemini API key enhances analysis quality but is not required (falls back to pattern matching)
• Underscore placeholders (_______) are not yet fully supported
• Documents without any placeholders will show an error
• Some complex placeholder formats may need manual review
• Large documents (>100 pages) may take longer to process
• Pattern-based fallback provides basic analysis (less sophisticated than AI mode)

🔒 Privacy & Security

• All document processing happens in your browser
• No documents are stored on external servers
• API calls are made directly to Google's Gemini API
• Your data never touches our servers

💡 Use Cases

• Legal Firms - Quickly fill out contracts, agreements, and legal documents
• HR Departments - Process employment agreements and onboarding documents
• Real Estate - Complete lease agreements and property documents
• Startups - Handle SAFE agreements, NDAs, and investor documents
• Individuals - Fill any template document efficiently

---