Registry / storage / react-hook-form-persist

react-hook-form-persist

JSON →
library3.0.0jsnpmunverified

Persist and rehydrate react-hook-form state using localStorage, sessionStorage, or any custom storage engine. Current stable version 3.0.0. Works with react-hook-form 7+ (v3) and 6+ (v2). Lightweight alternative to formik-persist, with first-class TypeScript support and automatic debounced saving. Low maintenance, mature API.

npm install react-hook-form-persist
INSTALL
IMPORT
SIG · REACT-HOOK-FORM-PE
R
react-hook-form-persist
storagejavascriptv3.0.0
harness data pending
Install & Compatibility
Where this runs

No compatibility data collected yet for this library.

Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

useFormPersist
import { useFormPersist } from 'react-hook-form-persist'
const useFormPersist = require('react-hook-form-persist')
ESM-only; named export. CommonJS require will fail in v3.
default import
import useFormPersist from 'react-hook-form-persist'
const { useFormPersist } = require('react-hook-form-persist')
Hooks are exported as default and named. Default also works.
useFormPersist (react-hook-form 6)
import { useFormPersist } from 'react-hook-form-persist'
import useFormPersist from 'react-hook-form-persist/v2'
Same import path for v6, but watch 'name' vs 'watch' difference in options.

Demonstrates persisting react-hook-form state to localStorage with a storage key.

import React from 'react'; import { useForm } from 'react-hook-form'; import { useFormPersist } from 'react-hook-form-persist'; function App() { const { register, handleSubmit, watch, setValue } = useForm(); useFormPersist('form-key', { watch, setValue }); const onSubmit = (data) => console.log(data); return ( <form onSubmit={handleSubmit(onSubmit)}> <input {...register('firstName')} /> <input type="submit" /> </form> ); }
Debug
Known issues
breakingv3 changed option 'name' to 'watch' to align with react-hook-form v7
fix
Replace 'name' prop with 'watch' in config.
affects: >=3.0.0 <3.0.0
gotchaForm state is serialized to JSON; functions, dates, and circular references will be lost
fix
Only store primitive and plain object data.
affects: >=0.0.0
gotchaStorage key collisions: using the same key for multiple forms causes data corruption
fix
Use unique keys per form instance.
affects: >=0.0.0
deprecatedv2 'name' option deprecated in v3
fix
Upgrade to v3 and rename to 'watch'.
affects: >=2.0.0 <3.0.0
Errors
Common errors & fixes
TypeError: Cannot read properties of undefined (reading 'subscribe')
Missing 'watch' function in config object
fix
Pass { watch: watch } from useForm() to useFormPersist() options.
Error: useFormPersist requires react-hook-form 6 or higher
Using an incompatible version of react-hook-form
fix
Ensure react-hook-form is version 6+.
Warning: useFormPersist: Storage key already in use
Duplicate keys across multiple forms
fix
Use a unique key for each useFormPersist call.
Failed to parse stored form state: SyntaxError: Unexpected token u in JSON
Corrupted or invalid JSON in storage
fix
Clear the stored value in localStorage or handle gracefully.
Upgrade
Version history
3.0.0latest on npm
Audit
Dependencies
react-hook-formrequiredPeer dependency required to hook into form state
Agent activity
34 hits · last 30 days
node
32
Amazon
1
OpenAI (training)
1
Resources
react-hook-form-persist — npm install react-hook-form-persist · libregistry