# @anissoft/state

> Tiny and fast library for observable state management

Latest version **1.0.7** (published 2023-04-13) · MIT license · 0 weekly downloads

## Install

```sh
npm install @anissoft/state
pnpm add @anissoft/state
yarn add @anissoft/state
bun add @anissoft/state
```

## Health

**Score 35/100 (D)** — status: abandoned.

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

Warnings: low downloads; no esm support.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 1.0.7 |
| Published | 2023-04-13 |
| First published | 2020-12-14 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 13.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Alexey |
| Maintainers | anissoft |
| Keywords | javascript, observable, state |

## Links

- npm: https://www.npmjs.com/package/@anissoft/state
- Repository: https://github.com/Anissoft/js-libs
- Homepage: https://github.com/Anissoft/js-libs/tree/master/packages/state#readme
- Issues: https://github.com/Anissoft/js-libs/issues
- npm.io page: https://npm.io/package/@anissoft/state

## Dependencies (1)

- [proxy-polyfill](https://npm.io/package/proxy-polyfill.md) ^0.3.2

## Alternatives

- [@reckona/mreact-store](https://npm.io/package/@reckona/mreact-store.md) — 976 weekly downloads
- [regular-state](https://npm.io/package/regular-state.md) — 410 weekly downloads
- [@pacote/flux-actions](https://npm.io/package/@pacote/flux-actions.md) — 65 weekly downloads
- [@pilotlab/lux-debug](https://npm.io/package/@pilotlab/lux-debug.md) — 39 weekly downloads
- [vue-persist-state](https://npm.io/package/vue-persist-state.md) — 19 weekly downloads

## Recent versions

- 1.0.7 (latest) — 2023-04-13
- 1.0.4 — 2022-10-31
- 1.0.3 — 2022-06-24
- 1.0.2 — 2021-06-10
- 1.0.1 — 2021-04-02
- 1.0.0 — 2021-02-08
- 0.0.1 — 2020-12-14

## README

# Welcome to @anissoft/state 👋

Primitive, lightweight and well typed observables.

## Installation

Just run [`npm install`](https://docs.npmjs.com/getting-started/installing-npm-packages-locally) command:

```bash
$ npm install @anissoft/state --save
```

## Usage

You need to create State instance with specific type and pass initial value:

```typescript
import State from "@anissoft/state";

type User = {
  name: string;
  gender: "male" | "female";
  age: number;
};

const currentUser = new State<User>({
  name: "Jeremy",
  age: 25,
  gender: "male",
});

currentUser.value;
// stdout: { name: "Jeremy", age: 25, gender: "male" }

currentUser.get();
// stdout: { name: "Jeremy", age: 25, gender: "male" }

const unsubscribe = currentUser.subscribe((newValue, oldValue) => {
  console.log("Changed user info");
});

currentUser.value.age = 32;
// stdout: "Changed user info"

currentUser.get();
// stdout: { name: "Jeremy", age: 32, gender: "male" }

currentUser.set((value) => ({ ...value, name: "Mike" }));
// stdout: "Changed user info"

unsubscribe();
```

You can replace whole value and still has all observers running properly:

```typescript
currentUser.value = {
  name: "Mike",
  age: 19,
  gender: "male",
};
// stdout: "Changed user info"
```

You can specify condition, when observer should execute provided callback:

```typescript
const currentUser = new State({
  name: "Mike",
  age: 25,
  gender: "male",
});

const unsubscribe = currentUser.subscribe(
  (newValue, oldValue) => {
    const oldName = oldValue.name;
    const newName = newValue.name;
    console.log(`Changed username from ${oldName} to ${newName}.`);
  },
  (newValue, oldValue) => newValue.name !== oldValue.name
);

currentUser.value.age = 32;
// stdout nothing

currentUser.value.name = "Johannen";
// stdout: Changed username from Mike to Johannen
```

Common use case - classes that extends State class:

```typescript
type UserData = {
  login: string;
  firstname: string;
  lastname: string;
  preferences?: Record<string, string>
}
class User extends State<UserData> {
  constructor(initials: UserData) {
    super(initials);
    ...
  }

  public savePreferences(preferences) {
    this.set({ preferences })
  }
  ...
}
```

## Author

👤 **Alexey Anisimov**

- Github: [@Anissoft](https://github.com/Anissoft)

## 🤝 Contributing

Contributions, issues and feature requests are welcome!

Feel free to check [issues page](https://github.com/Anissoft/js-libs/issues).

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