Skip to main content

API Reference

Complete API reference for all Form Guardian packages.

Packages​

Form Guardian consists of three main packages, each designed for specific use cases:

@form-guardian/dom​

Universal DOM-based form autosave. Works with any framework or vanilla HTML forms.

  • Use when: You need framework-agnostic autosave
  • Perfect for: Vanilla JS, Vue, Angular, Svelte, or any DOM-based forms
  • Key features: Automatic field detection, security filters, TTL support

View DOM API Reference →

@form-guardian/react​

React hooks and components for form autosave. Built on top of @form-guardian/dom.

  • Use when: Building React applications
  • Perfect for: React Hook Form, Formik, controlled/uncontrolled forms
  • Key features: React hooks API, draft status tracking, controlled component support

View React API Reference →

@form-guardian/core​

Headless core for draft management. Framework-agnostic storage operations.

  • Use when: You need low-level draft management
  • Perfect for: Custom implementations, SSR, mobile apps
  • Key features: Direct storage access, custom backends, minimal overhead

View Core API Reference →

Quick Links​

Common Types​

FormAutosaveOptions​

Configuration options shared across packages.

interface FormAutosaveOptions<T> {
  debounceMs?: number;
  includeOrigin?: boolean;
  storagePrefix?: string;
  autoRestore?: boolean;
  ttl?: number | { days?: number; hours?: number; minutes?: number };
  blacklist?: string[];
  whitelist?: string[];
  onBeforeSave?: (values: T) => void | Promise<void>;
  onAfterSave?: (values: T) => void | Promise<void>;
  onBeforeRestore?: (values: T) => void | Promise<void>;
  onAfterRestore?: (values: T) => void | Promise<void>;
  onDraftExpired?: (draftId: string) => void | Promise<void>;
  batchSaveInterval?: number;
}

DraftData<T>​

Draft data structure used in storage.

interface DraftData<T> {
  values: T;
  updatedAt: number;
  formId?: string;
  origin?: string;
  ttl?: number | { days?: number; hours?: number; minutes?: number };
}

DraftMeta​

Draft metadata information.

interface DraftMeta {
  updatedAt: number;
  formId?: string;
  origin?: string;
  ttl?: number | { days?: number; hours?: number; minutes?: number };
}