Idea
Add a Formik-specific adapter that mirrors the existing formdraft/rhf pattern. Formik is at 3.85M weekly downloads; formik-persist (Jared Palmer's own package) has been unmaintained since 2018. The market gap is verified.
Proposed API
```tsx
import { useFormik } from 'formik';
import { useFormDraftFormik } from 'formdraft/formik';
import { zodAdapter } from 'formdraft';
const formik = useFormik({
initialValues: { name: '', bio: '' },
onSubmit: async (v) => api.submitProfile(v),
});
const { status, lastSavedAt, discard } = useFormDraftFormik(formik, {
key: 'profile-form',
schema: zodAdapter(Schema),
sync: api.saveProfile,
});
```
Implementation notes
- Same pattern as `useFormDraftRHF` (~50 LOC)
- Subscribe to `formik.values` via `useEffect` (no `watch` API in Formik like RHF)
- On restore, call `formik.setValues(draft.values)`
- Guard against the watch→reset feedback loop (see `hasRestoredRef` pattern in RHF adapter)
File structure
- `src/formik/index.ts`
- `src/formik/useFormDraftFormik.ts`
- `src/formik/tests/useFormDraftFormik.test.tsx`
- Add subpath export in `package.json`
- Add tsup entry
Tests
Mirror the 2 RHF adapter tests:
- Persists Formik values on input change
- Restores into Formik on mount when storage has valid draft
Acceptance
- New subpath export `formdraft/formik`
- 2+ unit tests passing
- README mentions Formik integration in install section
- Bundle still under 8 KB (Formik adapter goes into its own chunk)
Idea
Add a Formik-specific adapter that mirrors the existing
formdraft/rhfpattern. Formik is at 3.85M weekly downloads;formik-persist(Jared Palmer's own package) has been unmaintained since 2018. The market gap is verified.Proposed API
```tsx
import { useFormik } from 'formik';
import { useFormDraftFormik } from 'formdraft/formik';
import { zodAdapter } from 'formdraft';
const formik = useFormik({
initialValues: { name: '', bio: '' },
onSubmit: async (v) => api.submitProfile(v),
});
const { status, lastSavedAt, discard } = useFormDraftFormik(formik, {
key: 'profile-form',
schema: zodAdapter(Schema),
sync: api.saveProfile,
});
```
Implementation notes
File structure
Tests
Mirror the 2 RHF adapter tests:
Acceptance