# @avinlab/form

> ## Install

Latest version **0.4.0** (published 2025-10-05) · MIT license · 0 weekly downloads

## Install

```sh
npm install @avinlab/form
pnpm add @avinlab/form
yarn add @avinlab/form
bun add @avinlab/form
```

## Health

**Score 60/100 (C)** — status: stable.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads; pre 1.0.

## Facts

| | |
|---|---|
| Version | 0.4.0 |
| Published | 2025-10-05 |
| First published | 2023-11-06 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 43.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Avin Lambrero |
| Maintainers | carcinogen75 |
| Keywords | form |

## Links

- npm: https://www.npmjs.com/package/@avinlab/form
- npm.io page: https://npm.io/package/@avinlab/form

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 0.4.0 (latest) — 2025-10-05
- 0.5.0-alpha.0 (alpha) — 2026-08-12
- 0.3.2 — 2024-06-05
- 0.3.1 — 2024-06-05
- 0.3.0 — 2024-04-01
- 0.2.1 — 2023-12-09
- 0.2.0 — 2023-12-09
- 0.1.3 — 2023-11-06
- 0.1.2 — 2023-11-06

## README

# @avinlab/form

## Install

```sh
npm install @avinlab/form
```

## Usage

Create a form and manage its values:

```js
import { createForm } from '@avinlab/form';

// Create a form with initial values
const initialValues = { name: 'John', age: 30 };
const form = createForm(initialValues);

// Subscribe to updates
const handleUpdateForm = (newValues, prevValues) => {
  console.log('Form updated', { newValues, prevValues });
};
form.onUpdate(handleUpdateForm);

const handleUpdateAgeField = (newValue, oldValue) => {
  console.log('Field "age" updated', { newValue, oldValue });
};
form.onUpdateField('age', handleUpdateAgeField);

// Set form values
form.setValue('name', 'Jane');
form.setValue('age', 31);

// Set all form values at once
form.setValues({ name: 'Jane', age: 31 });

// Unsubscribe from updates
form.offUpdate(handleUpdateForm);
form.offUpdateField('age', handleUpdateAgeField);
```

Form validation management:

```js
import { createForm, createFormValidation } from '@avinlab/form';

const initialValues = { name: 'John', age: 30 };
const form = createForm(initialValues);

const formValidation = createFormValidation(form, (values) => {
  const errors = {};
  if (!values.name) {
    errors.name = 'Name is required';
  }
  if (values.age && values.age < 18) {
    errors.age = 'Must be at least 18';
  }
  return errors;
});

console.log(formValidation.errors); // Output: {}
console.log(formValidation.isValid); // Output: true

// Set an incorrect value for the age field
form.setValue('age', 15);

console.log(formValidation.errors); // Output: {age: 'Must be at least 18'}
console.log(formValidation.isValid); // Output: false

// Subscribe to validation changes
const handler = (errors) => {
  console.log(errors);
};
formValidation.onValidate(handler);

// Unsubscribe from validation updates
formValidation.offValidate(handler);

// Validation is triggered automatically when the form values change,
// but you can also initiate validation manually
formValidation.validate();
```

---
_Source: https://npm.io/package/@avinlab/form · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
